ブログを書いているとページ内リンクを設定したい時ってありますよね。
この記事ではページ内リンクを設定する方法をまとめて見ました。
ページ内リンクの設置３ステップ
必要なのはたったの3ステップです。
1.プラグイン「TinyMCE Advanced」をインストール
2. テキストにリンクを設定する
3.リンク先にアンカーを設定する
「TinyMCE Advanced」を使うとビジュアルエディタで簡単にページ内リンクを設定する事が出来るので、今回は「TinyMCE Advanced」を使用した設置方法をご説明いたします。
TinyMCE Advancedをインストール
まずはプラグイン→新規追加で「TinyMCE Advanced」と検索してTinyMCE Advancedをインストールして「有効」にします。
設定から「TinyMCE Advanced」をクリックして「使用しないボタン」の中から「アンカー」をツールバーにドロップ。
これでTinyMCE Advancedインストールは完了です。
テキストにリンクを設置する
リンクを設置したいテキストを選択して「リンクの挿入ボタン」をクリックします。
ここに#から始まる任意の英数字を設定します。
ここでは＃aaaと設定しますが、記述は何でもOKです。＃は忘れずに付けてください。
リンク先にアンカーを設定する
次にページ内の飛ばしたいリンク先にアンカー設定をします。
先程設置したリンクをクリックしたら、移動する先のリンク設定です。
飛び先にしたいテキストを選択して、アンカーボタンをクリックします。
アンカーボタンをクリックしたらIDの欄に先ほど設定した「＃aaa」の＃を抜いた「aaa」を入力して「OK」をクリック。
これでページ内リンクの設置が完了です。
プレビューでリンクが効いていたら作業は完了です。
TinyMCE Advancedを使っていない方
TinyMCE Advancedを使用しない場合は下記のをキストエディタで記入してください。
————————————————-
ページ内リンクの設置方法は<a href="#aaa">こちら</a>
ーーーーーーーーーーーーーーーーーー
ーーーーーーーーーーーーーーーーーー
<a id="aaa"></a>ページ内リンクの設置方法
————————————————-