会員サイトをリニューアルしました! 新サイトはこちら

記事内リンクで目次戻る方法 < SWELLに関する質問

フォーラムをリニューアルしました!
今後は、新フォーラムをご利用ください。

記事内リンクで目次戻る方法
 
通知
すべてクリア

[解決済] 記事内リンクで目次戻る方法

8 投稿
3 ユーザー
16 Likes
2,694 表示
kajet
(@kajet)
Active Member
Topic starter
 

いつもお世話になってます。

調べてもわからなかったためこちらで質問します。

本文に「目次へ戻る」というテキストリンクを設置し

目次まで記事内リンクで飛ばしたいと考えています。

Table of Contents Plusを使っていた時は「#toc_container」でアンカーを設置すれば飛べましたが
SWELLの場合、どのようなアンカーを設定すれば、目次まで飛べるのでしょうか?

ご存知の方がいらっしゃれば教えていただけますと幸いです。

よろしくお願いします。

 
投稿済 : 12/09/2020 12:42 am
pompom reacted
しらこ
(@96ssbike)
Prominent Member
 

以下の方法で対応可能です。

まず、SWELL標準の自動で出力される目次は使用しないでください。自動出力の目次にはアンカーは付与されていませんし、後から付与することもできません。

SWELLでは手動でショートコードで目次を呼び出すことができます。ショートコードにより任意の場所に目次を設置することができます。

ショートコードブロック内に、

[swell_toc]

というショートコードを書きます。これが目次の呼び出しコードです。

目次の呼び出しコードを書いたら、そのショートコードブロック自体を、グループ化します。

グループ化すると、グループブロックになりますので、そのグループブロック自体には任意のアンカーを設定することができますので、それでアンカーを指定してトップに戻るボタン設置のカスタマイズをしていただければと思います。

This post was modified 4年前 2回 by しらこ

にゃーん .

 
投稿済 : 12/09/2020 8:24 am
kajet
(@kajet)
Active Member
Topic starter
 

@96ssbike

ショートコードでの出力が必要になるのですね。

記事への導入を検討してみます。

とてもわかりやすくご説明いただきありがとうございます!

 
投稿済 : 12/09/2020 9:15 pm
つぶ and しらこ reacted
しらこ
(@96ssbike)
Prominent Member
 

最後、私が書いたの間違いで「トップに戻る」ボタンではなく、「目次へ戻る」ボタンでしたね。そこだけ訂正させていただきます。ご検討ください…!

にゃーん .

 
投稿済 : 13/09/2020 1:11 am
pompom, kajet, 了(開発者) and 1 people reacted
了(開発者)
(@ryo)
Illustrious Member Admin
 

@96ssbike
ありがとうございます!!

 
投稿済 : 13/09/2020 12:23 pm
pompom, kajet and しらこ reacted
kajet
(@kajet)
Active Member
Topic starter
 

@96ssbike

無事再現できました!

とても自分ではこの仕様に気づかなかったです:;

ありがとうございます!

 
投稿済 : 14/09/2020 5:03 am
しらこ reacted
しらこ
(@96ssbike)
Prominent Member
 

@kajet

目次プラグインを使用して実装するのでもいいのですが、こちらのほうがプラグインを使用しないので、軽量になったり、プラグインが更新されないリスクもなくなるので、何とか実装したいなぁと思って考えてみました 😊 

再現できてよかったです…!

にゃーん .

 
投稿済 : 14/09/2020 5:19 am
了(開発者) and kajet reacted
了(開発者)
(@ryo)
Illustrious Member Admin
 

しらこさん、対応ありがとうございます...!

 
投稿済 : 15/09/2020 12:24 pm
共有: