プロが教えるわが家の防犯対策術!

下記コードでアーカイブで表示しているのですが、アコーディオンが閉じません。
月を非表示にしてアコーディオンを閉じるためにはどうすればよいでしょうか?
jQueryは参考サイトと同じものを実装しております。

※参考サイト
https://cosybench.com/customize-wp-archives-look/

※表示されているhtml
<div class="month-archive">
<h4 class="monthly-archive-title"></h4>
<ul class="archive-list"><li class="year current acv_open">2022<ul class="month-archive-list"><li><a href="http://www.gsdfgsdgs.cfbx.jp/2022/5">2022年5月</a>(6)</li><li><a href="http://www.gsdfgsdgs.cfbx.jp/2022/6">2022年6月</a>(4)</li></ul></li></ul> </div>

※PHPコード
<div class="month-archive">
<h4 class="monthly-archive-title"></h4>
<?php
/* 年月別アーカイブリストを取得する */
$sql = "
SELECT
YEAR (post.post_date) AS y,
MONTH (post.post_date) AS m,
count(*) AS c
FROM
wp_posts AS post
INNER JOIN wp_postmeta AS meta
ON post.id = meta.post_id
WHERE
meta.meta_key = 'single_rss_feed1'
AND post.post_type = 'post'
AND post.post_status = 'publish'
GROUP BY
y,
m
";
$query = $wpdb->prepare($sql);
$ym_items = $wpdb->get_results($query);
/* 年月別配列を作成 */
$ym_array = [];
foreach ($ym_items as $item) {
$ym_array[$item->y][$item->m] = $item->c;
}
$this_year = (string) idate('Y'); // 現在の年を、4桁の文字列で取得
$out = '<ul class="archive-list">';
foreach ($ym_array as $y => $y_items) {
if ($y === $this_year) { // 今年だったら
$out .= '<li class="year acv_open current">'.$y;
} else { // それ以外の年の場合
$out .= '<li class="year current acv_open">'.$y;
}
$out .= '<ul class="month-archive-list">';
foreach ($y_items as $m => $c) {
$url = home_url("{$y}/{$m}");
$out .= "<li><a href=\"{$url}\">{$y}年{$m}月</a>({$c})</li>";
}
$out .= '</ul>'; // 閉じる <ul class="month-archive-list">
}
$out .= '</li>'; // 閉じる <li class="year">
$out .= '</ul>'; // 閉じる <ul class="archive-list">
// HTMLの出力
echo $out;
?>
</div>

A 回答 (3件)

No2です。



>原因が分かりました。~~
貴方にしかわからない情報になっています。
読む方にとっては、さっぱりわかりません。

>何が考えられますでしょうか?
直接の原因はNo2。
その他のありがちな原因は、No1に列挙してあります。
ひとつずつ確認すれば、解決するものと想像します。
    • good
    • 1

No1です。



初期表示のご質問なら、多分これが原因。
>if ($y === $this_year) { // 今年だったら
>$out .= '<li class="year acv_open current">'.$y;
>} else { // それ以外の年の場合
>$out .= '<li class="year current acv_open">'.$y;
>}
    • good
    • 2
この回答へのお礼

原因が分かりました。
直読みすると初めは効かなかったのですが、wordpressの初期読み込みを無効にして、自分で読み込んだ後にarchive.phpのパス取得処理を変更したところ読み込めるようになりました。

get_stylesheet_directory_uri→get_template_directory_uri

パスはcssで通っていたのを参考に変更して、コードも一時簡易的なものに変更して検証いたしました。
同一ページ内のscript干渉も調査しましたが問題なさそうです。

原因となるコードは特定できたのですが、肝心の原因が分かりません。
何が考えられますでしょうか?

お礼日時:2022/07/16 20:51

こんばんは



>アコーディオンが閉じません。
よくわかりませんけれど、まったく動作しないのか、あるいは初期表示だけ全部表示された状態になってしまうということでしょうか?
その状態で、年をクリックした場合に、開閉動作はしますか?

初期表示だけの問題であるなら、
 ・CSSが正しく読み込めていない
 ・HTMLの構成、クラスが正しく設定できていない
などが考えられます。
(:before、:after等を気にしなければ、初期表示の状態をスクリプトで設定することも可能です)

開閉動作が機能しないのであれば、
 ・jQuery(本体)を読み込んでいない
 ・スクリプトが正しく読み込めていない
 ・HTMLの構成、クラスが正しく設定できていない
などが考えられます。

まずは、出力されたHTMLがサンプルサイトと同様の構成になっているかを確認してみてください。
(特に、クラス名の設定に関して)
    • good
    • 2
この回答へのお礼

回答ありがとうございます。

お礼日時:2022/07/16 20:52

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