カテゴリー別アーカイブ: wordpress

WordPress を facebookへ自動投稿

wordpress での記事更新時、同時にフェイスブックに投稿するのに、Wordbooker という wordpress のプラグインを使っていました。大変便利なプラグインで重宝していたのですが、どうも最近は上手く連携してくれません。調べてみると次のようなウェブサイトを見つけました。

Wordbookerが反映されない

自分では検証していないのですが、どうも Wordbooker と wordpress のバージョンが変わるとその都度再設定が必要になるようです。これではちょっと使い物にならないので別の方法を考えてみました。

WP to Twitter (wordpress のプラグイン)を使って、wordpress の更新のお知らせを末尾にハッシュコード #fb を付けて twitter に自動投稿する。

そして更に、facebook 側にも Selective Tweets と言うプラグインを組み込んでおくと、このプラグインが、#fb(ハッシュコード)付きの tweet を facebook に自動投稿してくれる。

結果、wordpress で更新された記事は、twitter と facebook に自動的に投稿される事になります。
今のところ、この組み合わせが一番安定的に動作してくれるようです。

wordpress facebook twitter 全てにおいて便利なプラグインがありますが、組み合わせによっては上手く動作しない相性もあるようなので使い方が難しい。今回の対処も、いちおう覚書として残しておきます。

 

レスポンシブ・ウェブデザインに対応したテーマ(TwentyEleven)

WordPress 標準のテーマ 『TwentyEleven』 以降からは、どのスクリーンサイズのデバイス(PC、スマホやタブレットを問わず)でもページデザインを自動で最適化する技術、 『レスポンシブ・ウェブデザイン』 に対応している。

レスポンシブ・ウェブデザイン

レスポンシブ・ウェブデザイン
スマホ(android)での表示

レスポンシブ・ウェブデザインとは、
PC用もモバイル用も、単一の html を使い、ブラウザーの横幅サイズを基準にcss(デザイン)を切り替えて、デバイスごとに表示を最適化するという方法です。

ちなみに、 『雑感日記』  ←このブログは 『TwentyEleven』 を使っているので、PCでもスマホでもレイアウトが少し変わるだけで基本的に同じデザインで表示されます。

ためしに、PCで表示してブラウザーの幅を狭めていくとフレキシブルに表示が最適化され、スマホと同じ表示になるのが分かります。

正直、これは便利です。
デバイスごとに html を分けなくて良いので、ユーザーエージェントごとに、サーバー側で url を振り分ける必要が無いし、単一の html (url)で対応できるのでSEO的にも優位になる。

しかし、デメリットもあります。
スマホでみている時、PCデザインでみてみたいと思ってもブラウザーの幅を広げれないので見ることができない。それに見た目はスマホに最適化されているようでも、画像などのソースはPCと同じものなのでファイルが重い。なのでスマホのDL制限などにかかってしまった場合、表示ができない。できても恐ろしく時間がかかる。などの問題もある。

画像が縦伸びする。

 

それと、TwentyEleven 自体の問題!

PCでは問題なく表示される画像が、スマホでは画像の幅は合わされるが、縦伸びして表示されることがある。

いくら自動で画像幅を合わせてくれても、これでは使い物にならない。
で、調べてみたところ、解決策が見つかりました!

 

 

 

TwentyEleven の画像縦伸び解決法
WordPress 管理画面で
ダッシュボード → 外観 → テーマ編集 → スタイルシート(style.css)

884行目にある /* Images */ の記述に下図のように一行追加する。

/* Images */
.entry-content img,
.comment-content img,
.widget img {
max-width: 97.5%; /* Fluid images for posts, comments, and widgets */
height:auto;   ←この1行を追加する
}

Screenshot_2013-07-06-16-07-38

縦伸びせず正常に表示

 

 

 

 

 

 

これで問題解決!

 

WoredPressのコメント欄が突然消えた

ブロ友から連絡があって、
コメントしようとしても、コメント欄がでてこない。
過去のコメントを読む事もできない。

このように連絡をもらって確認すると、マジでコメント欄が出なくなっている。
そして過去にコメントをもらっているはずのものも現れない。
しかしダッシュボードから見るとコメントは残っている。
コメント自体が消失したわけではなくコメント欄が表示されない状態なのです。

参りました。
慣れないWordPressで、原因を探すのは容易ではないので、前例がどこかにないかとネットを検索していると、どうもパーマリンクをいじった事が原因のようです。

デフォルトのパーマリンクは次のようにクエスチョンマークと数字からなるURLになっています。
例:http://bemo-st.com/pc/wp/?p=123

そこで、見た目を整えれるようにWordPressでは、カスタムなURL構造を用意してくれていますので、日付と投稿名という雛形を選んでいました。
例:http://bemo-st.com/pc/wp/2013/04/01/sample-post/

ここまでは良かったのですが、長いURLを短くしようと、投稿名(sample-post)を外しました。
http://bemo-st.com/pc/wp/%year%/%monthnum%/%day%/%postname%/
http://bemo-st.com/pc/wp/%year%/%monthnum%/%day%/ ←このように変更

これがいけなかった!
私は、1日に2件以上複数の記事を投稿する事がないから気付かなかったのですが、もし2件以上の記事になると、日付だけの構造では固有のURLにならない。ユニークなURLでなければパーマリンクにならないのです。そのため、日付以下に個別の投稿名を付ける必要があったのです。

/%year%/%monthnum%/%day%/ これの後に、
%post_id% または %postname% あるいは %second% を付加する事でユニークなURLとなり、パーマリンクとしてあつかえるようになります。そして、コメント欄は無事に復活しました。

補足
「パーマリンク」(Permalink)とは、恒久・不変を意味する「パーマネント」(permanent)と「リンク」(link)を抱き合わせた造語。Webページの中の個別のコンテンツに対して設けられたURLのことで、一般的に、ブログ記事に対して割り当てられたURLのことを指す。

「ユニーク」(unique)とは、唯一の、一意の、固有の、特有の、独自の、独特の、類稀な、珍しい、変わった、などの意味を持つ英単語。