【WordPress】初心者でもサイドバーにプロフィール&画像を簡単に表示する方法

 

 

 

 

 

 

 

 

今回は ブログのサイドバーに自己紹介文(プロフィール)を表示する方法 を紹介します。
イメージは当ブログのような画像とプロフィールが一緒に表示されているものです。

 

←←こんな感じ

ブログ記事を書いたのは誰でどんな人物なのかがわかれば

より親近感も湧きますよね

本名や本人の顔画像なんかでも構いません。

初心者向けなので簡単にサイドバーに設置できるように説明します!

 

プロフィール画像を選択&トリミング

まずはプロフィール画像を用意しましょう。自身の顔写真やフリー画像でOK。

パソコンのフォルダに保存したらワードプレスの管理画面(ダッシュボード)から

「メディア」→「新規追加」を選択。

 

 

 

 

 

 

 

画像をアップロードする画面にいくので「ファイルを選択」からパソコンに保存してあるプロフィール画像を選択。

 

 

 

 

 

 

 

画像読み込み後アップロードが完了したら「編集」を選択。

 

 

 

 

 

 

 

すると全体画像と右側に「ファイルのURL」が表示されるのでメモ帳などにコピーしておきましょう。

ちなみに左下の「画像を編集」を選択すると画像縮尺の変更画像のトリミングが可能です。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

画像が決定したらいよいよワードプレス上に設定していきます。

 

プロフィール画像の設定

 

ワードプレスの管理画面から「外観」「ウィジェット」を選択。

 

 

 

 

 

 

 

使用しているテーマの中で使用できるウィジェットが表示されるので「テキスト」を選択。

すると、プロフィールをどこに使用するか選択するウィジェットが選択できるので

サイドバーをクリックしてください。(普段テーマのサイドバーに設定しているものを選択)

最後に「ウィジェットを追加」を選択。」

 

 

 

 

 

プロフィール画像の挿入

 

 

 

 

 

 

 

↑の画面が開いたら「タイトル」はプロフィールや自己紹介などがいいでしょう。

そうしたら「テキスト」をクリックして画像の挿入を行います。

本文に以下のコードをコピー&ペーストしてください。

<center>
<img src=”画像のURL
width=”200″ height=”200″ class=”profile”>
</center>

 

 

 

 

 

 

 

ここまでできたら「画像のURL」部分に先ほどコピーした画像「ファイルURL」を貼り付け。

 

 

 

 

 

 

 

こんな感じにできましたでしょうか?

画像のサイズは高さ(height)、幅(width)の

数値を変更すると大きさを変更できます。

当ブログは 「height」が100「width」も100に設定しています。

 

次に「ビジュアル」に戻して画像の表示確認をしましょう。正しく表示されていればひとまず「保存」しましょう。

 

 

 

 

 

 

 

本文の入力

画像を挿入したら自己紹介文を入力する前に自分の名前を入力しましょう。

画像の挿入と同じように以下のコードをいれてください。

<center><strong>自分の名前</strong></center>

 

 

 

 

 

 

「自分の名前」に入れたい名前を入れてその下に本文を入力します。

 

 

 

 

 

 

 

こんな感じにできたら再度「ビジュアル」で確認し問題なければ「保存」

保存できたら試しに別ウィンドウでブログトップページを開き反映されていたら完了です。

 

 

 

 

 

 

 

まとめ&あとがき

いかがでしたか?以上がサイドバーに自己紹介画像&本文を表示させる方法です。

この方法はプラグインを使わずWordPress(ワードプレス)の既存機能で自己紹介ができるので

初心者でも30分ほどあればすぐできる手っ取り早い方法になります。

このブログでは初心者~中級者向けになるべく画像を使い分かりやすく記事を作っていきますので

良ければお友達に教えてあげてください!
あ、ツイッターのフォローしていただけるとうれしいです~→https://twitter.com/KURONEKOKUN0214

 

WordPress

Posted by クロネコクン