にしし ふぁくとりー(西村文宏 個人サイト)

Presented by Nishishi via Movable Type. Last Updated: 2018/04/23. 21:55:48.

Sakura Scope (2017年04月)

ちょっと倒錯気味な、ただの日記です。(^^;)
これはやばいと思われた場合は、お早めに閲覧を中止されることをお勧め致します。

WordPressで新規投稿や更新のタイミングに合わせて静的ファイルを出力する方法

WordPressはPHPで構成されているので、多くのデータが動的に生成されます。
でも、中には静的なファイルとして生成した方が負荷を掛けずに済んで望ましいデータもあります。
そんなときには、WordPressで「記事が新規に投稿されたタイミング」や「記事が更新されたタイミング」で、特定のデータを静的なファイルに書き出す仕組みを用意できると望ましいです。

WordPressでは、そのような新規投稿や更新時に何らかのファイルを出力させることも、とても簡単に実現できました。
調べてみて、ずいぶん簡単だったので驚きました。(^_^;)
以下はその話と解説です。メモみたいなもんですが。

目的:新規記事の投稿や既存記事の更新時に、最近の投稿5本のリンクリストを静的ファイルに出力したい

1つのWordPressでウェブサイト全体を構築している場合は関係ありませんが、1つのWordPressがウェブサイト内の1コーナーだけを作っている場合もあります。私のサイトがそうです。そんなとき、WordPressの影響外の部分に「最新の投稿5件へのリンクリスト」などのデータを表示させたい場合があります。

テーマ内に1つ新規のテンプレートを作って「最新の投稿5件へのリンク」だけを出力するようなPHPを書いても良いのですが、更新されるまでの間は一切内容が変化しないデータを、わざわざPHPで動的に生成するのはサーバリソースの無駄遣いのように感じてしまいます。
負荷軽減のためには、そのような「次の更新までは変化しないデータ」をWordPressの外から参照したい場合には、静的ファイルに出力しておいてそのファイルを参照する方が望ましそうに思います。

準備1:WordPressで最近の投稿5本のデータを得る方法

まず、「最近の投稿5本へのリンク」のデータを得る方法ですが、これは簡単で、wp_get_archives関数を使って以下のような1行を書けば良いだけです。

wp_get_archives( array( 'type' => 'postbypost', 'limit' => 5, 'format' => 'html', 'echo' => 0 ) );

wp_get_archives関数の使い方は、WordPress Codex日本語版などにあるテンプレートタグ/wp get archivesをご参照下さい。
上記の1行の意味は、

  • 'type' => 'postbypost'」 : 投稿を公開日時の順に
  • 'limit' => 5」 : 5件を
  • 'format' => 'html'」 : HTMLのリスト(li要素)でマークアップされた形で
  • 'echo' => 0」 : 値として得る

という意味です。値として得るのではなく、そのまま画面に表示したい場合は「'echo' => 1」と記述するか、echoの記述自体を省略します。
データは上記で用意できましたから、次にこのデータを記事投稿や更新のタイミングで静的なファイルとして保存できれば目的が達成できます。

準備2:WordPressの記事投稿や更新のタイミングで、任意の処理(関数)を実行させる方法

さて、WordPressで何らかの処理を実行するには、テーマ内に含まれている functions.php の中にコードを追加します。
で、ブログ記事の新規投稿や既存ブログ記事の更新時のタイミングで何らかの処理を実行させたい場合には、特定のアクションに関数をフックできるadd_action関数を使って、以下のように記述します。

function 何らかの関数名() {
   // 何らかの処理
}
add_action( 'publish_post', '何らかの関数名');

add_action関数の第1引数(フック名)に「publish_post」を指定し、第2引数(フックする関数名)に自分で作った関数名を書くだけです。こうすると、自分の作った関数が、記事の新規投稿や更新のタイミングで自動実行されます。
便利ですねえ……。

準備3:PHPで、任意のファイル名でデータを保存(出力)する方法

何らかのデータを指定したファイル名で保存するには、PHPのファイルシステム関数の1つであるfile_put_contents関数を使えば簡単です。
これはWordPressとは無関係で、PHPの仕様に含まれている関数です。
以下のように、たった1行を書くだけでファイルを作成できます。

file_put_contents( 出力ファイル名, 出力データ );

ファイルを取り扱いたい際によくあるオープン(fopen)~クローズ(fclose)の処理をわざわざ書く必要がないので楽ちんです。
なお、この方法だと、出力ファイル名に指定したファイルが存在しない場合は新たに作成され(※)、存在する場合には問答無用で上書きされます。詳しくはPHPマニュアルのfile_put_contents項目を参照して下さい。

