人生

AFFINGER5で目次はブログ初心者でも簡単に作れる!

 

 

”今”のあなた
目次を作った方が、記事が読まれやすいって聞いたんだけど、目次の作り方がわからないよー。
AFFINGER5(アフィンガー5)を使用しているなら簡単に目次が作れるようになるよ!!
絢太郎
”今”のあなた
ブログ初心者でも簡単??
うん!とっても簡単!!
絢太郎

 

意味のない前置きはしません!あなたの疑問だけを解決します!!

絢太郎
前置きするときはあるけどね☆

それでは、さっそくいってみよう!

 

アフィンガー5記事投稿画面の画像

絢太郎
まずは、実際に投稿する画面(記事を書くところ)にいってタグというボタンを探してみよう!そして、クリック!

 

アフィンガー5目次作成のための手順の画像

 

絢太郎
そして、その他パーツにマウスを合わせると目次カスタムが出てくるよ!これをクリック!!

 

アフィンガー目次作成のために必要な操作の画像

 

絢太郎
そしたらもう目次の完成!これから、目次の中の言葉を変えていくよ!
絢太郎
目次の中の言葉を変えるためには、赤まるで囲まれたテキストをクリックすることで変更できるようになるよ!また、今のページがビジュアルのページであることも覚えておこう!

 

アフィンガー5ビジュアルページの画像

 

”今”のあなた
ちょっと待ってくださいよぉぉ。意味わからない英語がいっぱいだよぉ。日本語すら難しいのに!!
絢太郎
でも、あんまり難しく考えずに私が教える通りにやってみよう!
絢太郎
まずは、青まるで囲まれた部分の ”目次” を ”とっても簡単!目次の作り方!“ とか自分が目次のタイトルにしたいものを入力するよ!

 

アフィンガー5目次のタイトルをつけるための操作の画像

 

絢太郎
ビジュアルのページに戻って確認してみると ”とっても簡単!目次の作り方!に変更されているね!つぎはメニューの部分を変更するよ!

 

アフィンガー5目次作成のために必要な操作の画像

 

絢太郎
ここでは、メニュー1、メニュー2、メニュー3の文字を変えるだけでいいよ!

 

アフィンガー5目次作成のメニュー変更された後の画像

絢太郎
またまた、ビジュアルのページに戻ってくるとメニューが変更されているね!さっそく、プレビューで読者の方にどう表示されているのかみてみよう!

アフィンガー5プレビュー画像

”今”のあなた
確かに目次はできたね!でも、僕がみる目次は四角の枠で囲まれているやつだよ

絢太郎
その悩み解決いたします。

アフィンガー5目次作成時の問題解決画像

 

絢太郎
目次を作る時と同じような手順でボックスを選択しましょう!そして、ボックスの中から今回はしかく(枠のみ)を選択してみるよ!

注意ポイント

ボックスで目次を囲みたい場合、目次全体を選択範囲にする必要がある!!

アフィンガー5目次作成時の問題の画像」」

絢太郎
すると、こういった風に目次を四角で囲めるんだよ!色を変えたい場合はボックスの色を変えてみてね!ボックスについてはまた後日紹介します!
”今”のあなた
でも、なんか謎の1という数字が刻まれているんだけど。。呪われているの?

アフィンガー5目次作成時の問題解決操作の画像

絢太郎
これは呪いではないよ。テキスト画面を見てみると目次の前の・があるのがわかるね。これを消せば1も消えるよ。

アフィンガー5目次作成時の問題解決プレビューの画像

絢太郎
・を消したらプレビューで確かめてみよう!ほらなくなってるでしょ!
”今”のあなた
でも、これボタン押しても書いてあるページに飛ばないよ?なんで?
絢太郎
それは、このあと説明するよ!

アフィンガー5目次作成時の設定操作の画像

絢太郎
赤まるで囲まれている部分を良くみてもらうとわかるけど、<a href="#">っていうのがあるよね?この部分を<a href="#menu1">

みたいに名前を付けてみて!日本語は使っちゃだめだよ!

 

アフィンガー5目次作成時の操作画像

 

絢太郎
全部訂正したのが、上の画面だよ。menu1、menu2、menu3のように名前を付けてね!
絢太郎
そしたら、次が最後の仕上げ!目次をクリックしたらそこまで飛べるようにしよう!

 

 

と飛びたい部分をビジュアルのページに作成してから、テキストのページを開きます!

 

アフィンガー5目次作成時の操作画像

絢太郎
そしたら、この文字とまったく同じ文字であなたのメニュータイトルを挟みこんでみて!この文字はメニュータイトルである目次は簡単!以外は半角でうってね!
絢太郎
なんとこれだけで飛びたいところに飛ぶことができるようになるよ!
絢太郎
あとは、手順を教えるよ!と副業仲間募集中!!の部分(menu2、menu3)でも同じことをするだけ!もちろんmenu1だった部分はmenu2に変えてね!
絢太郎
これで、あなたも目次が作れるようになりましたね!さっそく目次を使用して記事を書いてみよう!!

-人生

© 2020 金・時間・スキルなし。それでも、プログラミングを勉強したい。 Powered by AFFINGER5