こんにちは!ブリコラブログ!です。
今回は、人気ブログテーマのひとつ『Affinger5(アフィンガー5)』でブログ記事を作成する上での、文字装飾や使用前の設定方法についてお伝えします!
最後までご覧いただくと・・・
- こんな装飾や・・・
- こんな表示方法が!
- こんなチェック形式や・・・
- あんなチェック方式が!
- 丸付きだけでなく、
- ボックスバージョンなども!
また、装飾とボックスの合わせ技として・・・
メモ
- 丸付きチェックや数字と、
- メモボックスとのコラボで表記!
といったことが可能になります!
是非最後までご覧ください!
Contents
❶丸付き数字の作成方法!
投稿記事作成画面の「ビジュアル」から作成した文字を入力。
次に、入力した文字を範囲指定した後、下記ボタンをクリックします。
以下↓↓ような表記になったのを確認してから、右上の「テキスト」タグをクリックして入力モードを切り替えます。
- こんな装飾や・・・
- こんな表示方法が!
入力文字を範囲指定してから、ナンバリング(番号付きリスト)をクリック!
すると、コードが以下のようになっているはずです。
コード確認後、ビジュアルのモードに戻すと以下のような表示になっています。
では、下書き保存をしてプレビューで見てみましょう!
はい、完成です!丸数字マスターおめでとうございます!!
❷丸チェックリストの作成方法!
投稿記事作成画面の「ビジュアル」から作成した文字を入力後、
範囲指定をしてから下記ボタンをクリックします。
以下↓↓ような表記になったのを確認してから、右上の「テキスト」タグをクリックして入力モードを切り替えます。
- こんなチェック形式や・・・
- あんなチェック方式が!
入力文字を範囲指定してから、チェックリスト(番号なしリスト)をクリック!
すると、コードが以下のようになっているはずです。
コード確認後、ビジュアルのモードに戻すと以下のような表示になっています。
では、下書き保存をしてプレビューで見てみましょう!
はい、完成です!丸チェックマスターおめでとうございます!!
❸チェックボックスの作成方法!
先ほどの、丸チェックリスト作成方法の途中まで同じ工程です。
- 投稿記事作成画面の「ビジュアル」から作成した文字を入力後、
- 範囲指定をしてから下記ボタンをクリックします。
- 右上の「テキスト」タグをクリックして入力モードを切り替え
入力文字を範囲指定してから、チェックリスト(番号なしリスト)をクリック!
すると、コードが以下のようになっているはずです。
コード確認後、ビジュアルのモードに戻すと以下のような表示になっています。
では、下書き保存をしてプレビューで見てみましょう!
はい、完成です!チェックボックス マスターおめでとうございます!!
❹応用編:装飾とボックスのコラボ表記 作成方法!
では、最後に応用編です。
ここでは、『丸付チェック』と『メモボックス』をコラボさせてみます!
❷の丸チェックリストの作成の途中まで同じ
文字入力~コード確認後のビジュアルモードに戻すところまで同じ手順で進めてください!
確認後、メモボックスにしたい部分をドラックして範囲指定。
右上の「タグ▼」→「ボックスデザイン」→「見出し付きフリーボックス」→「メモ」の順でカーソルを合わせて選択決定(クリック)してください。
すると、コードが以下のようになっているはずです。
コード確認後、ビジュアルのモードに戻すと以下のような表示になっています。
では、下書き保存をしてプレビューで見てみましょう!
はい、完成です!コラボ表記のマスターおめでとうございます!!
まとめ:エディタで記事の表現や雰囲気・幅の広がりを実現!
- 文字の羅列だと、読み手に負担がかかる。
- 記事に緩急が付く。また、ブログ全体構成や見え方にアクセントにもなる!
- Affinger5では、コードの選択+ボタンで簡単に装飾が可能!
いかがでしたでしょうか??
私もやり方を習得するまでは相当調べたり試してみたり・・・と結構時間がかかりました(笑) 記事をお読みいただいているみなさまにとって検索する手間の削減や、ブログの魅力化の一助になれたら嬉しく思います!
それでは、次回のブリコラ!もどうぞご期待ください!
最後までご覧いただき有難うございました!