ブログ講座

アフィンガー6でプロフィールカードを設置する方法|初心者向けに解説

マルくん

よくブログで見る「プロフィールカード」を作りたい

アフィンガー6での設定の仕方がわからない

という悩みを解決する記事を書きました。

この記事では、「アフィンガー6」「プラグインなし」でプロフィールカードを設定する方法を紹介します。

プロフィールカードとは、これのことです▼

左寄せされたプロフィール文

プロフィールカードの設置は簡単にできるので、サクッと設定していきましょう。

【アフィンガー6】プロフィールカードの設置(準備編)

プロフィールカードを準備する前に、「アイコン」を準備する必要があります。(もうアイコン持ってる方は飛ばしてくださいね)

マルくん

せっかくだからおしゃれなアイコンにしたい…

ブログ開設をきっかけに、アイコンを作成する人も多いです。

おしゃれなアイコンを作ってほしい方は「ココナラ 」や「SKIMA」でお願いするのがおすすめ。

たくさんの絵描きさんがいるので、自分の気に入ったアイコン絵師さんが見つかりますよ♪

「とりあえず無料でアイコンを作りたいんだけど…」という方は、以下のサイトでアイコンを作ったり、画像を使ったりすることもできますよ▼

無料のアイコン

マルくん

よし、アイコンは準備できたぞ♪次は設定だ!

【アフィンガー6】プロフィールカードの設置(設定編)

それでは、プロフィールカードの設置をしていきましょう。

プロフィールカードの設置は次の3つの手順で完了です。

プロフィール設置手順

  1. アイコンの設定
  2. プロフィール情報の設定
  3. サイドバーへの設置

アイコンの設定

まずはここの部分の設定をします▼

アイコン部分の設定

アイコンの設定は全部で3ステップです。

step
1
プロフィール画像設定ページへ行く

「外観」→「カスタマイズ」の順にクリック▼

外観のカスタマイズ選択

オプション(その他)をクリック▼

オプション(その他)

プロフィールカードをクリック▼

プロフィールカード

step
2
アバター画像を選択する

アバター画像の「画像を選択」をクリック▼

アバター画像を選択

メディアライブラリからアイコンを選んで「画像を選択」をクリック▼

画像の選択

アイコンをメディアライブラリに入れてない方は、このときにドラッグ&ドロップで入れましょう。

step
3
公開ボタンをクリック

公開する

ちなみに、ここの画面でカードに影をつけたり、角丸にしたりする設定もできます。

まるげり

次は、プロフィール情報の設定をしていこう

プロフィール情報の設定

次にここの部分の設定をします▼

プロフィール部分の設定

プロフィール設定は2ステップです。

step
1

プロフィール情報へ

step
2
プロフィール情報の入力

入力する場所は3ヶ所です▼

プロフィール情報の入力
①ブログ上の表示名プロフィールカードに表示される名前を選択肢します
②サイト・SNS等その他のブログを持っていたり、SNSをしている方はURLを入力します
③プロフィール情報自己紹介文を入力します
マルくん

プロフィール情報(自己紹介文)って何を書けばいいの?

特にきまりはないんですが、次のようなことを書いている人が多いですね。

ポイント

  • 経歴
  • 今の職業
  • どんな発信をするか
  • 実績

まずはあまり悩まずに書いてみましょう!短くても全然OKです。

入力が終わったら「プロフィールを更新」をクリック▼

プロフィールを変更
マルくん

書けたらサイドバーに設置して確認しよう

サイドバーへの設置

最後に、作ったプロフィールカードをブログのトップページへ設置します。

step
1

外観→ウィジェット

step
2
STINGERプロフィールカードをドラッグ&ドロップ

以下のように、「STINGERプロフィールカード」を「サイドバートップ」へドラッグ&ドロップで移動します▼

サイドバートップへドラッグ&ドロップ

これで設置ができました。

自分のブログのトップページで確認してみましょう▼

中央揃いのプロフィールカード

これで設置完了です。

マルくん

プロフィールの文章がギュウギュウにつまってて読みにくいんだけど…

プロフィール文の「中央揃え」「改行なし」で気になる人は、以下の方法で修正していきましょう。

プロフィール文の「中央揃え」「改行なし」を整える方法

「AFFINGER管理」→「投稿・固定記事」の順にクリック▼

投稿・固定記事

この記事を書いた人の『プロフィール情報にhtmlタグを許可する』にチェック▼

プロフィールにhtmlタグを許可する

プロフィールで改行する方法

「ユーザー」→「プロフィール」の順にクリック▼

プロフィール情報へ

改行したい場所に〈br〉を入力しましょう▼

改行したい場所に<br>を入力

保存を忘れずに▼

プロフィールを変更

これで、プロフィール文の改行ができました▼

改行したプロフィール文

プロフィール文を左寄せする方法

「ユーザー」→「プロフィール」の順にクリック▼

プロフィール情報へ

プロフィール分の先頭に

<p style="text-align: left">

プロフィールの語尾に

</p>

を入力▼

ブロフィール文にテキストの追加

保存を忘れずに▼

プロフィールを変更

これでプロフィール文の左寄せができました▼

左寄せされたプロフィール文

まとめ:プロフィールカードを設置してファンを増やそう

プロフィールカードの設置方法を紹介してきました。

まだ設置していない方は、サクッと設置を終わらせておきましょう。

おしゃれなアイコンを作りたい方は、アイコン絵師さんに描いてもらうのがおすすめです。

ココナラ でアイコンを作る ≫SKIMAでアイコンを作る

おしゃれなプロフィールカードを設置して、あなたのブログのファンを増やしていきましょう♪

最低限のデザインを整えたい方は、「【アフィンガー6】WordPressのデザイン変更|初心者が最低限設定すること」の記事も確認してみてください▼

【アフィンガー6】WordPressのデザイン変更|初心者が最低限設定すること

この記事では、アフィンガー6を使っているブログ初心者向けに「最低限設定するべきWordPressのデザイン」について紹介しています。

続きを見る

その他のワードプレスの設定はお済みですか?

「ブログ完全講義」3時間目では、ブログの初期設定についてまとめています。全部終わっているか確認してみてくださいね▼

ブログ完全講義を見てみる

マルくん

じゃあまたね。バイバーイ!

おすすめ記事一覧

1

この記事では、エックスサーバーのWordPressクイックスタートを使って簡単にワードプレスを開設する方法を紹介しています。

2

という悩みを解決する記事を書きました。 WordPressでブログを始めようと思っている  or 始めたのはいいけど、初期設定で何をしたらいいのかわからないですよね。 私も、はじめてブログを立ち上げた ...

3

という悩みを解決する記事を書きました。 教員(公務員)がブログを始めるときに、切っても切れない関係にあるのが「原則副業禁止」というきまりです。 私は教員をしていた頃、「副業」に関わる法律のことをよく理 ...

4

ブログ初心者にとって「アフィンガー6」はおすすめ?この記事では、ブログ初心者のころからアフィンガーを使っている筆者が、アフィンガーのメリット・デメリット、口コミなどを紹介しています。

5

この記事では初心者にも使いやすいおすすめASPを5つ紹介しています。登録方法も詳しく知れます。

-ブログ講座
-,