スポンサーリンク




WordPress

ページ内でジャンプ(ページ内リンク)させる方法

投稿日:

こんにちは。ゆかです。

 

長い記事とかLP(ランディングページ)にて、ページの途中にジャンプさせることができる方法です。

 

通常の投稿は目次昨日を使用すると目次で見たいところにジャンプしますが、これはLPとかで使用できることではないかと思います。

 

わたしも実際にLPページでジャンプさせたかったので、使っています。

その方法を忘れないために、備忘録として記事にしたいと思います。

 

ページ内ジャンプする手順

アンカーを作ります

アンカーというのは『杭』という意味があります。

文字通りページ内のジャンプ作成の目印ということです。

 

アンカーは英数字で作ります。

例えば、anchorー1、jump01

 

anchor作成の注意

先頭は、アルファベットにしましょう。

1ページに複数ジャンプを使用したいときは、同じアンカーは使ってはいけません。

 

リンクの設定をします

作ったアンカーを使って、リンクの設定をしていきます。

まず投稿をテキストモードにしてください。

 

ジャンプさせる出発点に下のタグを入力します。

<a href="#△△△">ここから移動する</a>

#△△△の△△△部分に先ほど決めたアンカーを入力します。

 

ジャンプの到着地点には下のタグを入力します。

<a id="△△△">ここへ移動</a>

 

この手順だけでページ内をジャンプするようになりました。

上から下だけでなく下から上へと戻ることも可能です。

 

使用例

<a id="#anchorーback">ここから</a>

 

<a href="#anchorー1">・着地地点へ飛びます。</a>

 

テスト

 

テスト

 

<a id="#anchorー1">着地地点</a>

 

<a href="#anchorーback">ここからに戻ります。</a>

こんな感じでテキストモードに入力します。

 

ここから

・着地地点へ飛びます。

テスト

テスト

着地地点

ここからに戻ります。

 

動きが小さいのでイマイチ分かりにくいかもしれません…(^^;

 

最後に

ぜひランディングページに使えますので、覚えておくと良いかと思います。

 

普段の投稿などは、もうすでに便利な目次のプラグイン【Table of Contents Plus】がありますので、ぜひこちらもご活用くださいね(^^)

【Table of Contents Plus】で記事の目次を作りましょう

 

【メルマガで詳しくアフィリエイトの情報発信中!!】

【メルマガで詳しくアフィリエイトの情報発信中!!】

ネットビジネスをやってみたいけど『子育ても家事も忙しくて…』という方に、ぜひとも読んでいただきたいです。

アフィリエイト情報をモリっと詰め込んでいます!!

【お気軽にお問い合わせください】

【お気軽にお問い合わせください】

わたしは、初心者さんへワードプレスのブログ作成方法を教えたり代行作成を行っています。

 

-WordPress
-, , , , , ,

Copyright© 初心者のパート主婦が副業収入を得た方法! , 2019 All Rights Reserved Powered by STINGER.