Wordpress

せっかく頑張って昨日スタイルシートを変更したのに朝見たら反映されていなくてがっかりな@tokidaです。

photo credit: eisenrah via photo pin cc

どうもキャッシュとかでうまく更新がされないみたいです。

style.cssを編集しても更新されないときがあるのでQueryをつけて強制的に更新させましょう。

[cc lang=”css”]
http://roguer.info/wp-content/themes/pohutukawa/style.css?1335523359″
[/cc]

スタイルシートの呼び出しには普通は style.css だけだと思うのですが旨くこのままでは更新してくれないときが多々あるので最後に上記のようにQueryをつけると旨く読み込まれます。

WordPressなのでこの部分を自動的にファイルの更新日にするようにしておくと旨いですね。

[cc lang=”php”]
href=””
[/cc]

私のこの pohutukawa テーマの場合には、header.php の 32行目付近にある箇所を上記のように修正する事で style.css の作成日を後ろにつける事が出来ます。

WordPressテーマのcssの末尾にクエリ文字を加えてキャッシュさせないようにする – かちびと.net

人気記事とかWordpressでは表示できるのだけどこの集計には色々プラグインによって違います。最近は「Post-Views」というのが気に入って使っていましたけどカスタマイズの仕方が難しそうだったので取り敢えず勢いに任せて「Populer Posts」を入れてみた@tokidaです。

いつものように、触発される記事があるわけです。

WordPressプラグイン「YARPP」と「Auto Post Thumbnail」を使用して関連記事を表示するのにようやく成功した | OZPAの表4

新しい記事も過去の記事も全部自動でアイキャッチを作成してくれるAuto Post Thumbnail | ごりゅご.com

実際にプラグインのカスタマイズにはこちらのサイトを参考にしました。

Popular Postsをカスタマイズして、人気記事のサムネイルを表示する方法 | Oxy notes

 

こんな感じでよくあるThumbnailついた画像が付けたかったのです。

方法はあちこちにでているのですが特に変わったことはしていません。

• Thumbnail（アイキャッチ画像）を利用しているため、自動的にアイキャッチ画像を作ってくれる「Auto Post Thumbnail」を入れます。これは過去のエントリーもアイキャッチ作ってくれるので非常にうれいいプラグインです。
• カスタマイズが楽な、「Popular Posts」プラグインを入れます。他のプラグインでもカスタマイズする箇所がわかっていればなんとかなると思います。
• 以下の設定はあくまでもこのサイト用の設定なので好きなように（備忘録としてメモ）

• Output の設定内容で「Output Template:」の中に以下のように記述。
  [cc lang=”html”]
  
  {php: echo get_the_post_thumbnail( {postid}, array(64,64), array(‘title’ => ‘ {title}’ )); }

  {title}

  {snippet:20}…

  [/cc]

• テーマで利用しているStyleシートには以下のように追加。
  [cc lang=”css”]
  .wp-post-image {
  border:solid 1px #ccc;
  padding: 4px;
  float: left;
  margin-left: -80px;
  margin-bottom: 10px;
  /* vertical-align: text-top; */
  }
  .popular_posts {
  padding: 3px;
  margin-top: 3px;
  margin-left: 80px;

  }
  .popular_posts_title {
  margin:2px auto;
  font-size: 90%;
  }
  .popular_posts_snippet {
  margin:2px auto;
  font-size: 75%;
  color: #A0A0A0;
  }
  [/cc]

昨日からすげ～入れたくて仕方なかったので満足でゴザル。

興味が出てきた方は、GWの暇つぶしに是非。
折角なので「Post-Views」プラグインのカスタマイズを調べてみようと思う。

最近、プラグインWordTwitがおかしいのかWordpress for iPhoneが頭悪いのか記事を書いてもこんな調子でさみしい。

何を書いても、自動下書きと言うタイトルにorz

と言うわけで？プラグインを変更して見る、Wp to Twitter と言うものにしてみました。でこの投稿は上手く出るのか？

#追記
2012.03.06 　無事に投稿できたみたい、でも新規に追加時ではなくて「更新」でのTweetだから本当にできているのかはわからないけど。なんにせよ要約が出てくれるのは嬉しいな

先日から急にサイトのページが重くなっていました。

なにか変更したわけでもないのだがおかしな状況でした。1

結論から書くと「利用していたアフィリエイトのサービスが終了していた影響」でした。

実際には外部ファイルで呼び出されるJavascriptが反応しないためにブラウザがタイムアウトを待っているような状況になっていた為です。

これは構造上、外部のサイトからの読み出しが遅かったり利用できない状況は、常に起こりうることで何も今回の様なサービス停止だけではなくて備えておく必要がありますね。

さて、このようなことに備えてどの様なことでが出来るでしょうか。

ひとつは、Javascriptの読み込みを非同期にする方法、もうひとつはJavascript自体をページの後半（フッター）で読み込む方法がセオリーのようです。

 

Javascriptの読み込みを非同期にする方法

---

<script>タグにはdefer属性というものがあり、

<script src="****.js" defer="defer"></script>

のようにdefer属性を設定すると非同期で読み込む事ができます。

但し実際には利用してるスクリプトなどでdocument.wirteのレンダリングする部分があると動きません。

結論から言えば今回の問題の場合、スクリプトを外せばいいのだが対応したブラウザであれば上記のDeferで問題なく動くので外部ファイルを利用する際には動作確認をして問題ない場合には追記しておきたいです。

 

Javascriptの読み込みを最後にする方法

---

また、別の対策としては、Javascirptをページの最後にすることです。

実際には手動でプラグインの中のJavaascitを書きなおすのはとっても難しいと思うので「Header Cleaner」というプラグインでJavaScriptの位置を簡単に変更する事ができます。

こちらを使用することでページの読み込みが重くなることを防ぐことが出来ます。 こちらのプラグインはその影響でうまく画面が表示されないものなどもあるので要注意です。2

 

最後に

---

何れの方法も何かしら問題があるかもしれないですが、うまく利用していきたいものですね。

では、また。

1. その結果、先日も折角Appbankサイトで紹介されていたにも関わらずさっぱりアクセスが伸びないという自体になっておりました。orz [↩]
2. フィルタなどを駆使して回避しましょう [↩]

WordPressのデータをバックアップ取得するのだが、サーバを以前変更した時からメールの設定を面倒でしておらずたまに手動でサーバから持ってきていた。面倒この上ない上に何のバックアップにも成っていない状況だったのでDropboxと連携するプラグインを入れて見ることにしました。

 

WordPress › WordPress Backup to Dropbox « WordPress Plugins

 

設定画面から「Backup to Dropbox」を選択します。
初回にはDropboxのアカウントのリンクを行いますので「Authorize」をクリックして設定を行いましょう。

 

認証が終わって許可すると設定ができるようになります。

設定は特に困ることは無いかと思います。時間と周期を選びましょう。
試しにバックアップを取得する場合には下にある「Backup now」を選択します。

順次Dropbox側にデータが直接送られているようです。

 

DBのデータ等はプラグインでメールで送ることともできますが日々送られてくる都合上データ領域が多くなってしまうのが微妙だったのでこちらのほうがいいかもしれません。何れにしても定期的には手動でもバックアップ取っておかないと不安なのでそれはそれでしたいと思う次第

 

さて、次は何をいじるかな？