wordpressのHPをモバイルに合わせてレスポンシブデザインに変えfacebookと連動させるのは

QPRDtop

 

モバイルからサイトに来る、facebookやtwitterからサイトに来るひとが増えるのは目に見えています。スマホでもきれいに見えるサイトを作るには、wordpress用のレスポンシブデザインのテーマを使うのが一番!!!。

 

1.モバイル対応をしなければいけない


訪問者を見ていくと、モバイルからの訪問が多くなっています。
絶対数は少ないのですが、ここ一ケ月で2倍以上になっています。
facebookからも同じです。絶対数は少ないですが、3倍にはなっています。

この傾向は一般的なようで、他の方コンサルの方もpc検索中心から大きく変化しているようです。スマホで電車に乗りながら記事を読んでいただくことが多くなるのではないか、スマホで探すことが多くなるのではないかと考えています。

そこで、wordpressで作っているHPをモバイル対応にすることにしました。レスポンシブデザインに対応したテーマに変えるわけです。

twenty-tenという最も基本的なテーマを使っているのですが、これを、レスポンシブデザインに対応したテーマに変えます。すでに、WPtouchを使ってスマホでも見れるようになっていますが、レスポンシブデザインのテーマを使うとスマホでの検索にもかかりやすくなるようなのです。

 

2.レスポンシブデザインのHPに変える


 

QPRDexptema

 

レスポンシブデザインの無料のテーマは、結構あります。
しかし、日本産のものはなく、フランス、ドイツ、アメリカ産ばかりです。
デザインのカッコいい~ものが多く、目移りしてしまいました。
日本語変換が難しいものも少なくありません。
しかもクセも強いのです。

とりあえず、気に入ったテーマを入れてみて、HPを見てみました。
やはり、カッコいいデザインのテーマに変えようとすると、いろいろ、トラブルに会うわけで、、、簡単にはいきません。

結局、twenty-tenをレスポンシブデザインに改良した最も基本的なレスポンシブデザインのテーマを使うことにしたのです。
ついでに、、、wordpressのバージョンUPも行うことにしました。

 

3.最新のバージョンにしていないとgoogleから怒られる


GOOGLEからメールが来たのです。
「WORDPRESSのバージョンが古い。サイトの訪問者がウイルスなどに侵される心配があるから、早く最新バージョンにUPDATEしなさい。」というのです。

もう、10回は来ています。これをしないと、SEO的に問題になりそうな雰囲気です。

しかし、wordpressのバージョンを上げると、使っているプラグインが機能しなくなったりわけのわからない動きをすることが多いので、できるだけしたくありません。

そこで、見て見ぬふりをしてきたのですが、、、。

レスポンシブデザインtwenty-tenは、バージョンを上げないと導入できないことが分かったのです。ついにあきらめて、wordpressのバージョンアップとレスポンシブデザインへの移行をいっぺんにやることに決めました。

さらに、さらに、なんとあのfacebookがwordpress専用のプラグインを作ってきたのです。。。
これを使いたいと思わない人はいないでしょう。
今までOGPをサイトに設定するのにさんざん苦労してきたのですから。
しかし、これも、wordpressのバージョンを上げないと使えないのです。。。

 

4.やっぱり、バージョンを上げるとおかしくなる


 

QPRDplugin

 

思い切って危険を冒すことにしました。

まず、使っているプラグインをすべてバージョンをあげ、その後にプラグインを一旦すべて止め、その上でWORDPRESSのバージョンをあげました。無事バージョンが上がったのを確認して、レスポンシブデザインのtwenty-tenのテーマを導入し、テーマを変えました。

やっぱり、、、トラブリました。

HPを開き、カテゴリーをクリックして記事の一覧を出したのですが、、、サムネイルが巨大化し、説明文が短くなり、しかも解説文の最後の1~2文字が文字化けしているのです。。。。。

原因は分かりません。

そこで、各ページのサムネイルを作る専用のプラグインを入れてみました。
すると、サムネイルの巨大化は直りました。

しかし、解説文が短くいことと文字化けは直りません。
プログラムの中を見てもわかりません、、、(もともとあまり読めませんが)。

そこで、プラグインがぶつかっているのではないか?確認することにしました。
またプラグインをすべて止め、最初にカテゴリーを出すプラグインだけ起動させ、その後に、一つずつ起動していきました。ひとつ起動しては、記事の抜粋がおかしくなっていないかを見ていったのです。

するとありました。
Advanced Export というプラグインを起動させると、おかしくなるのです。
このプラグインは、HPのデータを外に出すために入れたプラグインです。
ぶつかっている理由は分かりません。
とにかく、このプラグインを使うことを止め、二度と起動させないために削除してしまいました。

 

QPRDcat

 

すると、、、今度は、、、、、「続きを読む」という日本語が、英語になっているではありませんか。。。さすがにあきらめました。(みなさん、英語でお願いします。)
昔は、日本語に変えられたのですがやり方を忘れてしまい、、、
というか、テーマも違いバージョンも上がっていますので、原因が分かりません。

 

5.facebookが作ったプラグイン


 

QPRDrecom

 

そして、ついに、facebookのプラグインを入れました。
likeとコメントとレコメンドボックスを起動させました。
コメントが無印良品のページみたいにfacebookと共有できるようになっている、、、ハズです。
夢だったんですよ。これ。
うまくいけば、これでfacebookとの連携が良くなり、facebookからの訪問数が増える、、、ハズです。
しかも、おすすめの記事が右下からひょっこり出てきます。結構一端のHPみたいな感じになってきました。

 

しかし、ここまで来ても気になることはいくつかあります。
レスポンシブデザインのテーマにWPtouchを使っていても大丈夫なのか?
(なぜか、WPtouchを止める気になりません。)
もう一つが、手動でいれたOGPとfacebookのプラグインが喧嘩をしないかです。

これらは、少し、様子を見ていきます。

 

既存のプラグインやテーマなどを組み合わせていくだけで、ここまでできるようになっているんですね。ただ、トラブルも多いので、うまくいかない時は固執せずさっさと他の方法をやってみるのがコツです。

工藤 英一

About 工藤 英一

Qualia-Partnersの代表の工藤です。ゼネコンの研究員から会社経営を経てコンサルタントになりました。自身の経験から、リピーターとの関係を深めお得意様を増やしていくことを強く勧めています。
This entry was posted in 問題解決, 悩み解決案. Bookmark the permalink.

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>