※ただし、ウェブサーバ上で実行する場合は特に、出力しようとしているディレクトリのパーミッションによってはファイルの作成に失敗する点に注意が必要かも知れません。同名のダミーファイルをあらかじめアップロードしておいて書き込み権限を付与しておくのが確実でしょう。

完成ソースコード:「最新投稿5件へのリンクリスト」を、記事投稿や更新のタイミングで、任意のファイル名で書き出す方法

さて、上記の準備1~3を合体させれば、WordPress内の「最新投稿5件へのリンクリスト」を、記事投稿や更新のタイミングで、任意のファイル名で静的なファイルに出力することができます。
完成したソースコードは以下の通り。これを、WordPressのテーマ内の functions.php 内のどこかに書けば完了です。

function writeout_lastpost5() {
   /* ▼最近の投稿5本のリンクリストをファイルに出力 */
   $outputfilename = get_template_directory() . '/lastpost5.txt';
   file_put_contents( $outputfilename, wp_get_archives( array( 'type' => 'postbypost', 'limit' => 5, 'format' => 'html', 'echo' => 0 ) ) );
   return;
}
// 投稿と更新時に実行
add_action( 'publish_post', 'writeout_lastpost5');

上記では、まず、指定データを指定ファイルに保存する処理を記述した writeout_lastpost5関数を自作しています。その後でadd_action関数を呼び、今作った関数が「WordPressでの投稿・更新時」に実行されるよう指定しています。

出力するファイル名は、変数$outputfilenameに入っています。
get_template_directory() は、WordPressで今適用されているテーマのファイルが入っているディレクトリパスを得ています。
この関数で得られるパスの最後にはスラッシュ記号がないので、その後に「/lastpost5.txt」という文字列を加えることで、テンプレートディレクトリ内に lastpost5.txt というファイル名で出力しようとしています。

※出力場所としてここが望ましいかどうかはよく分かりませんが……。でも、テーマが切り替えられる可能性を考えると、テーマに関係するファイルはすべてテーマのディレクトリ内に含めておく方がいいのかな……とも思いまして。
※なお、お使いのサーバによっては、PHPから新規のファイルを作成できない場合もあります。その場合は、生成予定のファイル名であらかじめダミーのファイルをアップロードしておいて、書き込み権限(パーミッション)を加えておきましょう。

あとは、この方法で出力されたデータファイルを適宜読み込めば、WordPressの外から「最新の投稿5件へのリンクリスト」のデータが(WordPressを動かすことなく)得られます。
(私の場合は、単にSSIで合成しているだけです。)

以上、WordPressで新規投稿や更新のタイミングに合わせて静的ファイルを出力する方法でした!
もしかしたら、他にもっと良い方法があるかも知れませんけどもね。(^_^;)

Let's note SX4用の内蔵バッテリを新品(CF-VZSU75JS)に交換した

2015年の夏に購入した仕事用のPanasonic製ノートPC「Let's note SX4」の内蔵バッテリSの持続時間がさすがに減ってきたので、約20ヶ月ぶりに新品バッテリと交換しました。
さすがに約20ヶ月間もほぼ毎日バッテリを使っていると、もう満充電からでも5時間くらいしか持たなくなっていましたので。基本的に帰宅時以外では充電できないので、5時間程度だとちょっと足りないんですよね。

Let's note SX4用軽量バッテリーパックS「CF-VZSU75JS」

SXとNXシリーズ共通のバッテリ:CF-VZSU75JS

Let's note SX4には筐体カラーがシルバーとブラックの2種類あるので、純正バッテリの色も2種類あります。あと、持続時間が普通の「軽量バッテリーパックS」と持続時間の長い「バッテリーパックL」の2種類があります。なので、使えるバッテリは合計4種類あることになります。(筐体と色が異なるバッテリが挿せるのかどうかは分かりませんが。^^;)
型番は、

です。私のLet's noteは筐体がシルバーなので、シルバーの軽量バッテリS「CF-VZSU75JS」を購入しました。(製品に最初から付属しているバッテリと同じもの)
持続時間で有利なのはもちろんバッテリLですが、ノートPCを入れているインナーバッグがバッテリS装着時のサイズにぴったりなので、バッテリLだとバッグから新調しないといけないので。あと、毎日持ち運ぶわけですから、極力軽い方が良いですしね。

Panasonicサイトなどで調べたところ、Let's note SX4用の内蔵バッテリは、どうやらLet's noteのSXシリーズ(SX1,SX2,SX3,SX4)とNXシリーズ(NX1,NX2,NX3,NX4)で共通のようでした。
販売店サイトでは「SX1/NX1用軽量バッテリーパック(S)」と説明されていたので、「これが本当にSX4にも使えるのかな?」と若干不安だったんですが(^_^;)、問題なく使えました。

