AFFINGER5

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

 

こんな悩みに答えます

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

・思うように作れない

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

 

この記事を書いた人

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

Twitter(@Blog624renoru)はこちら!

 

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

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

 

 

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

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

 

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

 

スポンサーリンク

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

 

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

 

作成手順

  1. プロフィールカード作成①:カード編
  2. プロフィールカード作成➁:アイコン編
  3. プロフィールカード作成➂:ウィジェット編

 

 

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

 

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

 

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

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

作業内容

・画像設定

・カラー設定

・コメント設定

 

画像設定

 

外観 > カスタマイズ > オプションカラー > サイト管理者紹介(プロフィールカード)をクリックしましょう。

 

外観 > カスタマイズ > オプションカラー >サイト管理者紹介(プロフィールカード)

 

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

 

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

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

 

設定すること

  • プロフィールカードにチェック
  • ヘッダーに画像を挿入
  • アバターに画像を挿入

 

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

 

カラー設定

 

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

 

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

 

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

 

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

 

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

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

 

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

 

コメント設定

 

ユーザー > あなたのプロフィールをクリックし、プロフィール情報にコメントを記入しましょう。

 

プロフィール欄にコメントする

 

スポンサーリンク

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

 

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

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

 

コピペした画面

 

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

 

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

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

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

 

 

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

 

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

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

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

・当ブログ運営者を設定

 

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

 

外観 > ウィジェットをクリックし、STINGERサイト管理者紹介 > サイドバートップ > ウィジェットを追加をクリックしましょう。

 

外観 > ウィジェット > STINGERサイト管理者紹介 > サイドバートップ > ウィジェット追加

 

お疲れさまです。

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

 

当ブログ運営者を設定

 

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

 

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

 

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

 

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

 

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

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

 

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

 

今回はここまで。

 

 

  • この記事を書いた人
  • 最新記事

れのる

初めまして。まったり系ブロガーれのるです このサイトでは ブログ&書籍レビューをメインで配信してます。 たまに人間味あふれる記事も書いてみたり! まあ僕のブログなんで好きなようにやってます(笑) 興味があれば覗いていってね!

-AFFINGER5

© 2021 renolog Powered by AFFINGER5