【blogger設定】QooQのテンプレートでリンクに下線をつける方法

bloggerのテンプレート「QooQ」を使用しています

とても使いやすく愛用していますが、１つ気になることがありました

それがリンクに下線が付かないことです

記事の編集画面では下線が付いて青く文字が変わりますが、記事をアップした後はなくなってしまいます

標準機能では下線が付いていないため、リンクと気づかれずにスルーされてしまう可能性が高いので、わかりやすいようにリンクをつけたいと思います

リンク

設定方法はこちらのサイトを参考にしました

→参考サイト

CSSにコードをコピーするだけです

設定する前にバックアップを取っておきましょう

次にCSSを編集しますが、bloggerが昨年くらいに更新してから場所が分かりづらくなりました

編集する場所はこちらです

ここに以下のコードを張り付けます

/*リンクに下線あり*/

a:link {

text-decoration: underline;

}

/*記事タイトルの下線なし*/

h3 a:link{

text-decoration: none;

}

/*ブログタイトルの下線なし（トップページ）*/

h1 a:link{

text-decoration: none;

}

/*ブログタイトルの下線なし(個別記事）*/

#header-title a:link{

text-decoration: none;

}

/*ラベルの下線なし（トップページ）*/

.list-item-category  a:link{

text-decoration: none;

}

/*ラベルの下線なし(個別記事）*/

#single-header-category a:link{

text-decoration: none;

}

/*ナビゲーションバーの下線なし*/

#navigation a:link{

text-decoration: none;

}

/*サイドバーのリンク下線なし*/

#sub-content a:link{

text-decoration: none;

/*ヘッダーSNSボタンの下線なし*/

#single-header .single-share a:link{

text-decoration: none;

}

/*フッターSNSボタンの下線なし*/

#single-footer .single-share a:link{

text-decoration: none;

}

これでOKです

リンクされた部分に下線が作成できました

今回はリンクに下線をつける方法を紹介しました

下線があると分かりやすいですね

今後もブログをより良くしていきたいです