「Blogger」リンクを新しいタブで開くように設定を変更したい【T】
 |
リンク挿入時のダイアログボックスから個別に設定する
「Blogger」の投稿エディタでテキストにリンクを設定する際、表示されるポップアップメニュー内のオプション機能を利用します。
リンク先のURLを入力する欄のすぐ下にある「リンクを新しいウィンドウで開く」というチェックボックスをオンにすることで、そのリンクにだけ特定の動作を指示することが可能です。
外部の参考サイトやアフィリエイト広告など、読者に後でじっくり見てほしい情報を紹介する場面で、この設定を使い分ければ、自分のブログ記事を最後まで読み切ってもらうための有効な手段となります。
以下の手順で、リンク作成時のオプション設定を試してみてください。
編集画面でリンクにしたい文字列を選択し、ツールバーのリンク挿入アイコンをクリックします。
表示された設定画面で、移動先のURLを正しく入力してください。
「リンクを新しいウィンドウで開く」の項目にチェックを入れ、適用ボタンを押して動作を確認します。
アドバイスとして、すべてのリンクを強制的に新タブで開くと、スマートフォンのブラウザがタブだらけになり読者が混乱することもあるため、外部サイトへの誘導時に絞って活用するのが親切です。
HTMLビューから属性を直接書き換えてリンクの動作を制御する
すでに作成済みのリンクや、特殊なボタンのデザインに対して新しいタブで開く設定を加えたい場合は、エディタを「HTMLビュー」に切り替えてコードを直接編集します。
リンクを示す「a」タグの中に target="_blank" という記述を書き加えることで、ブラウザに対して現在のページを維持したまま別ウィンドウを立ち上げるよう命令を下すことが可能です。
一見難しそうに思えますが、特定の文字列を検索して置換するだけで済むため、複数のリンクをまとめて修正したい場合や、複雑なレイアウトの中にリンクを埋め込んでいる際でも確実に対処できます。
個別にコードを編集する際は、以下の操作を行ってみてください。
編集画面の左上にあるモード切り替えメニューから「HTMLビュー」を選択します。
修正したい箇所の
href="..."の直後にtarget="_blank" rel="noopener"という記述を挿入してください。再び「作成ビュー」に戻ってリンクをクリックし、意図した通り新しいタブが開くか最終確認します。
注意点として、新しいタブで開くリンクにはセキュリティ上の理由から rel="noopener" をセットで記述しておくことが、悪意のあるサイトからの干渉を防ぐための標準的な作法となっています。
ブログ全体の外部リンクを一括で新しいタブに固定する
JavaScriptなどのスクリプトを「Blogger」のテーマに追加することで、記事内のすべての外部リンクを自動的に新しいタブで開くようにカスタマイズします。
一つひとつのリンクを手動で設定する手間が省けるだけでなく、過去に投稿した膨大な記事に対しても一瞬で設定が反映されるため、ブログの規模が大きくなればなるほど管理の効率が飛躍的に向上します。
自分のドメイン内の移動は同じタブで、外部サイトへの移動は別タブで、といった具合に条件を自動判別させることもできるため、読者にとって最も自然な操作感を提供することが可能です。
一括設定を導入するために、次のポイントを意識して調整してみましょう。
テーマの「HTMLを編集」画面を開き、フッター付近に制御用のスクリプトコードを追加します。
自分のブログ内のリンクまで別タブで開く設定になっていないか、プレビューで実際の挙動をチェックしてください。
保存する前に必ずテーマのバックアップを取り、万が一の表示崩れに備えて配慮します。
アドバイスとして、一括設定は非常に便利ですが、読者のブラウザ設定や広告ブロック機能によっては意図しない挙動をすることもあるため、重要なリンクは手動設定と併用するのが安心です。
