【3月6日実施】システムメンテナンス実施のお知らせ

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

A 回答 (3件)

Wordpress


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

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<dl class="accordionLister">
<dt><?php the_title() ?><span class='showExcerpt'>[概要表示]</span><a href="<?php the_permalink() ?>">[詳細表示]</a></dt>
<dd><?php the_excerpt() ?></dd>
</dl>
<?php endwhile; else: ?>
<p>404</p>
<?php endif; ?>


<head>内に以下のjQueryを

$(function(){
$('accordionLister dd').hide();
$('document').on('click','.showExcerpt',function()){
$('accordionLister dd').hide;
$(this).parent().find('dd').show();
}
});

内容が約わからないのですが、だいたいこんな感じ?
    • good
    • 0
この回答へのお礼

大変ありがとうございます!
まずはやってみます!
お手数をおかけいたしました。

お礼日時:2014/11/14 09:48

そ程度の要件を、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()する。


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

この回答への補足

ありがとうございます!
わざわざサーバーサイドでやらせることは
あまり良くないということですよね。
今回、ちょっとイレギュラーな組み方をしなければならず、
このような悩みを抱えてしまいました。

特に頭を悩ませているのは、
▪︎titleとcontentを以下の形式で列挙するwordpressループを記述。
■jQueryでアコーディオン(的な)UIを記述する

といったところだと思います。

補足日時:2014/11/13 12:36
    • good
    • 0

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



■wordpress記事投稿画面のカテゴリー一覧を開閉式にする
http://ao-works.net/wordpress-category-list-to-o …
    • good
    • 0
この回答へのお礼

ありがとうございます!
ちょっと試したいと思います!

お礼日時:2014/11/13 12:29

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!