目次は追加したい場所に[:contents]と打ち込むだけで可能です。しかし、目次に乗るのは見出しなので、見出しの作り方が重要になります。
この記事を書いた理由
今までの記事
ブログを始めてみたくて数記事書いてみたんですが、スマホアプリのはてなブログの使い方が、いまいち分からなかったために、文章だけの記事になってしまっています。
今後の記事
今後の記事では、見出しと目次を表示することで、視認性の向上を図りたいと思っています。
見出しの作り方
htmlの反映方法
HTML 表記した文章をコピーした状態で、HTML 貼り付けを選択すれば反映されました。
具体的には
<h1>見出し</h1>
のような文章をコピーして、html貼り付けを選択します。
見出しタグの意味
<h2></h2> のような<>で囲まれたものをタグと言います。見出しタグにはh1h2h3h4という種類があります。これは単に数字が小さい方がでかい見出しであるというふうに理解して大丈夫です。
タグの辞書登録
なぜ辞書登録をするのか
タグは/や<等の記述が必要となるために、いちいち打ち込むのが面倒です。なので、iPhone の機能にある辞書登録を使ってスムーズに行うことを目標とします。
辞書登録のやり方
iPhoneの設定→一般→キーボード→辞書登録の順に進み、単語に<h1></h1> を、読みにh1を登録することで、h1 と入力するだけで<h1></h1> を打ち込むことを可能にします。
見出しの見た目を変える
アプリでのcssの適用
見出しとうの文字の見た目を変えるには、CSSを適用する必要があります。しかし、cssの適用方法はアプリ版だとわかりませんでした。
設定→詳細設定のhead内に、<style>を記述することで見た目が変わることは確認できたのですが、ブログに直接<style>タグを打ち込んでも反映されませんでした。
WEB版でのCSS適用
そこで、WEB版のはてなブログにアクセスし、そこのhtml編集に<style>タグを打ち込むことでCSSの適用が行われることを確認しました。
WEB版のはてなブログはスマホで編集することが想定されておらず、文字の小ささとかが不便なので、基本的にはアプリ版でブログを書き、cssだったり、JavaScriptだったりの適用はWEB版を使うのが良いかもしれないです。
まとめ
見出しはhtml貼り付けで適用可能。
CssはWEB版を開いて適用しよう。
