新着記事（サムネイルなし、日付つき）を固定・投稿ページにショートコードで呼び出す－wordpress

当ブログのトップページは、固定ページで作成しています。最初の項目には、サムネイルなしの新着記事を載せています。

今、wordpressのテーマは「cocoon」を使用していますが、サムネイルなしの新着記事を作る機能はありませんでした。

.phpファイルを編集するか、cssによってサムネイルを消すことはできるようです。

ただ、面倒そうだったので、別口で.phpファイルを作成し、ショートコードで呼び出すことにしました。

.phpファイル作成

以下のコードを書いた.phpファイルを作成します。

<?php
$args = array('posts_per_page' => 20, 'orderby' => 'date');
$query = new WP_Query($args);
?>
<?php if( $query->have_posts() ) : ?>
<div class="textnew"><ul>
<?php while ($query->have_posts()) : $query->the_post(); ?>
<li>
<span class="new_date"><?php the_time('m.d') ?></span>
<div class="new_title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
</li>
<?php endwhile; ?>
</ul></div>
<?php endif; ?>
<?php wp_reset_postdata(); ?>

ファイル名は、「my_new_post.php」にしました。

＊以下の数字部分を変更することで、表示件数を指定できます。

'posts_per_page' => 20

＊cssで調整できるように、以下のようなclassを付けました。

• 全体のクラス；textnew
• 日付のクラス；new_date
• タイトルのクラス；new_title

ショートコードで呼び出す

以下の投稿の最初の項目、「固定・投稿ページでショートコードを使用できるようにする」を行います。

https://ks-fdripp.tfmwish.comblog_short/

上で作成した.phpファイル「my_new_post.php」を、ftpソフトなどで、function.phpと同じ階層にアップロードします。

これを呼び出すには、投稿ページなど表示したい場所に以下の様に記入します。（[]は除いています）

myphp file='my_new_post'

cssの例

当ブログのトップページは、以下のcssを適用しています。

.new_title a{
text-decoration: none;
color: #403b3b;
padding-top:10px;
padding-bottom:10px;
font-size: 16px;
}
.new_title {
overflow: hidden;
margin-top: -36px;
padding-left:55px;
margin-bottom:5px;
border-bottom:1px dotted #403b3b;
}
.textnew li :hover{
background-color: #F8F8FF; 
}
.textnew ul a{
display:block;
height:auto;
list-style:none;
}
.textnew ul {
list-style: none;
padding:0;
}
.new_date{
color: #fff;
background-color: #2196f3;
font-size: 14px;
padding: 1px 5px 0;
border-radius: 2px;
}