こんにちは、産後腰痛になった2児の母、うさです。
普段はInstagramに育児漫画を投稿しています。
まとめ用にブログを立ち上げるにあたり、はてなブログのカスタムを行いました。たくさんのブログを参考にさせていただきましたが、備忘録のため・同じ悩みを解決したい方のため自身でも記事にすることにしました。
はてなブログ記事中の下線はなに？
さて、はてなブログを始めた方で、自身の記事の中に下線リンクが入ってしまい困っているという方、いらっしゃると思います。
こちらははてなブログのサービスのひとつでキーワードリンク（タグ）と言います。名前の通り言葉の意味を知ったり関連ブログが検索できたりするんですが、正直いらない…。強調したいところでもないのに目が行きます。記事を読んでいても誤ってリンク先に飛んでしまうなんてことも。
2023年7月に仕様が変更されていた！
一度設定してそのままだったので気づいていませんでしたが、「キーワードリンク」という名称から「はてなブログ タグ」に変更になったようです。
理由はSNS等で「ハッシュタグ」が日常的に使われており、わかりやすくする為なんだとか。個人的には今までの名前の方が分かりやすいですが、いかがでしょうか…？
さらにこの変更で、有料版のはてなproだけで使えていた「記事にキーワードリンクを付与しない」という項目がなくなっており、無料版でも使える「はてなブログ タグのリンク」という項目になりました。
「記事にキーワードリンクを付与しない」項目がない！
上記のように2023年7月31日時点で「キーワードリンク」から「タグ」に変更されました。古い記事を参考にしていると、説明されている内容にある「キーワードリンク」や「記事にキーワードリンクを付与しない」のチェックボックスも無くなっています。
後述する新しい方法では有料版・無料版とも共通して使えますので、お試しください。
【2023.11最新版】はてなブログ記事中の下線を消す方法！
有料版・無料版とも操作方法は同じです。
①ダッシュボードの設定→②詳細設定→「記事本文にはてなブログ タグのリンクを付与しない」にチェック→④ページ下部の「変更する」を忘れずクリック
できたでしょうか。
こちらのボタンひとつで簡単に解決！...と言いたいのですが、実はこれ、設定前に書いた記事には適応されません。有料版の方もです。初めての投稿前に設定を済ませない限り、付きまとってくる問題なのです。（どうせならこれもアップデートして欲しかった…笑）
しかし安心してください！以下のコードをコピペすれば、今までの記事を書き直すことなく解決できます！
【既存の記事にも対応】ワードリンク（タグ）を消すコードを紹介！
責任は負えませんのでコードを触る際は必ずバックアップをお取りください。
CSSで消している方も多いようですが、カーソルを合わせると表示が変わってしまったり隠しリンクのようになって問題があるということで、JavaScriptで消すコードをお借りしました。
- <!--記事内ワードリンク消去-->
- <script type="text/javascript">// <![CDATA[
- addEventListener("DOMContentLoaded",function(){var a=document.getElementsByClassName("entry-content");if(a)for(var i=0;i<a.length;i++)for(var b=a[i].getElementsByClassName("keyword");b.length;)b[0].outerHTML=b[0].textContent},!1);
- // ]]></script>
こちらのコードをダッシュボードから①デザイン→②カスタマイズ（スパナマーク）→③ヘッダと進み、「ブログタイトル下」に貼り付けます。忘れず「変更を保存する」を押してご自身のブログをご確認ください。
キーワードリンク（タグ）が消えてすっきりしていますね。
ただ、キーワードリンク（タグ）を辿ってブログに訪問して貰える機会がなくなりますので、そこについては理解した上でご利用ください。
今後も実際に使ったHTML・CSSコードを紹介していきます。参考になれば幸いです。
参考ブログ
参考にしたブログはこちらです。
holic.hateblo.jp
本記事にはフリー素材「ぱくたそ」 からダウンロードした画像を使用しています。
