【Cocoon】「目次に戻る」ボタンの作成㊙テクニック！1分でかんたん解決【WordPress】

「目次に戻るボタンってどうやって作るの？」

「複雑なコード入力をせず、簡単に目次に戻るボタンを作りたい」

「プラグインも使わずに、目次に戻るボタンを作りたい」

この記事では、そんな方に向けて、複雑なコード入力やプラグインなしで、「目次に戻る」ボタンを作る方法をお話しします。

どこよりも分かりやすく書いている自信がありますので、ぜひ最後まで読んでマスターしてください！

目次をまだ作っていない場合は、まず下の記事をご覧ください。

また以下の記事では、Cocoonの使い方や設定方法をブログ運営歴・公開した記事数別でまとめて紹介しています。

さっそく本題に入りましょう。

「目次に戻る」ボタンとは？

「目次に戻る」ボタンとは、クリックすると目次に戻るリンクのことです。

目次に戻る

Cocoon「目次に戻る」ボタンの作り方

Cocoonで「目次に戻る」ボタンの作り方は、下記の通りです。

「目次に戻る」ボタンができているかは、プレビューで確認してみましょう！

当ブログ使用「SWELL」は目次ボタンを固定表示できる！

当ブログでは、PC画面とスマホ画面それぞれで、目次ボタンを右下に固定表示しています。

_{＼クリックで拡大！／}

目次ボタンを右下に固定表示したい場合、WordPressテーマ「SWELL」を導入すれば可能です。

「目次に戻る」ボタンを記事中に設置するデメリットは、「目次に戻る」ボタンがあるところまでページを読み進めないといけないということです。

ただ、目次ボタンを固定で設置すれば、ページのどこの部分を読んでいても目次へ戻れます。

SWELLを導入すれば、目次ボタンを固定表示できるので、ユーザーの利便性が上がります。

Cocoonで「目次に戻る」ボタンを作るメリット

Cocoonで「目次に戻る」ボタンがあるメリットをざっと書いてみました。

まとめ

今回は、複雑なコード入力やプラグインなしで、Cocoonで「目次に戻る」ボタンを作る方法を紹介しました。

当ブログでは、Cocoonに関する記事をいくつか書いてます。

下のカテゴリーページにまとめていますので、のぞいてみてください。