こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

WordPress 最新記事をまとめてURLにする

参考のURL
https://www.buzzhook.co.jp/
下の方に「BACKYARD BLOG」があります。
アイキャッチ画像、年月日、カテゴリー、タイトル、抜粋全てどれをクリックしてもURLへジャンプします。
HTMLソースは下記になります。
<li>
<a herf="#">
.
.
.
</a>
</li>

WordPressのトップページも同様にしたいのですが、PHPプログラムはまだ初心者なので、うまくいきませんでした。結果はアイキャッチのみURLでした。
どこが違うのでしょうか?
宜しくお願いします。

<!-- main -->
<main>

<!-- 最新記事リスト -->
<ul>
<li>
<a href="<?php the_permalink(); ?>">
<?php query_posts('posts_per_page=5'); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

<!-- アイキャッチ表示 -->
<?php if (has_post_thumbnail()) : ?>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
<?php else : ?>
<a href="<?php the_permalink(); ?>"><img src="<?php bloginfo('template_url'); ?>/img/noimage.gif" width="100" height="100" alt="デフォルト画像" /></a>
<?php endif ; ?>

<!-- カテゴリー表示 -->
<?php echo get_the_category()[0]->name; ?>

<!-- 抜粋 -->
<?php echo get_the_excerpt(); ?>
<span class="date">
<?php the_time('Y年n月j日'); ?>
<?php
$days=30;
$today=date('U'); $entry=get_the_time('U');
$diff1=date('U',($today - $entry))/86400;
if ($days > $diff1) {
echo '<img src="images/new.gif" alt="New" />';
}
?>
</span>
</a>
</li>
<?php endwhile; endif; ?>
<?php wp_reset_query(); ?>
</ul>

<!-- 最新記事リストここまで -->
</main>

投稿日時 - 2018-11-26 00:09:03

QNo.9561737

困ってます

質問者が選んだベストアンサー

このサイトはタブやスペースが効かないため、すごく見づらいPHPソースになってしまいましたが……。こんな感じでいかがでしょうか。

<?php query_posts(); ?>よりも<?php get_posts(); ?>のほうが使いやすいと思われるので、全体的にかなり手を入れさせていただきました。

そもそも、もともとのソースでアイキャッチ画像にしかURLが表示されないのは、<a>タグがアイキャッチにしかかかってないからではないでしょうか。アイキャッチの<img>タグの直後に</a>タグがあるので、ここでリンクが切れてしまっているんです。

そうではなく、</a>タグの位置を</li>タグの直前にずらしてあげれば、全体的にリンクがかかるかと思います。

それから、<?php echo get_the_category()[0]->name; ?>という書き方もまずくて、たしか()と[0]は混ぜて使えなかったはずです。そのため下記のソースでは、()と[0]が一緒にならないように、$post_categoriesという変数を使って分けています。

念のために手元のWordPressで動かしてみましたが、とりあえず動いているので大丈夫ではないでしょうか。


<!-- 最新記事リスト -->
<ul>
<?php
$latest_posts = get_posts( array(
'posts_per_page' => 5, // 表示する記事の数
'post_type' => 'post', // (固定ページじゃなくて)投稿ページを取得
'fields' => 'ids',
) );

foreach( $latest_posts as $post ):
setup_postdata( $post );

if( has_post_thumbnail() ) {
$post_thumb = get_the_post_thumbnail( '', 'thumbnail' ); // アイキャッチがあるときはアイキャッチを表示
} else {
$post_thumb = '<img src="' . get_template_directory_uri() . '/img/noimage.gif" width="100" height="100" alt="デフォルト画像" />'; // アイキャッチがないときは《noimage.gif》を表示
}

