Cocoonフォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール
  8. Cocoonカスタマイズ依頼

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

アンカーのご相談、Table of C...
 
共有:
通知
すべてクリア

[解決済] アンカーのご相談、Table of Contents PlusからCocoonの目次に乗り換えが難しい

5 投稿
4 ユーザー
3 Reactions
1,750 表示
(@nohonoho)
Active Member
結合: 6年前
投稿: 14
Topic starter  

こんにちは。恐れ入りますがご相談があります。

Table of Contents PlusからCocoonの目次に乗り換えができず困っています。。 たとえばですが、現在、次のようなリンクがあります。Table of Contents Plusの場合はこのようなアンカーになります。

 https://xxx.com/table-of-contents-plus/#Table_of_Contents_Plus  
<h2>Table of Contents Plus</h2> 

通常のページは問題ないのですが、アンカーを飛び先としてリンクを張っている記事が結構あります。。 Cocoonの目次は数字の連番なので、リンクがおかしなことになってしまいます。

1回数字の連番にリンクを修正してもいいのですが、僕の場合は記事を修正する場合が結構あります。 その際、見出しごと順番をひっくり返すことが多いです。。 たとえばまとめ記事でサービスが終了したとき、見出しの順番を1番したに移動する場合もあります。 そのたびにリンクがおかしなことになってしまうので困っています。

Cocoonの設定に、[H見出し内のタグを有効にする]がありました。 そこで、チェックをいれて、次のような感じにしましたが、

<h2 id="toc">Table of Contents Plusのプラグインの使い方</h2> 

目次のリンク先は https://xxx.com/table-of-contents-plus/#toc にはなりませんでした。

恐れ入りますが、簡単なカスタマイズできる方法があれば知りたく、 また「目次ナンバーの表示」に「見出しの英文字をそのまま出力」「idを使う」みたいな設定を追加することはできませんでしょうか。 「見出しの英文字をそのまま出力」する方がTable of Contents Plusと同じなのでどちらかというと助かりますが、 アンカーの名前が固定になれば大丈夫です。難しければ、Table of Contents Plusをそのまま使い続ければいいのですが、 できましたらCocoonの目次に乗り換えたいと思っています。

記事の修正をすることが多く記事の見出しを入れ替えたとき、リンク元の目次のアンカーの名前が固定になる方法を探しています。お手数おかけしますがよろしくお願いします。


   
たなかま
(@tanakama)
Prominent Member Registered
結合: 7年前
投稿: 600
 

こんにちは。

恐れ入りますが、簡単なカスタマイズできる方法があれば知りたく、

簡単ではないかも知れませんが、以下の記事をご参考にTable of Contents Plusで出力されるidに合わせて、見出しにidを付けるぐらいしかなさそうですね。目次出力の部分を削除すれば、h要素にidが自動で付きます。

https://blog-and-destroy.com/2013

「見出しの英文字をそのまま出力」というのが難しそうではありますが・・・。

 

基本的にアンカーリンクを付ける場合、見出し内にid="xxx"を手動で付けた方が良かったですね。目次プラグインだと設定を変えただけで、アンカーリンクがすべてやり直しになりますので。

余談ですがTable of Contents Plusはずっと更新されていないので、もはや非推奨かと思います。


   
わいひら reacted
わいひら
(@yhira)
Illustrious Memberサイト Admin
結合: 7年前
投稿: 17179
 

Table of Contents PlusとCocoon自体の仕様が違うので、簡単な方法はないと思います。
アンカーリンクをそのままにしておくということであれば、Table of Contents Plusを利用するしかないかもしれません。


   
かうたっく
(@kautakku)
Famed Member Moderator
結合: 7年前
投稿: 4764
 
https://xxx.com/table-of-contents-plus/#Table_of_Contents_Plus  
<h2>Table of Contents Plus</h2>

通常のページは問題ないのですが、アンカーを飛び先としてリンクを張っている記事が結構あります。。 Cocoonの目次は数字の連番なので、リンクがおかしなことになってしまいます。

ただ記事のトップに移動するので、目次を置いていれば(また見出しの文字列を書いてれば前提)ユーザーさんは探しやすいカモです。

 

 

僕の場合は記事を修正する場合が結構あります。

修正して見出しの増減があれば、Cocoonは見出しの数で飛ぶ先が変わる仕様なので、修正する場合はh2タグにIDを付けて過去記事のアンカーリンク先を修正する必要がありますよね。

その際、Cocoon設定・目次タブより「見出し内タグ」の

見出し内のタグを有効にする
h2-h6見出し内のHTMLタグをそのまま出力します。

h見出し内タグを有効にしないと反映されないです。

 

気長にする場合は、タグマネージャー・もしくはアナリティクスで見出しへ飛ぶリンク先を(行動・イベント より内部リンクのクリックのイベントのアクションを参考に)修正してく感じなってる状況です。※ただの個人的体験談? 

 

それが手間であれば、わいひらさんの言う通り、toc+のプラグインを使ってくのか良いカモしれないです

 

 

Cocoonの設定に、[H見出し内のタグを有効にする]がありました。 そこで、チェックをいれて、次のような感じにしましたが、

<h2 id="toc">Table of Contents Plusのプラグインの使い方</h2>

目次のリンク先は  https://xxx.com/table-of-contents-plus/#toc  にはなりませんでした。

上で書いちゃったんですが、Cocoon設定・目次タブより「見出し内タグ」の内容にチェックを入れて保存する必要があります。


   
わいひら reacted
(@nohonoho)
Active Member
結合: 6年前
投稿: 14
Topic starter  

お三方、わざわざお時間さいていただきありがとうございました。大変助かりました。

基本的にアンカーリンクを付ける場合、見出し内にid="xxx"を手動で付けた方が良かったですね。目次プラグインだと設定を変えただけで、アンカーリンクがすべてやり直しになりますので。

そうなんですよね。かなり昔のこととはいえ、最初、運用方法をもう少しよく考えればよかったかもしれません。。

Table of Contents Plusはずっと更新されていないので、もはや非推奨かと思います。

そうなんですよね。更新されていないのが、ちょっと心配なのですよね。今みたら更新日が4年前でした。

ただ旧サイトは物量が多いため、わいひらさんが言われるように現状、Table of Contents Plusまま、様子見して新サイトはCocoonの目次を使って、かうたっくさんの方法で運用しようと思います。 ? 

細かい運用方法は後ほどこちらの回答などを参考に考えたいと思いますが、これでなんとかなりそうです。おかげさまで前に進めそうです。ありがとうございました。


   
わいひら reacted
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。

また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

タイトルとURLをコピーしました