悩むブログ初心者
ページ内リンク（ジャンプ）を設定したいな。あれ？アンカーボタンがないぞ？WordPress5.0(ワードプレス)の使い方がわからない！新エディターGutenberg（グーテンベルグ）が使い辛くて困ってるのに、解説しているサイトがまだ少ない…。
私が実際使っていて困ったこと&調べてわかった解決方法を覚書きしておきます。
・プラグイン不要
・「TinyMCE Advanced」は使わない
・HTMLをキー入力しなくて良い
・リスト機能と併用できない
・「見出し」にしか飛ばせない
説明していきますね。
【ページ内リンク（ジャンプ）】の方法
１、リンクを貼る
①ジャンプ元にしたい部分をドラッグした状態で「リンク」ボタンを押す
②「＃○○（任意の文字）」と入力
上の例では「#hajimete」にしました。
最初に「#」を付けるのを忘れずに！！
任意の文字は「＃123」でも[#a」でも何でも良いです。
※任意の文字はページ内で同じものは使えません。
複数リンクを貼りたい時はそれぞれ違う文字にしてね。
２、アンカー（ジャンプ先）を作る
アンカー、つまり飛んでいく目的地を指定します。
①目的地の見出しを選択し「高度な設定」を開く
②「HTMLアンカー」欄に「○○（任意の文字）」を入力
先ほどの「＃hajimete」のうち、「#」を除いた「hajimete」のみを入力します。
「#」を外すのを忘れないように！
３、プレビューで確認
これで完了です！必ずプレビューで飛べるか確認してね。
注意。私はこれで失敗しました
- こういう
- リスト
- には貼れないよ
まずワードプレスの機能でリストを設定して、リストの1行目にリンクを貼ったらジャンプできませんでした。
上のリスト例だと「こういう」部分に貼りたかったんですけど…。
●こういう
●リスト
●には貼れるよ
仕方なく段落ブロックで自分で文字を打ち、リストにしました。
まとめ
WordPress5.0の新エディタ「Gutenberg（グーテンベルグ）」は便利です。
使い方さえわかれば凄く簡単に【ページ内ジャンプ】ができます。
従来のエディタとは違って、
・プラグイン不要
・「TinyMCE Advanced」は使わない
・HTMLをキー入力しなくて良い
これはかなり便利ですよね。
頑張って使いこなせるようになりたいです。
今回は以上です。
コメント