固定ページでも目次を表示したい

0
いいねをした人: 居ません
15件の投稿を表示中 - 1 - 15件目 (全16件中)
  • 投稿者
    投稿
  • #2873
    Yuzuru Kuroishi
    参加者
    4

    いつもありがとうございます。

    はじめて、WPAW: 目次ウィジェット を使おうと思ったのですが、これは固定ページでは対応していないんですね。

    記事の構成が最初にわかるとわかりやすくなるのではないかと思いますので、固定ページでも使えるようにしていただけると助かります。

    0
    いいねをした人: 居ません
    #2874
    キタジマ タカシ
    参加者
    2252

    あれ、対応しているはずですが表示されませんかね?
    例えば Snow Monkey のマニュアルは固定ページでつくっていますが、右カラムの追尾サイドバーに目次ウィジェットを設置しています。

    記事中に自動的に表示されるのは投稿だけですが、ウィジェットなら固定ページでも表示されるはずです。もしかしたら設置するウィジェットエリアによっては表示されないというバグがあるのかもしれませんので、もう一度ご確認頂いてどうしても表示されないのであれば、どのウィジェットエリアに設置されたのか教えていただければと思います。

    0
    いいねをした人: 居ません
    #2877
    Yuzuru Kuroishi
    参加者
    4

    お返事ありがとうございます。
    記事をみて早とちりしてしまいました。すみません。

    検証したところ、記事の編集画面がElementor編集の状態だと目次が表示されず、ビジュアルエディターだと、目次が表示されることがわかりました。

    ちなみにウィジェットを追加したのはページタイトルの上ですが、どこのウィジェットに追加しても表示されませんでした。

    Elementor側かもしれないので、なんとも言えませんが、可能であれば、確認いただけると助かります。

    0
    いいねをした人: 居ません
    #2879
    キタジマ タカシ
    参加者
    2252

    原因がわかりました!
    Snow Monkey の目次ウィジェット(と投稿に自動表示される目次)は、記事直下の見出しにしか反応しないようにしていたんでした!つまり、HTML 的にいうと、

    <div class="c-entry__content">
        <h2>これには反応する</h2>
        <h2>これにも反応する</h2>
    </div>

    ですが、

    <div class="c-entry__content">
        <div class="foo">
            <h2>これには反応しない</h2>
        </div>
    
        <h2>これには反応する</h2>
    </div>

    となるんです。なぜそうしているかというと、他のプラグイン等でショートコードやらを入れたときに、いわゆる「ページの見出し」の用途以外で h2 やらが使われていることが可能性としてあり、なんでもかんでも反応せさせてしまうと正しい目次構造が生成されないためそのようにしています。Elementor は見出しがいくつかのタグで囲まれて表示されるので反応しないということになります。

    Elementor の場合は「見出し」というパーツがあるので、それには反応するようにしたほうが良いのかなと思いますが、ちょっと今すぐには対処法がわからないので、おいおい調査&可能であれば対応できればなと思います。

    0
    いいねをした人: 居ません
    #2880
    Yuzuru Kuroishi
    参加者
    4

    お忙しい中、原因解明および根拠の解説に時間をとっていただき、ありがとうございました。
    具体例もあり、わかりやすいです。
    他の目次が表示されないという時にも当てはまりそうですね。
    タイトルが目次が表示されないのほうがこのスレッドとして適切かもしれませんね。

    このフォーラムの内容などを使うとFAQがつくれそうですね。とふと思いました。

    0
    いいねをした人: 居ません
    #2881
    キタジマ タカシ
    参加者
    2252

    目次、内部的にはショートコードを使っているのですが、Elementor で作成した固定ページに、テキストで次のショートコードを埋め込めば、Elementor の見出しにもとりあえず対応できそうです。よかったら試してみてください!

    
    
    
    

    このフォーラムの内容などを使うとFAQがつくれそうですね。とふと思いました。

    ですねー、まとめたいとは思っているのですが、開発作業とのバランスがなかなか…^^;

    0
    いいねをした人: 居ません
    #2914
    Yuzuru Kuroishi
    参加者
    4

    ありがとうございます!!!!!!!
    目次表示されました!!!!!

    言うのはかんたんだけど、実際に実現は大変ですよね。失礼しました。

    0
    いいねをした人: 居ません
    #2926
    Yuzuru Kuroishi
    参加者
    4

    Elementorで見出しのhtmlの指定が全部hタグだと表示されたのですが、hタグが多かったので、divに変えたら、見出しが表示されなくなりました。
    全部hタグでないといけないのでしょうか

    0
    いいねをした人: 居ません
    #2927
    キタジマ タカシ
    参加者
    2252

    divに変えたら

    これはどういうふうに変更されましたか?
    Elementor にそれほど詳しくないので外しているかもですが、僕が前述した、

    
    
    
    

    は Elementor の「見出し」というパーツを入れた場合に反応するようになっています。もし「見出し」以外のパーツを入れて見出しっぽい装飾をしたとしても、それが見出しかどうかの判断は機械的にはできないので、 headings=".elementor-heading-title" の部分をうまいこと調整して対応する必要があるかもしれません。

    0
    いいねをした人: 居ません
    #2979
    Yuzuru Kuroishi
    参加者
    4

    ありがとうございます。
    Elementorで見出しのパーツのhtmlの指定でh2だった箇所をdivに変更しました。

    目次という見出しの変更はプログラム上での変更になりますでしょうか。

    0
    いいねをした人: 居ません
    #2986
    キタジマ タカシ
    参加者
    2252

    すみません!勘違いしていました!ご指摘の通り、hタグじゃないとダメということにしていたみたいです。なぜかというと、そうしないと見出しの「入れ子」ができないためです(h2, h3 となっていれば階層が判断できるが div だと階層が判断できない)。

    ということで、div じゃなくてhタグを使って頂く必要があります。

    ※とりあえず、hタグ以外の場合は全部同じ階層として判定されるようにアップデートしたいと思います。

    0
    いいねをした人: 居ません
    #2988
    Yuzuru Kuroishi
    参加者
    4

    とんでもないです。原因を特定していただき、ありがとうございます!

    0
    いいねをした人: 居ません
    #2989
    キタジマ タカシ
    参加者
    2252

    今手元では修正しました。リリースまで少々お待ちください。

    目次という見出しの変更はプログラム上での変更になりますでしょうか。

    そうですね。子テーマの functions.php に下記をコピペしてみてください。

    add_filter( 'gettext', function( $translation, $text, $domain ) {
    	if ( 'inc2734-wp-contents-outline' === $domain && 'Outline' === $text ) {
    		return '「目次」以外のラベルを表示します!';
    	}
    	return $translation;
    }, 10, 3 );
    0
    いいねをした人: 居ません
    #2993
    Yuzuru Kuroishi
    参加者
    4

    出来ました!ありがとうございます

    0
    いいねをした人: 居ません
    #4908
    motoyamayuki
    参加者
    0

    こちらの内容を見て、無事に固定ページに目次を表示できました。
    関連の質問させてください。(あたらしくトピック立てたほうがよかったでしょうか?)

    ショートコードで以下のように記述しました。

    
    
    
    

    表示はできているのですが、ページ内リンクで移動した際に、見出し部分が固定ヘッダーと被ってしまいます。
    ウィジェットの「ページタイトルの上」に目次ウィジェットを追加すると(目次が2個表示されている状態)、固定ヘッダーと被らない位置にスクロールされました。

    ショートコードで入れただけでは呼び出されないjsなどがありますでしょうか?

    0
    いいねをした人: 居ません
15件の投稿を表示中 - 1 - 15件目 (全16件中)
  • トピック「固定ページでも目次を表示したい」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。