AFFINGERの使い方

AFFINGER(アフィンガー)ステップの作り方とカスタマイズ方法を解説

2021年1月30日

ステップの作り方を解説
悩んでいる人
ステップ1、ステップ2みたいな感じで記事を書きたいです!やり方を教えてください!

 

このようなお悩みについてお答えします。

 

ブログ記事を書いている時に、下記のようなステップを使って物事を説明したい時ってありますよね。

 

ステップ①:〜〜〜〜

ステップ②:〜〜〜〜

ステップ③:〜〜〜〜

 

上記のように手づくりで作成しても全然問題ありませんが、見栄えがよくないのでもうちょっとカッコよく作りたいですよね。

 

そんな時に便利な機能がAFFINGERの「ステップ機能」です。

 

アフィンガーではステップの作成がとてもカンタンにできますので、使いこなしてカッコ良く読みやすい記事に仕上げてみましょう。

 

本記事の内容

  1. ステップの作り方
  2. ステップのデザイン変更方法

 

この記事を書いた人

  • イスさん。ブログ1年目。記事執筆数170本以上
  • ブログ副業収益8.9万円
  • ブロガー・Webライターとして活動中
  • 詳しいプロフィールはこちら / Twitter:@istblog1

 

それでは使い方を説明します。

 

AFFINGER(アフィンガー)ステップの見本

アフィンガーステップの使い方

 

まず初めにアフィンガーでステップを作ってみましたのでご覧ください。

 

step
1
タグを選択

・まずはタグを選択しましょう。

step
2
テキストパーツを選択

・次にテキストパーツを選択します。

step
3
ステップを選択

・ステップを選択してください。

step
4
数字を変更

・タグ内の数字を変更したら完成です!

 

上記のステップは以下のように書いています。

 

ステップの作り方

 

難しそうに見えますがとってもカンタンですので安心してください。次の章で作成方法をお伝えします。

 

AFFINGER(アフィンガー)のステップの使い方手順

ステップの作り方

 

上記の画像の通り、ワードプレスの投稿画面から「タグ」→「テキストパーツ」→「ステップ」の順番に進んで作成します。

 

①:タグを選択

②:テキストパーツを選択

③:ステップを選択

 

この3つの手順で、ステップの基礎が作成できます。

 

ステップ説明

 

①:ステップの数字を入力

②:「タグを選択部分」がステップのタイトルになります

③:説明したい内容を記載

 

基本的には、上記の書き方でステップの内容を編集すると見やすくなるのでオススメです。

 

ステップの基本変更箇所

 

基本的な変更箇所は、数字の部分だけです。

 

タグ内にある数値を変更すると5ステップや10ステップなど、任意のステップまで作成が可能です。

 

ステップの数字の説明

 

作成したい記事の内容によって増やしたり、減らしたりして使い分けてくださいね。

 

ステップのデザイン変更方法

 

ステップのデザインは、アフィンガーのカスタマイズからカンタンに変更可能です。

 

「外観」→「カスタマイズ」の順番に進んでください。

 

カスタマイズ手順

 

カスタマイズの画面で「オプションカラー」→「ステップ/ポイント」に進みましょう。

 

オプションカラー→ステップ/ポイント

 

すると下記画像の画面が出てくるので好きな色、デザインに変更してください。

 

ステップのデザイン変更説明

 

「角を丸くする」のチェックを外すとステップの角を角ばらせたデザインに変更もできますよ。

 

丸いデザイン

チェックを入れた場合

 

チェックを外したデザイン

チェックを外した場合

 

まとめ:ステップをつかって読みやすい記事を作ろう!

ステップを使ってみやすい記事に

 

AFFINGER(アフィンガー)のステップの作り方について解説しました。

 

ユーザーにとって読みやすい記事は、Googleからの評価も高くなり良質な記事と判断されますので、アフィンガーで使える機能を上手に使って記事を作成しましょう!

 

順序を説明する場合、ステップ機能はとても簡単にわかりやすく作成できますので場面によって利用するとグッドです。

 

ちょっとした心遣いが、あなたのブログの価値を高めてくれる要素にもなります。

 

今回、使い方の解説をしました「ステップ」は、当ブログで使用している「AFFINGER」というテーマにて作成しています。

 

AFFINGERの購入方法については、下記記事を参照し進めていただくと簡単に完了できます。

≫ AFFINGER6(アフィンガー6)購入方法とインストール手順を優しく解説

 

また当ブログよりAFFINGERをご購入いただくと、豪華10特典が付与されますので内容をチェックしてみてください。

≫ イスとブログ限定10特典つきACTION(AFFINGER6)の購入はこちら

 

おわります

    • この記事を書いた人

    イスさん

    ブログ1年目 | ゆるめのフリーランスブロガー | 月1万円稼ぐまでに必要な情報をわかりやすくまとめています

    -AFFINGERの使い方