こんにちは、4ミニ.net運営の北です!
ワードプレスを使ってサイトやブログの記事を作っている時、
「このリンクは<別窓=別ウインドウ=別タブ>で表示させたいな」と思うことがあります。
具体的にどういうことかといいますと、読者がリンクをクリックして画面を開いた時に、
クリックした元画面を残しつつ、その上に新しい画面(リンク先の別窓)を表示させたい。
目次
なぜ別窓(別ウインドウ)を使うのか?
今開いている窓で、そのままリンク先のページを表示するとどうなるのか? 読者がリンク先を訪れたまま、元ページに帰ってこない恐れがあります。
元ページに帰ってこない…。これは実際に多い模様です。私自身、もしも別窓ではないページにリンクした場合、
「←マークを押して元ページに戻るのは面倒くさいなあ」だとか、
「×マークを押し、ブラウザを閉じてしまったよ…。元ページに戻りたいけど面倒くさいなあ」
と思ってしまいます。
例えば問い合わせのあるページやランディングページなどに、どうしてもリンクを設置せざるをえない場合。
せっかく問い合わせページまで誘導できたのに、リンクページに移っていったまま「さようなら…」となってしまう可能性が非常に高くなります。
別窓の設置とは、『別窓の情報を確認してもらったら、サクッと窓を閉じてもらって元ページに再訪してもらう』。つまり読者の「戻れないので、さようなら…」を防ぐための防御策でもあるのです。
別窓の設置方法・その1
今開いているページはそのままに、リンク先ページを別窓で表示する方法はとっても簡単です。
ワードプレスの場合、
ページ作成画面にあるチェーンのアイコン「リンクの挿入/表示」を表示させます。
次にリンク先のURLとリンク文字列(表示させる文字)を入力し、「リンクを新しいタブで開く」にチェックを入れ、青い「リンク追加」ボタンを押します。
サイトやブログの中にある既存ページにリンクさせたい場合は、一覧(緑の囲み)から選択します。
「下書きとして保存」し、別窓で開くかをチェックしましょう。
別窓の設置方法・その2
リンク先を別窓にするためには、直接タグを埋め込む方法もあります。
例えば上記で作業した箇所を「ビジュアル」ではなく「テキスト」に切り替えて見てみましょう。
リンクタグの<a href=”~”>に注目してください(水色下線の箇所)。
このタグに
が追加記述されているのが分かります(赤下線の箇所)。
ワードプレス以外のサイトで別窓を設定する場合は、FTPサーバーなどでHTMLに上記のタグを直接埋め込んでみてください。
【埋め込み例】
追記するだけで簡単に別窓設定ができます。