simplecoreな毎日

アラフォー既婚男性の日々、子育て、その他雑記

2017.11.14

【WordPress】プラグインを使わずにURLのコピペで任意の記事を表示

WordPress

ブログやサイトの回遊率を高めるため、または内部SEO対策として、記事内に関連記事やおすすめの記事を表示させることがあると思います。というか、今や殆どのブログやサイトでお目にかかれるのではないでしょうか。

WordPressであれば、YARPPやwordpress related postsといったプラグインをつかってかなり精度の高い関連記事を自動で表示することが出来ますが、あまりプラグインを増やしたくない、記事を自分で選びたい、という場合もあると思います。

そんなとき、一々手作業でサムネイルを引っ張ってきて、リンクを張って、タイトルをコピペして・・・という方法だと後々結構面倒臭くなってくるかと。少なくとも僕はそうです。

なので、先日紹介したWordPressのカスタムフィールドを利用してこの辺の作業を効率化させたいと思いました。最初の設定は必要ですが、それさえ済めば後は任意の記事を選んでURLをコピペするだけで、関連性のある、一緒に読んでもらいたい記事を簡単に表示することが出来ます。

実現したいこと

完成予想としては、記事投稿の画面に「関連記事」というカスタムフィールドを作成して、そこに任意のURLをコピペ出来るようにする。公開すると、記事内に「関連記事」として、先ほど選んだ生地のサムネイルとタイトルがリンク付きで表示されるようにする。こんな感じでしょうか。

URLのコピペだけで任意の記事を表示させる方法

カスタムフィールドの設定

まずはカスタムフィールドを作成するので、functions.phpに以下の記述をします。

<? php
add_action('admin_menu', 'add_custom_inputbox');
add_action('save_post', 'save_custom_postdata');

function add_custom_inputbox() {
  add_meta_box( 'related_id','商品番号', 'custom_area1', 'post', 'normal' );
}

function custom_area1(){
  global $post;
  echo '関連記事1:<input type="text" name="related1" style="width:80%;" value="'.get_post_meta($post->ID,'related1',true).'"><br>';
  echo '関連記事2:<input type="text" name="related2" style="width:80%;" value="'.get_post_meta($post->ID,'related2',true).'"><br>';
  echo '関連記事3:<input type="text" name="related3" style="width:80%;" value="'.get_post_meta($post->ID,'related3',true).'"><br>';
}

function doSave($post_id, $data_name){
  $data = '';
  if(isset($_POST[$data_name])){
    $data = $_POST[$data_name]; 
  }else{
    $data = '';
  }
  if( $data != get_post_meta($post_id, $data_name, true)){
    update_post_meta($post_id, $data_name,$data);
  }elseif($data == ""){
    delete_post_meta($post_id, $data_name,get_post_meta($post_id,$data_name,true));
  }
}

function save_custom_postdata($post_id){
  doSave($post_id, 'related1');
  doSave($post_id, 'related2');
  doSave($post_id, 'related3');
}

これで記事投稿の画面に「関連記事1~3」という項目と入力欄が出てくるようになると思います。

この辺りのカスタムフィールドの使い方に関しては下記も読んでみてください。

WordPressのカスタムフィールドをプラグインなしでいじってみる
この記事は2017年11月9日に内容を更新しました。WordPressにはカスタムフィールドという機能があります。これは、タイトルや投稿記事、公開設定、カテゴリーなど基本的...

url_to_postidをつかってURLからサムネイルとタイトルを引っ張ってくる

WordPressにはurl_to_postidというタグがあります。これをつかえばURLから記事IDを取得することが出来ます。基本的な使い方は下記のようになります。

$post_url = '任意のURL';

/* URLからサムネイルを取得する */
$post_ID = url_to_postid($post_url);
echo get_the_post_thumbnail($post_ID ,array(xxx,xxx)); //xxxには画像のサイズを入力する

/* URLから記事タイトルを取得する */
echo get_the_title(url_to_postid($post_url));

カスタムフィールドの内容を出力する

次に先ほど設定したカスタムフィールドの出力方法ですが、関連記事が無い場合、つまりカスタムフィールドの値が空欄の場合は何も表示させたくないので、基本形はこのようになります。

<?php $ctm = get_post_meta($post->ID, 'related1', true);?>
<?php if(empty($ctm)):?>
<?php else:?>
<?php echo get_post_meta( $post->ID , 'related1' , true ); ?>
<?php endif;?>

手前味噌で恐縮ですが、この辺は下記の記事で詳しくまとめています。

WordPressのカスタムフィールドで値が空だった場合の処理方法
先日の記事で、プラグインをつかわずにWordPressのカスタムフィールドを利用する方法を書きました。段々楽しくなってきてちょこちょこいじり続けているのですが、かなり...

この2つを上手く利用すると・・・

このurl_to_postidというタグとカスタムフィールドの出力を合わせた形が次のようになります。これを任意の場所に記述してください。

<?php $ctm = get_post_meta($post->ID, 'related1', true);?>
<?php if(empty($ctm)):?>
<?php else:?>
<p>
<a href="<?php echo get_post_meta( $post->ID , 'related1' , true ); ?>">
<?php
$post_url = $ctm;
$post_ID = url_to_postid($post_url);
echo get_the_post_thumbnail($post_ID ,array(xxx,xxx)); //xxxにはトリミングしたいサイズを記入
echo '<br>';
echo get_the_title(url_to_postid($post_url));
?>
</a>
</p>
<?php endif;?>

これでカスタムフィールドで入力したURLの記事のサムネイルとタイトルがリンク付きで表示されるようになるかと思います。関連記事2、関連記事3は上記をコピペして、related1という引数をそれぞれrelated2、related3とすれば表示されます。

後は「あわせて読みたい」とか「この記事もおすすめ」とか適当にタイトルを付ければ完成です。

恐らくもっとキレイにまとめられると思うのですが、僕の浅いPHPの知識では難しいです・・・すいません、がんばって勉強します。

日野皓正のビンタ事件について思うこと

THOUGHT

日野皓正のビンタ事件について思うこと

「マタ旅」なる言葉があるようですが

THOUGHT

「マタ旅」なる言葉があるようですが

煽り運転する側と煽り運転される側

THOUGHT

煽り運転する側と煽り運転される側

ハッピーガールちゃん1歳になる

LIFE

ハッピーガールちゃん1歳になる

時間にルーズな人間について思うこと

THOUGHT

時間にルーズな人間について思うこと

娘のオモチャはブックオフで買っています

LIFE

娘のオモチャはブックオフで買っています

【WordPress】記事IDをつかったループ外での記事情報の取得と表示

WordPress

【WordPress】記事IDをつかったループ外での記事情報の取得と表示

妊婦と1歳児の神食

LIFE

妊婦と1歳児の神食