- ブログでよく見るカードタイプのリンクが作りたい。
- ブログカードっってどう作るの？
こんな悩みを解決します。
これがブログカードです。
↓ ↓ ↓ ↓ ↓
ブログカードとは？
自分のブログ内を回遊してもらったりオススメ記事に誘導する内部リンクをカード型にしたもの。
WordPressブログカードの作り方
さっそく見ていきましょう。
作り方は２つあります。
- ブロックエディタで作る
- ブロックエディタでクラシック版の段落を呼びだして作る
※クラシック版の段落を呼びだして作る場合は、事前にプラグイン
「Advanced Editor Tools (旧名 TinyMCE Advanced) 」をインストール → 有効化しておきましょう。
★今回の作業以外にも、ブロックエディタに慣れない内はクラシック版の段落を呼びだして記事装飾ができるので便利ですよ★
① ブログカードの作り方【ブロックエディタ】
設定はかんたんです。下記のようにすすめて下さい。
※今回は当ブログのTwitterカードの設定方法という記事をブログカードにします。
【 記事URLをコピー 】→【 ＋をクリック 】→【 埋め込みを選択 】→【 コピーした記事URLを貼りつけ 】→【 埋め込み 】
１．記事URLをコピー
２．投稿編集画面の「 ＋ 」をクリック
３．埋め込みを選択 ( 下の方にあります )
４．①コピーした記事URLを貼り付け、②埋め込みをクリック
これで、下記のようなブログカードの完成です。
↓↓↓
② ブログカードの作り方【クラシック版段落】
ブログカードはブロックエディタでクラシック版の段落を呼びだして作ることもできます。
下記の手順で進めましょう。
【 ＋をクリック 】→【 クラシック版の段落を選択 】→【 カードをクリック 】→【 記事IDを入力 】
１．投稿編集画面の「 ＋ 」をクリック
２．クラシック版の段落を選択
３．カードをクリック
４．記事IDを入力
【 id="" 】の「 " 」と「 " 」のあいだに記事IDを入力
例： id="123"
※記事IDはワードプレス管理画面の投稿一覧で確認できます。
これで、ブロックエディタで作ったときと同じブログカードが完成します。
WordPressブログカードの作り方：抜粋の非表示設定
ブログカード抜粋の非表示設定
ここでは、ブログカードの抜粋を非表示にする方法を解説します。
抜粋はこの部分のことです。
↓↓↓
これはお好みですが、抜粋を消すとブログカードがスッキリするので当ブログは非表示にしています。
下記の手順ですすめて下さい。
【 AFFINGER管理 】→【 全体設定 】→【 抜粋設定 】→【 ブログカードの抜粋を非表示にする 】→【 Save 】
１．AFFINGER管理をクリック
２．全体設定 → 抜粋設定の順にクリック
３．PC閲覧時の「ブログカード」及びコンテンツ内の「おすすめ記事」の抜粋を非表示にするにチェックをいれる
４．Saveボタンをクリック
これで、下の画像のように抜粋 ( 記事の説明文 ) が非表示になります。
注意
AFFINGER管理で設定した抜粋の非表示ですが、ブロックエディタで作った場合はスマホのみ非表示になります。
※クラシック版の段落で作ったとはPCとスマホ両方非表示になります。
ブロックエディタで作った場合、当サイトの環境下が原因でPCで非表示にならなかったのか現在確認中です。
まとめ：WordPressブログカードの作り方
今回は、内部リンクをお洒落なカード型にしたい方向けに、
- ブロックエディタで作る
- ブロックエディタでクラシック版の段落を呼びだして作る
方法を解説しました。
ブログカードを作りたいと思っていた方の参考になれば幸いです。
