【wordpress】個別投稿ページにレコメンド擬きを表示する！【php】

この右下の赤いやつです！
割と色んなものに干渉していたりするので、これがどれぐらい見やすいものなのかは一切わかりませんがとりあえず「ものは試しよう」と言う事でおいてみました。今後数日間はユーザーフローに注意して見て行きたいなと思います。

どうも！
最近ブログのデザインをいじるのにハマっております。今のブログのデザイン嫌いでは無いのですが割とユーザビリティが低いので今度一新したいと思っております。

卒論やれって話ですよね！←

[adsense]

function footer_new_post_list() {
    global $post;
    $cat_now = get_the_category();
    $cat_now = $cat_now[0];
    $cat_name = $cat_now->cat_name;
    $cat_id = $cat_now->cat_ID;
    $args = array( 'posts_per_page' => 1, 'cat' => $cat_id );
    $myposts = get_posts( $args );
    foreach( $myposts as $post ) {
        setup_postdata($post);
        ?>
            <div class="recommend">
            <?php printf($cat_name); ?>
            <?php printf("<br>"); ?>
            <?php the_time('Y/n/j＠G:i 投稿'); ?> 
            <?php the_post_thumbnail( array( 140, 140 ), array( 'alt' => get_the_title() ) ); ?>
            <?php printf("<br>"); ?>
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </div>
        <?php
    }
    wp_reset_postdata();
}

例によってfunctions.phpに上記のコードを書きました。
最近書いたコードの使い回しですね！

参考：【wordpress】新着記事一覧ブロック作成【php】
参考：【wordpress】カテゴリ別・新着記事一覧の自動生成【php】

後はcssをいじります。

.recommend_case {
background-color: rgba(0,0,0,0);
position: fixed !important;
position: absolute;
display: block;
float: center;
bottom: 10px;  
right: 10px;  
width: 140px;  
height: auto;
font-size: 13px;
}

.recommend {
background-color: rgba(256,0,0,0.2);
position: relative;
float: left;
display: block;
width: auto;
height: auto;
font-size: 13px;
}

ここまでできたら後はsingle.phpの中に

<div class="recommend_case">
<?php footer_new_post_list(); ?>
</div>

と追記して終わりです。

レコメンドと言いつつ閲覧中のカテゴリの最新記事を表示しているだけですが、検索エンジンからやってきて昔の記事を読んでくださったお客さんに新しい最近の記事も読んでいただけたらなと思って設置してみました！

僕のブログの最大の弱点は「恐ろしい程雑記ブログ」なことです。なので出来る限り、mokabuu.com着てくださったお客さんが目的としているジャンルの記事だけが視界に入る状況をつくり出したいと思います。今後もしばらくはちょっとデザイン試行錯誤してみたいなと思います。

mokabuu

ブログ管理人

XInstagramYouTube

2014年1月からmokabuu.comを運営しております。現在10年間で老朽化したサイトをリフォーム中です（2025/1〜）。