Luxeritasでサイドバーにプロフィールと画像を設置してみよう!

2019年8月22日

Luxeritas(ルクセリタス)のサイドバーにプロフィールを設定したい。サイト内に自分のプロフィールがあることで、自分のことを知ってもらうためにも大切なこと。この項目があることで相手に好印象を与え、アクセス数増につなげるきっかけづくりになります。

そこで、Luxeritasのプロフィールの設定方法を解説していきましょう。

 

プロフィールの設定の目的とは

そもそもグローバルナビに設定しているプロフィールをどうしてサイドバーに表示する必要性があるのでしょうか?

プロフィールをサイドバーに表示する目的には、下記のようなメリットがあります。

 

<プロフィールの設置の目的とは>

・常にサイトの見える箇所に配置することで、どんな人が記載しているか印象を与える

・趣味や年齢等でつながることも

・写真や画像の掲載で誘導率への影響が出る

 

プロフィールを見やすい位置に掲載することで、人とのつながりが増え、リピーターが多くなることがあります。また写真や画像を掲載することで、誘導率が変化することもあります。

じゃあ、「自画像がいいのか」「サイトのイメージキャラクター」のどちらがいいのかというと、これは、一概にもはっきしたことは言えません。

自画像で誘導率が上がるケースがあるようですが、自画像⇒自画像を変えても誘導率が落ちるケースもあるため、この辺は試しながら、設定していく必要性があるようですね。

 

プロフィールの設定位置

それでは、プロフィールの設定位置について解説していきましょう。

設定項目位置:Luxeritas「」 ⇒ 「外観」 ⇒ 「ウィジェット」

まずは,上記を選択しましょう。

 

これができた後で、ウィジェットから「カスタムHTML」をまずウィジェット(サイドバー)に追加していきましょう。カスタムHTMLを選択したら、それを下記のように、カスタムHTMLをドラッグ&ドロップで下の左位置追加をしていきます。

このウィジェットの項目に移すことで、実際の画面に表示されるようになります。

プロフィールの設定方法

それでは続いて、プロフィールの設定を作っていきましょう。

■カスタムHTMLをウィジェットに追加

まずは、カスタムHTMLをウィジェットに追加してから、プロフィールのタイトルと内容部分に、プログラムを記述していきましょう。

プログラムの記述は、下記の内容をコピーして見様見真似でまずは作ってみるよ良いでしょう。

 

 

プロフィール画像のサイズ調整の仕方

続いて、プロフィール画像の設定の仕方について解説していきましょう。

どうせプロフィールを設定するのであれば、できれば画像も設定しておきたいものです。しかし実際には、普通のプロフィール画像をそのまま画像表示しても、中心に表示されしまい、画像と文章が重なった状態で表示されてしまうため、

これでは、プロフィール文章と画像がみえにくくなってしまいます。そこで、CSSで表示位置を設定することもできますが、下記のように設定することも可能です。

<プロフィール画像の設定の仕方>

  1. 画像をペイントで上部半分ほどの位置に配置
  2. 画像ピクセル:250×311(ほどに調整)
  3. この画像をサーバーにアップロードする

このようにして、ペイントで上部半分ぐらいにサイズ調整していきます。

そして、なるべく小さ目のサイズで調整後、この画像を自分が借りているレンタルサーバーに直接アップロードしていきます。

サーバーのアップロード先は、下記になります。

格納先:wp-contents/uploads/ファイル名

こちらに格納しましょう。

またこの画像の「格納先」と「カスタム HTML」の設定位置を同じになるように設定してあげることで、画像が表示されます。

 

まとめ

このように、プロフィールの画像をサイドバーに表示すると、うまく表示できないことがあります。それには、画像そのものを調整してしまう方法とCSSで調整する2つの方法があります。

自分のわかりやすいやり方で、サイドバーにプロフィール画像を設定して、多くのユーザーに届けることができるサイト設計を行っていきましょう。