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

2020年4月3日

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

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

 

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

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

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

 

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

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

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

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

 

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

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

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

 

プロフィールの設定位置

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

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

 

1.設置項目位置

まずは、下記を選択しましょう。

 

これができた後で、ウィジェットから「カスタムHTML」をまずウィジェット(サイドバー)に追加していきましょう。

 

2.「ウィジェット」 ⇒「カスタムHTML」を選択、まずウィジェット(サイドバー)に追加

 

カスタムHTMLを選択したら、それを下記のように、カスタムHTMLをドラッグ&ドロップで下の左位置追加をしていきます。

 

 

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

 

プロフィールの設定方法

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

 

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

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

 

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

 

 

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

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

どうせプロフィールを設定するのであれば、できれば画像も設定しておきたいものです。

 

しかし実際には、普通のプロフィール画像をそのまま画像表示しても、中心に表示されしまい、画像と文章が重なった状態で表示されてしまうため、

これでは、プロフィール文章と画像がみえにくくなってしまいます。

 

そこで、CSSで表示位置を設定することもできますが、下記のように設定することも可能です。

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

 

<プロフィール画像の設定に必要な3つのこと>

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

 

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

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

 

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

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

 

 

 

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

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

 

まとめ

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

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

 

 

【よく読まれている記事】

【2020年度版】ダイエット効果・ウィルス対策に効果絶大!おすすめチャーガ人気ランキング5選

【2020年版】現役SEが教える小学校低学年(1~3年生)向けおすすめプログラミング教室3選

 

 

 

【おすすめ:WordPressテーマ 「WING(AFFINGER5)」について
     ※ブログを始めるなら絶対おすすめ【特典あり】


私も新たなサイト【育チルnet」にて、検索エンジンの上位の多くを占めると言われるSEO対策に強いWordpressテーマを導入してみました。

無料テーマから有料テーマにしただけなのに、0円だった収益が2~3万円まで上がったんです!

正直驚きでした!実際に利用した所感は、デザイン性能がかなり整っていますし、表示速度もやっぱりかなり速いです。人気なWordpressテーマなだけはあると感じました。

無料のテーマでも私は悪いとは思っていませんが、やはり検索エンジンからの評価はだいぶ違いました。

初めて数ヶ月ですが、もうすでに検索エンジンから大きく表示されるようになっています。

どうせやるなら、しっかりgoogle社からの評価を受けられる整えられた環境でブログ運営する方が絶対にいいと感じたため、当サイトをご覧下さった皆様にもお伝えさせて頂きました!

Wordpressテーマを新たにご検討方は、今しかない期間限定の特典も付いていますので、お早めにご確認下さい。

レビュー

公式サイト



 ←ためになったら押してね^^