バッテリSはヨドバシではお取り寄せ扱い。注文から12日で到着

ヨドバシドットコムで調べたところ、バッテリS「CF-VZSU75JS」の価格は、8,770円(ポイント還元877ポイント)でした。ずいぶん安くなりましたねえ。以前使っていたLet's note R5のバッテリだと1本で2万4千円くらいしていたんですけども。それよりも持続時間が長くなっているのに、サイズも小さくなって値段も安くなっているとは。テクノロジーの進歩のおかげでしょうか。

ただ、バッテリLの在庫はあったものの、バッテリSの在庫はなく「お取り寄せ」扱いでした。まあ、Sの方が需要が多いってことでしょうかね。(Let's noteクラスのノートPCは、基本的に持ち運んで使う用途が多いでしょうから、軽い方が望ましいですからね。バッテリSは単体では220gです。)
ちなみに、メーカー希望小売価格は1万円ちょうどです。

■購入注文から配送完了までのタイムライン:

  • 2017年4月4日にウェブ上で注文して、その2分後くらいに「仕入先に発注いたしました」という連絡メールが届きました。
  • 2017年4月5日に、「4月17日~4月21日頃お届け予定」という手配状況のお知らせメールが届きました。
  • そこから待つこと10日間、2017年4月15日に「商品出荷のお知らせ」メールが届きました。
  • 2017年4月16日に、ゆうパック経由で無事に届きました。

注文から入手まで12日間です。意外と早かったな、と思いました。

新品バッテリSの持続時間は、私の日常使用だと8時間くらい

新品バッテリに交換した直後は、バッテリ残量が20%くらいでした。Let's noteのマニュアルには「長期間使わない場合は30%程度に充電した状態で外すように」と書かれていましたから、たぶんこの新品バッテリも出荷時点では3割くらい充電されていて、そこから倉庫に保管されるうちに放電したんでしょうかね?
とりあえず、バッテリ残量補正ユーティリティを起動して、リフレッシュバッテリを実行しました。

バッテリー残量補正ユーティリティ

バッテリを新品に交換した翌日、満充電状態から普段通りにノートPCを使って仕事をしたところ、5時間23分使った時点でバッテリ残量が35%でした。323分で65%消費したわけですから、1%で4.96分の消費です。残量3%くらいまで稼働可能だと考えると、だいたい8時間ほぼ保つということでしょうかね。
これなら充分です。
1日の仕事終了時点で、バッテリ残量が25%以上ある日が続くようなら、バッテリをECOモードに設定して使っても良いと思います。
ECOモードにすると、80%までしか充電されなくなります。その代わり、バッテリの寿命が延びるようです。(私は、最初のLet's note SX4を買ったときは、しばらくはECOモードで使って、ややバッテリが劣化してきた頃からフルモードで使っていました。)

今回の新品バッテリも、約20ヶ月間くらい持ってくれると良いなーと思います。
8,770円で約20ヶ月使えたとしたら、1ヶ月当たり約440円で済みますからね。^^;

Panasonic Let's note 関連製品群(@Amazon.co.jp)

CSSだけでタブを切り替える機能の作り方

色が変化するタブ機能をHTML+CSSだけで作る方法ページ遷移なしに表示内容を切り換える「タブ機能」って、JavaScriptを使わなくてもHTML+CSSだけで作れるんですよね。ラジオボタンの動作を応用すれば、スクリプト不要で動きます。アコーディオンメニューをスクリプトなしで作る場合などと同じです。
そんな、CSSだけでタブを切り替える機能の作り方をAll Aboutで記事にしました。

色が変化するタブ機能をHTML+CSSだけで作る方法(@All About ホームページ作成)

タブを切り替えるには一見するとJavaScriptを使う必要があるように感じますが、CSS3の記述方法を活用すればHTML+CSSだけで作成可能です。
タブのように見せるインターフェイスとして必要な、

  • 選択中のタブがどれなのかを明示できるようタブの色を変化させることも、
  • 選択されたタブに応じてボックスの中身を切り換える動作も、
  • 選択中のタブと対応ボックスが繋がっているように「境目の枠線だけを見えなくする」ことも、

すべてHTML+CSSだけで作れます。
ラジオボタンの仕組みを活用する点が若干アクロバットに感じますが、構造が分かってしまえば簡単です。
JavaScriptを使わないので、スクリプトが無効にされているような環境でも使えます。まあ、最近はさすがにスクリプトが無効な環境ってあまりなさそうですけども。スクリプトがない分、余計なソースを読み込まずに済むというメリットはありそうです。

記事では、サンプルページも用意していますので、解説と合わせてご覧になると分かりやすいと思います。
ぜひ試してみて下さい!

2017年04月
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30            

他の月

--- 当サイト内を検索 ---