AFFINGER5 ブログ運営

【10分で完了】AFFINGER5(アフィンガー)でプロフィールカード作成方法

 

こんな悩みに答えます

・プロフィールカードの作り方がわからない

・思うように作れない

・かわいいプロフィールカードを作りたい!

 

この記事を書いた人

・ブログ歴4か月の大学生ブロガー。初心者ブロガーの役に立つ情報を発信中!

Twitter(@Blog624renoru)はこちら!

 

この記事を読めば、AFFINGER5(アフィンガー)でプロフィールカード作成方法がわかります。

10分あれば、サクッとプロフィールカードを作れますよ!

 

 

プロフィールカードの完成例

 

あなたが求めるプロフィールカードだと思った方は、この記事を見てカスタマイズしていきましょう。

 

スポンサーリンク

プロフィールカード作成手順

 

このプロフィールカードを作成するために、3つの手順に分けて説明していきます。

手順

・プロフィールカード作成①:カード編

・プロフィールカード作成➁:アイコン編

・プロフィールカード作成➂:ウィジェット編

 

 

 

画像の番号は、説明する順番を表しています。

 

 

プロフィールカード作成①:カード編

 

まずはカード本体を設定していきましょう。

カード設定はやることが3つ。

手順

・画像設定

・カラー設定

・コメント設定

 

画像設定

外観 > カスタマイズ > オプションカラーをクリックしましょう。

 

オプションカラーをクリックした後は下にスクロールしましょう。

下までスクロールすると、サイト管理者紹介(プロフィールカード)があるのでクリック。

 

ここから、プロフィールカードの設定をしていきます。

 

まずはプロフィールカードに変更にチェックしましょう。

クリックしたら、ヘッダー画像アバター画像に好きな画像を設定していきます。

 

上記のように設定したのをプレビューすると下の画像のようになります。

 

僕はシンプルにするために、ヘッダー画像は設定していません

 

カラー設定

次にカラー設定をしていきます。

画像設定した画面を下にスクロールすると、下のような画像があります。

 

ここでプロフィールカードのカラー設定をしていきます。

自分でカラーを当てはめてみて、好きなカラーを設定してください。

プレビューしながら確認して作業していくのがおすすめです。

カラーコードで迷っている方は、HTMLカラーコード:WEB色見本 原色大辞典で好きな色を探してみてくださいね。

 

コメント設定

ユーザー > あなたのプロフィールをクリックしましょう。

 

下までスクロールしたら、下の画像の通りにプロフィール情報にコメントを記入しましょう。

 

 

スポンサーリンク

プロフィールカード作成➁:アイコン編

続いて➁のアイコンを設定していきましょう。

先ほどのようにユーザー > あなたのプロフィールをクリックします。

 

このような画面があるので、あなたが表示したいアイコンのURLをコピペすると、プロフィールカードにアイコンが表示されます。

 

TwitterのURLの取得方法(PCの方向け)

ツイッターの画面を開き、右上の左から2番目Twitterのカスタマイズと制御をクリック。

そこに表示されるURLをコピーすると、URLを取得できます。

 

 

プロフィールカード作成➂:ウィジェット編

 

最後にサイドバーにプロフィールカードなどを設定していきます。

ウィジェットでやることは2つです。

・プロフィールカード設定

・当ブログ運営者を設定

 

プロフィールカードの設定

外観 > ウィジェットをクリックしましょう。

 

次にSTINGERサイト管理者紹介 > サイドバートップ > ウィジェットを追加をクリックします。

これでプロフィールカードの設定は終了です。

 

当ブログ運営者を設定

こちらもプロフィールカード設定とほぼ同じなので、簡単です。

 

カテゴリー > サイドバートップ > ウィジェットを追加で追加します。

 

 

タイトルに当ブログの運営者と記入してください。

 

最後に順番を並べ替えます。

テキスト:当ブログの運営者STINGERサイト管理者紹介の上において完了です。

 

ここまでの流れを行うと、はじめの完成例のように表示できます。

 

今回はここまで。

 

 

-AFFINGER5, ブログ運営

© 2020 renolog Powered by AFFINGER5