関連記事

Related Postsと言うプラグインで、関連記事をページ下部に表示しています。これまでは、WordPress Related Postsを使っていましたが、思ったような表示にするために、直接ソースコードを修正する必要がありました。その記事はこちら。

最近の個人的なブームである、「追加設定だけで好みの表示を実現する」＝ソースコードを修正しない、に従い、設定項目が多い、Yuzo Related Postに変更しました。

追加で設定したのは、以下のCSSのみ。だったけど、最近ちょっとだけ直接コードをいじりました。

.yuzo_related_post{}
.yuzo_related_post .relatedthumb{}
.yuzo_text {font-size: 12px !important;}
.yuzo_related_post a{
        -webkit-transition: 0.5s ease-in-out;
        -moz-transition: 0.5s ease-in-out;
        -o-transition: 0.5s ease-in-out;
        transition: 0.5s;
        display: inline !important;
 }
.yuzo_related_post a:hover{ opacity:0.5 !important;}
.yuzo__title { border-bottom: solid 1px #333; }

以前使っていたプラグインでは、画像とタイトル、抜粋の他、投稿日時を表示することが出来ました。今回のプラグインは、設定項目が多岐に渡っているにもかかわらず、投稿日時を表示することが出来ません。よく、ニュースサイトなどで、こちらの記事も読まれています、と言うのでたどっていくと、数年前の記事だった、というようなことがあります。これは意図的に日時を表示せずに、誘導する意図があるので仕方ないことだと思いますが、自分のサイトでそんなことはしたくないので、ちゃんと投稿日時を表示するように修正しました。wp-content/plugins/yuzo-related-post/yuzo-related-post.php

修正前

<a '.$rel_link.' class="link-list yuzo__text--title" href="'.get_permalink().'"
 style="font-size:'.$yuzo_options->font_size.'px;'.$bold_title.';
 line-height:'.( (int)$yuzo_options->font_size + 8).'px;">'.$my_array_views['top'].'
 '.$if_utils->IF_setHtml( $if_utils->IF_cut_text( get_the_title(),
 $yuzo_options->text_length , true ) ).'  '.$my_array_views['bottom'].' </a>

※表示の都合で改行していますが、実際には1行です。

修正後

<div>
<a '.$rel_link.' class="link-list yuzo__text--title" href="'.get_permalink().'"
 style="font-size:'.$yuzo_options->font_size.'px;'.$bold_title.';
 line-height:'.( (int)$yuzo_options->font_size + 8).'px;">'.$my_array_views['top'].'
 '.$if_utils->IF_setHtml( $if_utils->IF_cut_text( get_the_title(),
 $yuzo_options->text_length , true ) ).'  '.$my_array_views['bottom'].' </a>
 '.get_the_date(get_option('date_format'), $next_post->ID ).' 
</div>

※表示の都合で改行していますが、実際には1行です。

このままでは、タイトルと日時が改行して表示されてしまうので、上の設定で、以下の指定を追加する。

.yuzo_related_post a{
        display: inline !important;
 }

結果は、この記事の↓をご覧下さい。

最終更新日: 2019年6月16日