$post_categories = get_the_category(); // カテゴリーを取得
$post_content = wp_trim_words( get_the_content(), 40, '……' ); // 40字分を抜粋
?>
<li <?php post_class(); ?>>
<a href="<?php the_permalink(); ?>">
<?php echo wp_kses_post( $post_thumb ); ?><!-- アイキャッチ -->
<div class="post-time"><?php the_time('Y.m.d'); ?></div><!-- 年月日 -->
<div class="post-categories"><?php echo esc_html( $post_categories[0]->name ); ?></div><!-- カテゴリー -->
<div class="post-title"><?php the_title(); ?></div><!-- タイトル -->
<div class="post-content"><?php echo esc_html( $post_content ); ?></div><!-- 抜粋 -->
</a>
</li>

<?php
endforeach;
wp_reset_postdata();
?>
</ul>
<!-- 最新記事リストここまで -->


『WordPressをちゃんと使うための教科書』という本には、こうした《get_posts》の使い方はもちろん、PHPの書き方がわかりやすくまとまっています。少し古い本なので最新のWordPressに対応していないのが欠点ですが、私自身、ほんとうに、すごく助けられた本でもあります。

ご予算的に許せるのであれば、一冊手元にあってもいいかもしれません。

参考URL:https://book.mynavi.jp/ec/products/detail/id=22613

投稿日時 - 2018-11-26 23:55:56

お礼

コメントありがとうございます。
前回と同様に「ファイルを更新」ボタンをクリックしましたところ
「nonce_failure」とエラー?メッセージがでました。
「nonce_failure」とは何か検索しましたところ、「本当に実行していいですか ?」だそうです。
ページを確認しましたところ、何も反映されておりませんでした。
記述は下記になります。


<?php
/*
Template Name: 固定ページトップ用
*/
global $godios;

get_header();


?>

<!-- wrapper -->
<div id="wrapper" class="<?php echo $godios['column']['position']; ?>">


<!-- gadios wrapper -->
<div id="godios-wrapper">
<div class="godios-container">
<!-- main -->
<main>
<!-- 最新記事リスト -->
<ul>
<?php
$latest_posts = get_posts( array(
'posts_per_page' => 5, // 表示する記事の数
'post_type' => 'post', // (固定ページじゃなくて)投稿ページを取得
'fields' => 'ids',
) );

foreach( $latest_posts as $post ):
setup_postdata( $post );

if( has_post_thumbnail() ) {
$post_thumb = get_the_post_thumbnail( '', 'thumbnail' ); // アイキャッチがあるときはアイキャッチを表示
} else {
$post_thumb = '<img src="' . get_template_directory_uri() . '/img/noimage.gif" width="100" height="100" alt="デフォルト画像" />'; // アイキャッチがないときは《noimage.gif》を表示
}

$post_categories = get_the_category(); // カテゴリーを取得
$post_content = wp_trim_words( get_the_content(), 40, '……' ); // 40字分を抜粋
?>
<li <?php post_class(); ?>>
<a href="<?php the_permalink(); ?>">
<?php echo wp_kses_post( $post_thumb ); ?><!-- アイキャッチ -->
<div class="post-time"><?php the_time('Y.m.d'); ?></div><!-- 年月日 -->
<div class="post-categories"><?php echo esc_html( $post_categories[0]->name ); ?></div><!-- カテゴリー -->
<div class="post-title"><?php the_title(); ?></div><!-- タイトル -->
<div class="post-content"><?php echo esc_html( $post_content ); ?></div><!-- 抜粋 -->
</a>
</li>

<?php
endforeach;
wp_reset_postdata();
?>
</ul>
<!-- 最新記事リストここまで -->
</main>

<!-- main -->
<?php get_template_part( 'inc/body-class' ); ?>
</div> <!-- /godios-container -->
</div> <!-- /godios-wrapper -->



</div> <!-- /wrapper -->

<!-- footer -->
<?php get_footer(); ?>

投稿日時 - 2018-11-27 06:38:05

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(3)

ANo.3

Katsu_Kaizさんが書かれているように「query_posts」は現在は非推奨なのでKatsu_Kaizさんが書かれているコードで動くと思います。

