リンクタグ生成ツール

ホームページやブログなどに貼れるリンクタグを生成するツールです。
URLと表示する文字を指定すると、リンク貼付用のHTMLタグを発行できます。

リンクのデザインなどの文字サイズや色を変更したり、予め用意されたテンプレートを適用することで、
ボタン風のデザインにすることもできます(※)。

※設置先のCSS設定によって正しく反映されない場合があります。

リンクタグ設定

  • 基本設定(必須)

    リンク先URLを設定してください
    表示する文字を設定してください

  • 文字装飾設定 ?
    リンク文字のサイズや色などの設定を変更する事ができます。

    px
    ボタンデザイン選択で【テンプレートなし】を選択した場合は、設定が反映されません。
  • ボタンデザイン選択 ?
    リンクにボタンデザインを適用することができます。
    用意されたテンプレートの中からお好みのものを選択してください。

    テンプレート見本
    ボタンデザインは、設置先サイトのCSS設定によっては反映されない場合があります。
    プレビューの表示が完全に再現されないこともありますので、ご了承ください。
  • 文字揃えの設定 ?
    リンク先に対して、検索エンジンの挙動を制御するタグを設定します。

    ・nofollow…リンク先に対して、ページの評価を渡さない場合に設定します。
    ・noopener…別ウィンドウで開く場合に設定する、target=_blankのセキュリティ上の脆弱性を補うために設定する項目です。
    別ウィンドウで開く際に設定することを推奨します。
    ・noreferrer…リンク先に遷移する際に、参照元のリンク情報を渡さないようにする設定です。

プレビュー

HTML+CSS

HTML

CSS

利用上の注意

このツールはJavaScriptで作成されているため、JavaScriptが動作しない環境では使用できませんので
ご了承ください。

プレビューにて各種設定の表示を確認することができます。
ご希望の表示になったら、HTML及びCSSにコードを出力し、ご自身のサイトやブログにてご使用ください。

HTMLファイルとCSSファイルを分割している場合はそれぞれのコードで出力することができますが、
HTMLファイルに一括している場合は【全てHTMLで出力】で、
全てのコードをまとめて出力する事ができます。

各項目で設定された内容は、ご利用のサイトやブログの環境によって反映されない場合があります。
その場合は、ご利用サイトまたはブログの設定をご確認ください。

「プレビューへのリアルタイム反映を無効にする」にチェックを入れると、
【プレビュー更新】を押すまではプレビューに反映されないので、
ブラウザでの表示負荷が少し軽くなります。