プチリタイヤ親父の暇つぶし

毎日仕事に行くわけではないので、空いた時間に散歩に行き行った場所に関した事を書く

はてなブログでCSS記入場所

CSSの記入場所を間違えていた。

今までは以下のようなCSSを本文の前に入力して見出しの背景色を変えたり、1行目だけ一文字下げたりしていたのですが、これは<body>タグの中に直接<style>タグを使ってCSSを打ち込んでいることになりHTMLの公文的にはあまりよろしくないということがわかりました。

<style>
p {
	padding-left:-1em;
	text-indent:1em
}

.h-red{
	background:linear-gradient(#FF0000,#FF00FF);
}
.h-yellow{
	background:linear-gradient(#FFFC12,#FFA012);
}
.h-blue{
	background:linear-gradient(#05fbff,#1e00ff);
}
.h-gray{
	background:linear-gradient(#000000,#999999);
	color:#ffffff;
}
</style>

このようなCSSの使い方はブラウザによっては表示がおかしくなることもあるという事で今までの記事の修正を行うことにしました。

CSSの入力場所を探してみました。

今までは記事の内容によって見出しの色を変えていたのでこれをやめるしかないかと思っていたのですが、何か方法がないかとはてなブログの使い方を調べてみたところありました。

設定画面を開いて詳細設定のheadに要素を追加でできるようでしたのでやってみました。

まず、「詳細設定」の「headに要素を追加」のボックスに今まで使っていたCSSの内容を記事からコピーして貼り付けてから下書き中の記事のCSS部分を削除してプレビューしてみましたが見出しの色が変わりませんでした。

ネットで情報を調べてもこのやり方でできるという情報しか出てこないので貼り付けたCSSを確認したところ指定していた色の変更部分がコピーされていないだけでした。

欠けていた部分を手入力してからもう一度プレビューしたところきちんと見出しの色が変わっていました。

過去の記事の中で今回のCSSを使っている記事を探して修正を行っていこうと思います。

ついでに誤字脱字などの見直しや1000文字になっていない記事は少し書きたせる場合は書き足すことにしました。

お問い合わせフォームを作り変えました。

はてなブログのヘルプで「問い合わせフォーム」はサイドバーに設置してどのページからでもアクセスできるようにしなければならないと言った内容の記載を見つけたのでやってみました。

最初はそのまま「問い合わせフォーム」をサイドバーに設置したのですがデカすぎてはみ出てしまいうまく表示できなかったので一旦削除しました。

調べてみると記事として問い合わせフォームだけのページを作りサイドバーにそのページへのリンクを作ると言う方法が見つかったのでやってみました。

やってみると意外に簡単にできたのですがこの「問い合わせフォーム」だけのページって大丈夫なのでしょうか、参考にした記事では作成日を過去日付にしておけば大丈夫とは書かれていましたし同じようなやり方を紹介した記事もいくつかあったのでよく使われるテクニックなのでしょうがちょっと心配です。