« Inkscape写真から一部を切り取る | トップページ | 【WordPress】検索フォーム »

2012/12/22

WordPress ブログで『続きをみる』

WordPressを始めました。
PHPは前も勉強がしたことがなかったので恐る恐る使ってみることに★

基本、HTMLとCSSだからこの2つの勉強になると思い
と言ってもHTML5とCSS3はまだ踏み込まないように作りました(*^-^)

BLOGで投稿すると”続きをみる”をつけることができます。
アタシはこれをテキストではなく、画像にしたかったので覚書。

【続きをみる】は投稿のHTMLに変更すると“more”があるので、設定したいところにカーソルをおき、ポチッとな★

これで、一覧を表示したときに本文全部ではなく指定した部分のみ表示してくれます。

【続きを見る】と表示したいときは、PHP(index.phpなど)のループ(ブログ投稿一覧を表示するループ)の中に

<?php the_content('続きを見る')>

とすればOK。
(’’)の中の文字を好きな文言に変更出来ます。


じゃぁ、テキストではなく画像にしたい場合は

<p class="more-link">
<?php the_content('<img src="'.get_bloginfo('template_directory').'/img/continuation.png" alt="read more" title="Read more..." />'); ?>
</p>

で、CSSでお好きなように変更可能です。


もしくは、CSSのbackgroundで指定することも★

ループ内は
<?php the_content('<div class="moretext"></div>'); ?>
としてCSSで

.moretext {
width: 100px;
height: 45px;
background:url(/images/leaf.gif) no-repeat right middle;
padding: 10px 50px 15px 5px}

と指定してもOKです。

« Inkscape写真から一部を切り取る | トップページ | 【WordPress】検索フォーム »

WordPress」カテゴリの記事

コメント

この記事へのコメントは終了しました。

トラックバック


この記事へのトラックバック一覧です: WordPress ブログで『続きをみる』:

« Inkscape写真から一部を切り取る | トップページ | 【WordPress】検索フォーム »