新・元地方の中規模印刷会社で苦悩するWebデザイナー改めWebディレクターの日記

自由な20代、窮屈な30代を経て、遂に40代になっちまったWebディレクター&パソコン講師の覚書と思う言(こと)。略称【ちほちゅう】

*

ワードプレス(WordPress)で「続きを読む」を実装する方法 #wp

      2014/11/09

  • このエントリーをはてなブックマークに追加

1年以上前の記事です。内容が古い可能性があります。

ワードプレス(WordPress)にはもともと「続きを読む」ボタンを付ける機能があります。
ところが、「つぶくまブログ」ではトップページではないところにブログのトップページに当たる最新記事一覧を置いてしまった関係か、その機能が動いてくれません。
ちなみに、記事途中に「Moreタグ」を入れればそこに「続きを読む」が入るという非常に簡単で便利な機能です。

スポンサーリンク
 

こんな感じ。
続きを読むの設定方法
赤で囲まれたボタンを押すと「More…」と書かれたラインが入り、そこに「続きを読む」が入る。

が、これだけじゃ結局できないのが今の環境。
普通にトップページが最新記事一覧であれば問題ないんですけどね。

色々調べてみるとやはり固定ページを使ってPHPプログラムを書いたテンプレートを適応させる方法ではなにもしないと「続きを読む」が表示されないようです。
その場合、以下のようにやれば表示されます。
□ テンプレートタグ/query posts – WordPress Codex 日本語版

続きを読む を表示したい場合は、グローバル変数 $more を 0 にします。

<!–?php
// 投稿 ID が 5 の投稿を表示する
query_posts( ‘p=5’ );

// 投稿の始めの部分のみ表示するため $more を 0 にする
global $more;
$more = 0;

// ループ
while (have_posts())&nbsp;: the_post();
the_content( ‘Read the full post ≫’ );
endwhile;
?–>

重要なのは真ん中の部分。
これを僕のテンプレート(blog.php)に書き加えたものが以下。

<?php
/**
* Template Name: ブログテンプレート
*/
get_header(); ?>

※中略(HTML表記)

<?php
/* Run the loop to output the posts.
* If you want to overload this in a child theme then include a file
* called loop-index.php and that will be used instead.
*/
global $more;
$more = 0;

query_posts( ‘post’ ); 
get_template_part( ‘loop’, ‘index’ );
?>

※中略(HTML表記)

<?php get_sidebar(); ?>
<?php get_footer(); ?>

以前のソースとちょっと違いますが気にせずに。

ちなみに「続きを読む」が無いときは。
続きを読む適応前
と、こんなに長かったページが、「続きを読む」を付けたことで、
続きを読む適応後
こんなにコンパクトになりました。

 - CMS, WordPress, プログラミング, ユーザビリティ , ,

アドセンス広告メイン

Comment

  1. […] ワードプレス(WordPress)で「続きを読む」を実装する方法 #wp […]

Message

メールアドレスが公開されることはありません。

  関連記事

携帯電話、スマートフォンの緊急地震速報のアラート音に説明が加わり「ブオー、地震です」に

1年以上前の記事です。内容が古い可能性があります。携帯電話の緊急地震速報のアラー …

Tumblr(タンブラー)のFacebook連携が変わった

1年以上前の記事です。内容が古い可能性があります。今まではFacebookアプリ …

no image
これぞ最強ブラウザ!?(Googleに情報を送信しないChrome)

1年以上前の記事です。内容が古い可能性があります。Google Chrome(グ …

現在地のブログを書く(Web編)

1年以上前の記事です。内容が古い可能性があります。ということで、Webで再度投稿 …

勝手にインストールの更新プログラムに不具合。酷いよ「Windows 7」

1年以上前の記事です。内容が古い可能性があります。自分はタイミングが良かったのか …

no image
perlの文字コード変換を詳しく調べてみる

1年以上前の記事です。内容が古い可能性があります。最近、perlプログラミングを …

no image
アンカーリンク(ページトップへ)5つの方法

1年以上前の記事です。内容が古い可能性があります。縦に長いサイトで、メニューが上 …

「McAfeeサイトアドバイザ」をツールバーから消す方法

1年以上前の記事です。内容が古い可能性があります。狭いネットブックのデスクトップ …

no image
ユーザインタフェースはどこまで進化する?

1年以上前の記事です。内容が古い可能性があります。ユーザインタフェース(UI)と …

YouTube動画とtwitter(ツイッター)の連動の仕方 (10/26追記)

1年以上前の記事です。内容が古い可能性があります。キースへリング美術館に行ってき …

血液型オヤジ