新着一覧にサムネイル、タイトル、投稿日時、本文を表示したい
-
PHPのわからないwordpress初心者ですが宜しくお願いいたします。
自作のテーマのトップページ index.php にTOPIX (新着記事)・記事のタイトル
・更新日時
・本文抜粋
・記事内の画像のサムネイルを表示したいと考えています。
下記URLの最新記事部分が理想の形になります。
http://www.ise-cci.or.jp/josei/《 環境 》
wordpress 3.5.1
PHP 5.2.17過去の事例を抜粋させていただきました。
http://ja.forums.wordpress.org/topic/4289?replies=9色々と試してはみたのですが知識も少なく行き詰まってしまいました。
ご教授いただけると幸いです。何卒、宜しくお願いいたします。
-
掲載いただいた「過去の事例」そのままのような気がしますが…どの部分が不明なのでしょうか?
ご返信有難うございます。
タイトル、投稿日時、説明文は表示されているのですが、サムネイル画像が表示されません。
過去の事例を参考にサムネイルについて調査したのですが、登録方法が分かりませんでした。可能であれば自動で記事に投稿された写真を抜粋してサムネイルになればいいのですが、
お手数をおかけいたしますが、アドバイスいただけると助かります。宜しくお願いいたします。
tokostsuさんがおっしゃっているサムネイル画像についてはおそらく、WordPressの用語で「アイキャッチ画像」と呼ばれているものになります。
で、記事を書く画面においてアイキャッチ画像が登録されていないため表示されていないのでしょう。
まずは手動でアイキャッチ画像を登録してみてください。自動で記事内の画像をとってくる方法はいくつかありますが、まずは「アイキャッチ画像」が登録できて正しい表示になるかどうかお試しください。
よかった、アイキャッチは大丈夫でしたね。
では次のステップへ。私個人的によく使っているプラグインがありまして、Auto Post Thumbnailっていうんですが、アイキャッチを手動で登録しなくても、自動で1枚目の画像をアイキャッチ画像として登録してくれます。
mypacecreatorさん
早速の返信ありがとうございます!非常に助かります。
なるほど!そちらのプラグイン導入し、結果のほう報告させていただきます。わざわざ、有難うございます。
mypacecreatorさん
早速、導入し、きちんと表示されました!
ほんとに有難うございます★サムネイルのサイズ指定など可能ですか?
質問ばかりすいません。。サムネイルのサイズ指定など可能ですか?
アイキャッチ機能が有効になっているので、おそらくお使いのテーマのfunctions.phpのどこかに
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( なんか数字, なんか数字 );
という部分があると思います。
ここの数字を変えるとアップ時に生成されるアイキャッチ画像のサイズが変わります。
例えば
set_post_thumbnail_size( 300, 9999 );
だと幅最大300px、高さ最大9999pxを超えないように縦横比を保ってリサイズ
set_post_thumbnail_size( 300, 200, true );
だと幅300px、高さ200pxにトリミング英語ですが説明はこちら
http://codex.wordpress.org/Function_Reference/set_post_thumbnail_size※ただし既にアップ済みのものはサイズ変更されません。
アップし直すか、もう既にたくさんアップしてしまったのならRegenerate Thumbnailsプラグインなどを使ってください。mypacecreatorさん
返信有難うございます!試した所、アップする写真のサイズによってサムネイルサイズが変わってしまいます。
function.php内に書かれているもの
/* アイキャッチ画像 */
add_theme_support( ‘post-thumbnails’);
set_post_thumbnail_size( 260, 160, true ); // サムネイルのサイズまた、index.phpに書いてある関係しそうな箇所
<?php query_posts(‘posts_per_page=10’);
if (have_posts()) : while (have_posts()) : the_post(); ?>
<dl class=”topix”>
<dt>“><?php the_time(‘Y.m.d’); ?></dt>
<dd class=”sam”>“><?php
if ( has_post_thumbnail() ): // サムネイルを持っているときの処理
?><?php the_post_thumbnail( array(260,160), array(‘class’ => ‘imgLeft’) ); ?><?php
else: // サムネイルを持っていないときの処理
?><img src=”<?php bloginfo(‘template_url’) ?>/image/no_image.gif” alt=”noimage” class=”imgLeft” /><?php
endif; ?></dd>
<dd class=”tit”>“><?php the_title(); ?>
<?php the_excerpt(); ?></dd>
<dd class=”exp”>“><?php the_excerpt(); ?></dd></dl>
<?php endwhile; endif; wp_reset_query();?>どちらもサムネイルサイズを合わしているのですが、上手くいきません。。
お時間ある時にでも助言いただけると助かります。
宜しくお願いいたします。いろいろつっこみどころがありますが、まず本題と関係無いところで
- コードを書く時は”code”ボタンを使って囲ってください。そうでないと今回のようにおかしな表示になります。ひどいと画面全体のレイアウトが崩れることがあります。こんなふうに。。。
- index.php内の
query_posts('posts_per_page=10');
の部分と、最後のwp_reset_query();
の記述不要です。10件表示にしたいなら、ダッシュボードの表示設定から10件に設定すればOKです。
で、
どちらもサムネイルサイズを合わしているのですが、上手くいきません。。
というのは、表示される画像が260px×160pxになってないということでしょうか。
だとするとどういったサイスで掲載されているのか、元画像のサイズが260px×160pxに満たないということはないか、お調べください。
(言葉だけから推測してますので、正直あまりイメージできていません。。。)返信有難うございます。。
コードを書く時は”code”ボタンを使って囲ってください。そうでないと今回のようにおかしな表示になります。ひどいと画面全体のレイアウトが崩れることがあります。こんなふうに。。。
なるほど〜無知で申し訳ないです。確かに凄い崩れていますね・・・
以後、気を付けます!index.php内のquery_posts(‘posts_per_page=10’);の部分と、最後のwp_reset_query();の記述不要です。10件表示にしたいなら、ダッシュボードの表示設定から10件に設定すればOKです。
なるほど!了解いたしました。修正いたします。
というのは、表示される画像が260px×160pxになってないということでしょうか。
だとするとどういったサイスで掲載されているのか、元画像のサイズが260px×160pxに満たないということはないか、お調べください。いくつか記事をあげた結果です。
元の画像 サムネイル
960×720 → 225×170
680×453 → 300×200 になりました。URLを記載するのでみていただけると助かります。
URL ; http://www.tokoatsu.info/wordpress/
親身に色々とご教授いただき誠に有難うございます。
宜しくお願いいたします。上記ページを参考に、
<?php the_post_thumbnail( array(260,160), array('class' => 'imgLeft') ); ?>
のarray(260,160)
の部分を一旦削除してみてください。the_post_thumbnail(); // パラメータなし -> サムネイル
the_post_thumbnail(‘thumbnail’); // サムネイル
the_post_thumbnail(‘medium’); // 中サイズ
the_post_thumbnail(‘large’); // 大サイズ上記パラメータを使った場合、ダッシュボードのメディア設定で指定したサイズで表示されます。
arrayを使って任意の数字を使った場合、システム側でリサイズされた画像ではなく元サイズの画像が使われることがあります。set_post_thumbnail_sizeで設定したサイズのまま表示させたい場合は、array(260,160)という風に呼び出し側で数字を明示する必要はありません。
なお上記Codexには記載されていませんが、
the_post_thumbnail();
the_post_thumbnail('post-thumbnail');
上記は同じ意味で、set_post_thumbnail_sizeで設定したサイズで生成された画像を表示します。the_post_thumbnail('thumbnail');
こちらはダッシュボードのメディア設定で「サムネイル」に指定されたサイズが出ます。
用語が紛らわしいですが。
- トピック「新着一覧にサムネイル、タイトル、投稿日時、本文を表示したい」には新たに返信することはできません。