アメブロの記事内に見出しをつける | デジタルレモンのブログ

デジタルレモンのブログ

使えるウェブツールやサイト、スマホアプリのご紹介。
ガジェット・PC機器やPCDJ
ホームページ作成法・ブログカスタマイズ等

はい、タイトルのとおり、

アメブロ記事内に見出しをつけて

読む人が読みやすくしたいと思ったのでやってみました。

とりあえずどういうものかというと

こういうものです



↑これこれ


これはググるとたくさん出てくるのでやり方書いても需要ないかと思いますが

一応掲載します^^


素晴らしくわかりやすくまとめてらっしゃる方の記事がこちら


優しいブログの作り方
http://ameblo.jp/amecafe2011/entry-11172060531.html

TCD「すごいアメブロテンプレート」実践中です@ふえる
http://ameblo.jp/fuerukintaro/entry-1119


上の2つはブログの編集画面でCSSを指定して見出しをつける

という感じですが


いまは新デザインでCSS編集用デザインを使われてる方のほうが多いと思うので

CSS編集画面にこの見出しのスタイルを記述しておいて

ブログ編集画面では短いhtml文章を書くだけ


という設定の仕方の、こちらを参考にすると楽チンかもです

ブログデザイン道
http://ameblo.jp/ame-design/entry-11019008945.html



どちらもユーザー辞書などで短い言葉で変換するとでてくるようにすれば

変わりはないので、やりやすいほうでいいとは思いますが。


自分も3つくらい使い分けて、次から人が見やすいブログを書いていけるようにしようと思います。

過去のブログなども、需要があれば、見出し付け直して、ついでに内容等も細かく書き直しますので、コメントください(`・ω・´)


以下、自分の場合の見出しの設定手順です。

設定する見出しはこちら



↓↓やりかた↓↓

「マイページ」→「ブログを書く」→「デザインの編集」→「cssの編集」の部分に

以下CSSを貼り付ける。

.midashi {
border-left: 8px solid #ffcc00;
border-bottom: 1px solid #ffcc00;
padding: 0 0 4px 5px;
}



記事を書くときにタグ編集エディタを選択

見出しをつけたい文章を、以下htmlで囲む

<h2 class="midashi">ここに文章</h2>



これだけです

これで<h2 class="midashi"></h2>をユーザー辞書で

「みだし」と書いて変換で出るようにしたりすると、早く書くことができますね^^