訪問ありがとうございます。

Cocoonで特定の記事だけ抜粋を冒頭に表示する

Cocoon


投稿の本文を表示する前のところに、「前説」的なものを入れたいことってあるよね。しかもトップページに最新の投稿のリストを表示してるような場合に、まずは「前説」だけを表示して興味を惹いておいて、投稿ページに誘導したら、改めて「前説」を読んでもらって、それから本文を読んでもらいたいってことがあるよね。
いや、そういう場合は「moreタグ」でしょ?って言われそうだけど、とある事情でmoreタグではうまくできなくて、それでも投稿に前説と本文を分離して表示したい場合があったのだ。

Cocoonを使ってて、そういう場合のカスタマイズをしてみたので、そのやり方を公開しておくのだ。


考え方

まず、投稿の本文の前に『前説』的なものを入れたい投稿と入れたくない投稿があると思ってるのだ。うーん、他の人は知らないけどとにかく俺の場合は入れたいブツとそうでないブツがあるのだ。その「入れたいブツ」をどうやって区別するかを考えないといけない。WordPressでは投稿に「カテゴリー」や「タグ」といった属性が設定できるので、真っ先に思いつくのは「入れたいブツ」には「前説つき」カテゴリーを設定するとかって方法だよね。
もちろんその方法もアリだと思う。だけどそうした場合、Cocoonのスキンによってはこんな感じにリスト表示にカテゴリーが出るので、そこに「前説つき」なんて出ると何となく宜しくないことがあると思う。

だから今回はカテゴリーではなく「カスタムフィールド」を使おうと思うのだ。

カスタムフィールド

「カスタムフィールド」はもしかすると馴染みがない人もいるかもしれないけど、もし知らなかったら適当にググってみてね。
今回はカスタムフィールドに「excerpt_first」というのを設定することにして、値に1が設定してあったら投稿の本文の前に「抜粋」を表示することにするのだ。

名前: excerpt_first
値 : 1=投稿の本文の前に『前説』的なものを入れたい投稿
    1以外=投稿の本文の前に『前説』的なものを入れたくない投稿

投稿の表示をカスタマイズ

Cocoonの場合どうやら投稿の本文の表示をカスタマイズするにはcontent.phpを修正する必要があるようなのだ。
あ、本当にそうなのかどうかは知らないけど、試してみたらそれでできたので書いてるだけなので、もしマネするなら自己責任でやってね。

カスタマイズ方法は以下の通り。sshとかでサーバーに接続してる前提で。

# WordPressのディレクトリに移動
# (このパスとは限らないので気を付けてな。特にレンタルサーバーだとここには入れないと思う。)
cd /var/www/html/
# content.phpは子テーマにはないファイルなのでまずは親テーマから子テーマにコピーする
mkdir wp-content/themes/cocoon-child-master/tmp
cp -a wp-content/themes/cocoon-master/tmp/content.php wp-content/themes/cocoon-child-master/tmp/content.php
# コピーしたcontent.phpを開く
vi wp-content/themes/cocoon-child-master/tmp/content.php

viエディタが開いたら(もちろん他のエディタでも良いわけだけど)「the_content」を検索して次のようなカンジのところを見つける。

      <?php //記事本文の表示
        the_content(); ?>

見つけたら次のようなカンジに書き換える。

      <?php //記事本文の表示
        if(has_excerpt() && get_post_meta(get_the_ID(), 'excerpt_first', true) == '1') {
          the_excerpt();
        }
        the_content(); ?>

コードの解説

コードを見たらわかるぜっ!って人は読み飛ばしてね。

has_excerptとは?

投稿を編集するページで「抜粋」を入力してあるとhas_excerpt()がtrueになる。ifの分岐条件にこれを入れておかないと、「抜粋」を入力しわすれたときに勝手に本文の冒頭部分が表示されちゃって、そうすると前説と本文とで2回同じ内容が出るので気を付けないといけない。

get_post_metaとは?

カスタムフィールドに設定した値を取り出す関数。「get_post_meta(get_the_ID(), ‘excerpt_first’, true)」でまさにいま表示してる投稿に「excerpt_first」という名前のカスタムフィールドが設定されていたらその値を取り出せる。設定されていなければ空文字列が返ってくる。

ifの中身は?

まあ、見たらわかると思うけど、「抜粋」が設定されていて、尚且つ「excerpt_first」というカスタムフィールドが1だったら、the_excerpt();を実行するってことだよね。

the_excerpt()とは?

これは抜粋を表示してくれる。

カスタムフィールドの入力

投稿の編集ページでカスタムフィールドに「excerpt_first」を設定する方法を一応書いておくのだ。そんなの知ってるぜっ!って人は読み飛ばしてね。

入力欄があるか確認

カスタムフィールドの入力欄を探しても見つからない場合はクラシックエディタなら投稿の編集画面の右上にある「表示オプション」から表示してな。
ブロックエディタの場合は編集画面の右上のをクリックして「設定」をクリックしたらダイアログが出てくるので、「パネル」のページで「カスタムフィールド」をONにしてな。

入力欄が表示されたら

カスタムフィールドを追加の「新規追加」をクリックしたら、

名前に「excerpt_first」、値に「1」を入力してから「カスタムフィールドを追加」
ちなみに「excerpt_first」をいちど追加したら、次からは「新規追加」じゃなくて「-選択-」で選べるようになる。

ちなみに

この投稿を見てる人には分からないと思うけど、この記事もこのカスタマイズによって、抜粋が「前説」として表示されてるのだ。

↓クリックしてください。
にほんブログ村 その他日記ブログ 50代男性日記へ
にほんブログ村