ようやく追加されました、待ちに待ったBloggerでの「p」タグを用いた段落機能。ほとんどの方はなんのことやらさっぱりという感じだと思うのですが、Bloggerの愛用者の方やBloggerが最近気になっている！という方にぜひおすすめの機能ですので紹介させていただきます。
ちなみにテンプレートは「QooQ」を使わせていただいており、他のテンプレートでは異なる部分もあると思います。その点ご了承ください。
Bloggerに追加された「段落」機能
最近になって筆者愛用の「Blogger」に「段落」の欄が生じました。
これは今までに標準ではなかった「p」タグというのを利用できるようになったのです。
ちょっと難しめな話なんですが「p」タグというのは段落を定義するためのコードのことです。
↑ここまでの行を「p」タグつまり「段落」モードを使って書いています。
「段落でも標準でも見た目全く変わらないじゃん！」と思われたはずです。そうなんです。それでもHTMLコードには大きな違いが生じています。
最初の4行
次の4行
<div style="text-align: left;"><br /></div> <div style="text-align: left;">私も「標準」というモードでこれまで文章を書いており、行間を開けたいな…</div><div style="text-align: left;"><br /></div> <div style="text-align: left;">という時には改行、改行と連続して改行をしていたわけです。</div> <div style="text-align: left;"><br /></div> <div style="text-align: left;">するとHTMLコードがやたら長くなるのです。</div>
あれ？
ちなみに「標準」モードの「div」から始まるコードはグループ指定するもので「text-align: left」は左寄せというのを意味していて、最後にもう一度「div」で閉じています。
改行のコードは「br /」タグになります。この改行のためのbrコードを使うと記載が長くなることに繋がっていました。（これを回避する方法もほかにもあったようですが、デフォルトでこの仕様が続いていたようです）
pタグのCSSを追加
このようにpタグを使ってシンプルなHTML構造を作るのに少々細工をしています。
p {
margin: 1em 0px; /* 上下に1em・左右に0px */
}
このようなコードをCSSの追加にて挿入しています。ちなみにCSS追加もちょっとモデルチェンジしています。というか現れたり消えたりしていませんか？夢か幻で見えたのかな？
「QooQ」テーマではメニュー⇒テーマ⇒HTML編集から「個別アイテム」の二つ目のところに記載するとCSSを追加していることになるようです。
これによって段落モードで記述して「Enter」キー1回でしっかり1行分の余白ができるため、作成のスピードも若干上がります。
また、HTMLのルール的にも段落をpタグで記述するのは正しいコードの書き方のようで、WordPressなどでは必ずpタグでの記述に自動的になっていました。
むしろBloggerが長い間このような仕様にならなかったのが謎、という感じがします。
Bloggerの段落アップデートまとめ
あんまり日本で人気のないBloggerですので、頑張って宣伝してみなさんに良さを分かっていただきたいなと感じる日々です。そんな中での「段落」アップデートは個人的にはかなりうれしくて記事にしてしまいました。
CSS追加で作業効率もアップしますので是非使ってみてくださいね。個人的にも段落モードと標準モードもうまく使いこなしつつ今後もBloggerでの執筆をつづけてゆきたいと思います。
そもそもBloggerってなに？という方には次の記事をおすすめしております。
