ブログを書く前の設定

Luxeritasのブログカードを少しアレンジしてみた

WordPress,Luxeritas,ブログ運営

PV(回遊率)を上げるためにLuxeritasのブログカードを少しアレンジしてみました。


ブログカードとは

ブログカードとは文字通りカード状で表示するリンクのこと。

こんなやつです。

ブログカードとはこんなやつ

「関連記事」としてこのようなブログカードを記事の下に貼っておくとそのページを見てもらいやすくなるのでPV(回遊率)の上昇に期待が持てます。

 

今まではこんな感じで枠で囲ってその中にテキストでリンクを入れていたのですが、ブログカードを使うと画像が入るので華やかな感じになりますよね>ただ画像リンクよりテキストリンクのほうがクリック率は高いと言われています🤔

今までのリンク

 

もちろん今まで通りのブログカードでも良いのですが、いまいちリンクと分かりづらいかな?と思ったので記事を読むという文字を入れてみました。

Luxeritasのブログカードを少しアレンジしてみた

 

Luxeritasのブログカードの作り方は管理画面の[Luxeritas][カスタマイズ(外観)][ブログカード]でブログカードを有効にし、

Luxeritasのブログカードを有効にするには

貼りたい場所にカーソルを持っていきブログカードのアイコンをクリックするだけ(私はクラシックエディタを使っています)。

ブログカードの貼り付け方

 

ブログカードのアレンジ方法

LuxeritasのCSS設定画面

Luxeritasのブログカードアレンジするには[Luxeritas]>[子テーマの編集]を開くとスタイルシートタブ( style.css)があるので以下の文字を追記します。

/* Blog Card */
a.blogcard-href::before {
content: “記事を読む";
position: absolute;
color: white;
font-size: 12px;
background: #268e67;
width: 90px;
height: 20px;
text-align: center;
bottom: 0;
right: 0;
border-radius:8px 0 0px 0;
}

コードは綾糸.netさんのこのページを参考にさせていただきました。

ルクセリタスのブログカードをデザインカスタマイズ

綾糸.netさんと違うのはcontent:の文字を “記事を読む"に変更したことと、記事を読むの背景の色を緑色(#268e67)にし、背景の枠の曲がり(border-radiusの片側)を8pxからまっすぐの0pxに変更したことくらい。

 

もう少し色々やってみると面白そうですがとりあえずは完了。

 

このようにブログカードを並べてみてもいい感じ😊

Luxeritasのブログカードを並べてみた

はじめは[関連リンク]という文字だったのですが、それだと少しうざい感じがしたので変えました。

[記事を読む]なら内部リンクにも外部リンクにも使えますよね👍

Luxeritasのブログカードを並べてみると

ということで、テキストリンクだったところも少しずつ直していこうと思いますp(^^)q

 

このブログカード(の形式)は、Luxeritas独自のものらしく、テーマを変更するとただのテキストリンクに戻ってしまうそうなのですが、Luxeritasには満足しているのでその心配は今のところないです。

 

少しでもページの回遊率(PV)が上がってくれると良いけど((o(´∀`)o))ワクワク。

 

ということで、画像ではなく本物のブログカードを最後に貼っておきます。

QR Code | Tsuneの日々雑感

2022年1月4日パソコン/インターネット

Posted by Tsune