あとは、
global $godios;

<?php get_template_part( 'inc/body-class' ); ?>

この内容次第ではないですか。

とりあえず、
<?php
/*
Template Name: 固定ページトップ用
*/
get_header(); ?>
<main>
//コード
</main>
<?php get_footer(); ?>

で動くかどうか確認して原因を切り分けてみてはどうですか。

投稿日時 - 2018-11-27 11:00:12

お礼

ありがとうございます。
もう一度確認しましたら、ちゃんと反映されました。ブラウザのキャッシュにより反映に時間がかかってしまったようです。

投稿日時 - 2018-11-27 13:04:57

ANo.1

とりあえず、こんな感じではないですか。

<!-- main -->
<main>

<!-- 最新記事リスト -->
<ul>
<?php query_posts('posts_per_page=5'); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<li>

<!-- アイキャッチ表示 -->
<?php if (has_post_thumbnail()) : ?>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('thumbnail'); ?>
<?php else : ?>
<a href="<?php the_permalink(); ?>"><img src="<?php bloginfo('template_url'); ?>/img/noimage.gif" width="100" height="100" alt="デフォルト画像" />
<?php endif ; ?>

<!-- カテゴリー表示 -->
<?php echo get_the_category()[0]->name; ?>

<!-- 抜粋 -->
<?php echo get_the_excerpt(); ?>
<span class="date">
<?php the_time('Y年n月j日'); ?>
<?php
$days=30;
$today=date('U'); $entry=get_the_time('U');
$diff1=date('U',($today - $entry))/86400;
if ($days > $diff1) {
echo '<img src="images/new.gif" alt="New" />';
}
?>
</span>
</a>
</li>
<?php endwhile; endif; ?>
<?php wp_reset_query(); ?>
</ul>

<!-- 最新記事リストここまで -->
</main>

参考まで。

投稿日時 - 2018-11-26 10:53:25

お礼

コメントありがとうございます。
「ファイルを更新」ボタンをクリックしましたところ
「nonce_failure」とエラー?メッセージがでました。
ページを確認しましたところ、何も反映されておりませんでした。
記述は下記になります。
<?php
/*
Template Name: 固定ページトップ用
*/
global $godios;

get_header();


?>

<!-- wrapper -->
<div id="wrapper" class="<?php echo $godios['column']['position']; ?>">


<!-- gadios wrapper -->
<div id="godios-wrapper">
<div class="godios-container">
<!-- main -->
<main>

<!-- 最新記事リスト -->
<ul>
<?php query_posts('posts_per_page=5'); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<li>

<!-- アイキャッチ表示 -->
<?php if (has_post_thumbnail()) : ?>
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('thumbnail'); ?>
<?php else : ?>
<a href="<?php the_permalink(); ?>"><img src="<?php bloginfo('template_url'); ?>/img/noimage.gif" width="100" height="100" alt="デフォルト画像" />
<?php endif ; ?>

<!-- カテゴリー表示 -->
<?php echo get_the_category()[0]->name; ?>

<!-- 抜粋 -->
<?php echo get_the_excerpt(); ?>
<span class="date">
<?php the_time('Y年n月j日'); ?>
<?php
$days=30;
$today=date('U'); $entry=get_the_time('U');
$diff1=date('U',($today - $entry))/86400;
if ($days > $diff1) {
echo '<img src="images/new.gif" alt="New" />';
}
?>
</span>
</a>
</li>
<?php endwhile; endif; ?>
<?php wp_reset_query(); ?>
</ul>

<!-- 最新記事リストここまで -->
</main>

<!-- main -->
<?php get_template_part( 'inc/body-class' ); ?>
</div>
<!-- /godios-container -->
</div>
<!-- /godios-wrapper -->



</div>
<!-- /wrapper -->


<!-- footer -->
<?php get_footer(); ?>

投稿日時 - 2018-11-26 21:58:34

あなたにオススメの質問