冒頭にお伝えしておきますが、エックスサーバーは、私も愛用しており、高速で機能はとても充実しています。
本記事では、エックスサーバーでメルマガ配信をするときにメルマガ自動登録機能をワードプレスに設置する方法を解説しています。
こちらもどうぞ:ブログ作成に大きな味方!サボって稼げる完全外注化マニュアル「FAAP」
自分のブログサイトで読者に向けてメルマガの登録フォームを設置したいと考えた時に、どの配信スタンドを利用すればよいのか色々選択肢があります。
例えば「エキスパートメールクラウド」や「アスメル」など有料のメルマガ配信スタンドを利用するか、「まぐまぐ」のような無料配信スタンドを利用するか、それぞれに長所短所があり、費用対効果を考えないといけません。
初心者の場合、最初からお金をかけたくないと思う方も多いと思います。
考え方は、色々あるとして、たとえばレンタルサーバー契約がエックスサーバーの場合、無料でメルマガ配信機能があるのですが、意外と見過ごしている方も多いのではないでしょうか?
スポンサーリンク
目次
エックスサーバーのメルマガ自動登録機能を使ってみた
エックスサーバーのサーバーパネルにログインして、真ん中あたりに「メール」という箇所の「メーリングリスト・メールマガジン」をクリックします。
配信の準備段階でメルマガ登録の受付確認・完了メールや退会確認メールなどの各項目は、ある程度システム化されており、あとは環境設定で独自の情報を入力すればすぐに始められるシンプルで簡単なツールです。
次にメーリングリスト・メールマガジンを設定するドメインを選択してください。
すると画面が、次のように変わりますので、「管理ツールURL」をクリックします。
準備が整ったら自分のブログサイトに自動登録機能を利用して登録フォームを貼り付けるのですが、それには2種類の方法があります。
スポンサーリンク
・空メール自動登録用メールアドレスを利用する方法
専用アドレスをメルマガ募集ページに貼り付けて読者に空メールを送信してもらって送信元のメールアドレスを自動的にユーザー登録する。
・自動登録専用フォームを利用する方法
この中にも登録用フォーム・退会用フォーム・登録退会用フォームの3種類あって、それぞれに設置タグが用意されていますので、どれか一つをブログページに設置して、読者はメールアドレスを記入して登録ボタンをクリックすると案内メールが自動配信される仕組みです。
今回、自分で送信テストを行った結果、一つ目の空メール送信の方法は、簡単に繋がりすぐにできました。
問題なのは、もう一つの登録用フォームを利用する方法ですが、実際にテストしてみると、なかなか、うまくいきません。
ビジュアルエディタとテキストエディタ
これは、本記事の本題となる部分なのですが、ワードプレスを使用してブログサイトを運営している方はご存じだと思いますが、ワードプレスの記事投稿の編集では、ビジュアルエディタとHTMLコードでタグ編集するテキストエディタの2種類の文章作成方法があります。
一般的に、HTMLコードのスキルがありタグに詳しい人の場合は、テキストで編集しますが、初心者の場合は、ビジュアルで編集する方が優しいしHTMLのスキルがなくてもある程度、記事編集は可能です。
テキストでないと編集できないときだけ、ビジュアルからテキストに切り替えてマップや広告バナーなどのHTMLコードを貼り付けるという編集方法をしている人も多いのではないでしょうか。
今回の、エックスサーバーのメルマガ自動登録機能の登録用フォームの設置タグはもちろんテキストエディタの状態で貼り付けしますが、保存した後、やはりビジュアルの方が優しくて便利に使えるので(個人のスキルの問題ですが)うっかりビジュアルに切り替えてしまいます。
ここで、不具合が発生します。
後述しますが、100%テキストのみで記事作成している場合は、問題ありません。
結論から言うと、この登録フォームはビジュアルで記事作成している人には、使えない機能です。
テキストで、タグを貼り付けて保存したとしても、その後1回でもビジュアルに切り替えると、登録用フォームは実際の画面上で作動しなくなるのです。
登録ボタンのクリックすらできません。
詳しく説明すると、ワードプレスには、テキストからビジュアル、そしてテキストへと切り替える際に、設置したタグが自動で整形変換します。
それは、改行タグが自動変換して改行が崩れてしまう現象で、ワードプレスの記事編集では、テキストで編集したタグはビジュアルに切り替えるとオートパラグラフ「自動整形機能」というものが実行されて元のHTMLコードが、変化しタグが挿入されたり削除されたりします。
よって、保存したつもりでも、元のタグ通りには、使えない状態になってしまうのです。
場合によっては、うまくこれが作動して快適な状態にしてくれている機能でもあります。
しかし、この機能は、便利にできている反面、今回のように不具合が起きることが時々あります。
最初は、原因がわからずにエックスサーバーのサポートへ何回か問い合わせしましたが、的確なアドバイスがなく、回答されてきた改善方法は当てはまらなかったので、自分で調べてみました。
そもそも、この現象が起こる原因になかなか気付かなかったのは、私がHTMLの知識不足に他ならないのですが、初心者でも便利に使える登録フォーム用の設置タグだと解釈していますし、サポート側の知識不足も指摘したいと思います。
どのように自動整形されたのか。
次に、一旦ビジュアルエディタに切り替えて、再度テキストエディタに戻したのが、次の画像です。
テキストで貼り付けた登録用フォームの設置タグは、一旦ビジュアルに切り替えて、再度テキストに切り替えると先ほど保存したはずの設置タグが、変換されています。
このことにより、登録フォームは実際の画面上では使えない状態になってしまいます。
解決策
今のところ、解決策は3つ
1.ビジュアルエディターを使用しない設定にする
2.自動整形を無効にしてくれるプラグインを使う
3.function.phpによる設定方法
1.ビジュアルエディターを使用しない設定にする
ワードプレス左サイドの「ユーザー」⇒「あなたのプロフィール」⇒個人設定のビジュアルエディターの個所「ビジュアルリッチエディターを使用しない」にチェックを入れると、編集時にビジュアルが非表示になって選べなくなり、テキスト(HTMLコードエディター)だけになります。
これにより、切り替え動作による自動整形がなくなりますが、100%テキストエディタでの編集作業になります。
2.自動整形を無効にしてくれるプラグインを使う
プラグインで対応する場合は、「TinyMCE Advanced」をインストールします。
TinyMCE Advancedとは、ワードプレスのビジュアルエディタの機能を拡張することができるプラグインです。
記事編集画面で、編集用ボタンの種類を多く使えるようになります。
今回の場合は、設定項目の中に「Advanced Options」という項目があります。
これの「Keep paragraph tags(段落タグの保持)」にチェックを入れましょう。
これでビジュアルからテキストモードに切り替える時に生じる改行の崩れは解消します。
3.function.phpによる設定方法
私は、テーマにスティンガーを使用していますが、どのテーマでもほぼ同じですが、ワードプレスの外観⇒テーマエディタからテーマファイルの中に「functions.php」というところがあります。
そのfunctions.phpに下記のコードを記述してください。
ただし、この場所は、私も経験済みですが不慣れな人が安易に編集すると、画面が真っ白になりファイルが消えてしまう可能性もあります。
必ず、バックアップをしてから自己責任で行って下さい。(初心者の方には、お勧めしません)
functions.phpに追加するコード
remove_filter('the_content', 'wpautop'); // 記事の自動整形を無効にする
remove_filter('the_excerpt', 'wpautop'); // 抜粋の自動整形を無効にする
まとめ
本来、ワードプレスを使用すること自体、HTMLコードやタグの使い方を理解していることが、前提としてあるのだと思いますが、ブログなどの運営において初心者が、躓く点としてこの部分のハードルは高いと言えるでしょう。
しかし、テキストエディタでの編集は、少なからず避けては通れないので、普段から慣れることが大切です。
今回は、エックスサーバーのメルマガ自動登録機能が、ワードプレスの投稿編集画面でうまく利用できなかったことについて解説しましたが、どんなことでも、それなりに解決策もあるという事をお伝えしたかったので記事にしました。
スポンサーリンク