WP/ 記事タイトルをクリックさせて中身を表示

Question

お世話になります。
どうしても頭を悩ませていています。
WORDPRESSを使用し、シンプルに投稿内容を表示させたく思っています。
記事タイトル一覧のページで、各タイトルをクリックしたら
記事内容をアコーディオンメニュー的に表示させたいのです。
jqueryでもcss3でもいいのですが、どこかに参考サイトはないでしょうか？
探したのですが、見つからなくて困っています。
何卒、ご教授ください。

shockatz · Accepted Answer

Wordpress アーカイブテンプレートで

[概要表示][詳細表示]

404

内に以下のjQueryを $(function(){ $('accordionLister dd').hide(); $('document').on('click','.showExcerpt',function()){ $('accordionLister dd').hide; $(this).parent().find('dd').show(); } }); 内容が約わからないのですが、だいたいこんな感じ？

shockatz · Answer

そ程度の要件を、wordpressのphpスクリプトを使い、わざわざサーバサイドでやるのは感心しないです。

反応も鈍く、サーバ負担も高く、トラフィックも多い。

理想の処理は、表示すべきデータ（ページ単位）をwordpressで取得しておき、jQueryで表示すること。
ただ、こういう「組み合わせ」的な要件に対するソリューションがBingo!で見つかることはほとんどないと思いますよ。

やりたいことは以下の方法論の組み合わせ。

■wordpressテンプレート上で、任意のjQueryを走らすことのできるスキル

■wordpressテンプレートを書くスキル
各種の投稿をカテゴリーやカスタム投稿タイプ指定で取得する。
ページング機能も必要。
titleとcontentを以下の形式で列挙するwordpressループを記述。
<dl>
<dt>タイトル</dt>
<dd>本文</dd>
</dl>
CSSで $('dd').hide(); などして本文を隠す

■jQueryでアコーディオン（的な）UIを記述するスキル
jQueryを使い、上記のtitleをクリックしたら、いったん全ての$(dd)をhide()し、$(this).parent().find("dd")なddを取得してshow()する。

３つのうちどの部分で「頭を悩ませて」いるんですか？

タイトル: 本文

CSSで $('dd').hide(); などして本文を隠す ■jQueryでアコーディオン（的な）UIを記述するスキル jQueryを使い、上記のtitleをクリックしたら、いったん全ての$(dd)をhide()し、$(this).parent().find("dd")なddを取得してshow()する。３つのうちどの部分で「頭を悩ませて」いるんですか？

gogo1977 · Answer

カテゴリ一覧を開閉できるPHPソースはありますので、そちらを参考にしながら一覧画面のPHPソースを書き換えるのはいかがでしょうか？

■wordpress記事投稿画面のカテゴリー一覧を開閉式にする
http://ao-works.net/wordpress-category-list-to-open

WP/ 記事タイトルをクリックさせて中身を表示

Wordpress

そ程度の要件を、wordpressのphpスクリプトを使い、わざわざサーバサイドでやるのは感心しないです。

この回答への補足

カテゴリ一覧を開閉できるPHPソースはありますので、そちらを参考にしながら一覧画面のPHPソースを書き換えるのはいかがでしょうか？

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング