[オリジナル]ブログカードブロックの機能

ここで紹介する機能を利用するには、DigiPress 専用プラグイン「DigiPress Ex – Blocks / Blocks Free」が必要です。

「DigiPress Ex – Blocks」または「DigiPress Ex – Blocks Free」プラグインを利用することで、WordPress のブロックエディターにプラグインオリジナルの「ブログカード」ブロックが追加されます。

このブロックコンテンツは、指定されたWebページ(URL)のOGPデータを解析し、ページタイトル、概要、サムネイルをまとめたブログカードを表示します。

一度取得されたデータはデータベースにキャッシュされるため、対象ページのサイトへの負荷を気にすることなく利用できます。

ブロックコンテンツ表示サンプル

表示デモURLのみ指定した場合

DigiPress Ex – Blocks : 標準ブロックの拡張と独自ブロックを追加する必須プラグイン

PLUGIN PLUGIN DigiPress Ex – Blocks WordPress のブロックエディターの標準ブロックを拡張し、さらに DigiPress テーマにプリセット済みの CSS をベースに、直感的な操作で利便性の高い様々なオリジナルのブロックを追加する DigiPress テーマ専用のプラグインです。HTML や CSS セレクタを一切記述せず、実際のページと同じ表示で本文を意のままに作成でき、Webコンテンツ制作の自由度を一気に広げます。メンテナンス効率のため、本プラグインの機能はテーマには組み込まずプラグイン化しています。このため、無料版は最低限 DigiPress …

表示デモサムネイル左側、配色をカスタムした場合

DigiPress Ex – Blocks : 標準ブロックの拡張と独自ブロックを追加する必須プラグイン

表示デモ上部にラベルを表示した場合(アイコン対応)

DigiPress Ex – Blocks : 標準ブロックの拡張と独自ブロックを追加する必須プラグイン

表示デモグラデーション背景

DigiPress Ex – Blocks : 標準ブロックの拡張と独自ブロックを追加する必須プラグイン

ブロックの追加

オリジナルブロックは、ブロック追加ボタンから「DigiPress ブロック」グループを開いて追加します。

ブロックを追加すると、エディター上で以下の初期状態のコンテンツが表示されます。

編集イメージ

編集中のエディターでは、以下のように実際のブロックコンテンツの表示と同じ状態でカスタマイズができ、ブロック下部にあるURL欄にブログカードを表示したいURLを貼り付けるだけで瞬時にブログカードが描画されます。

サイト内の記事を対象とする場合は、キーワード(投稿タイトルなど)でリアルタイム検索ができます。

ブロック追加→URL貼り付け

リンクを新規タブで開く

ブログカードをクリックした際に、ブラウザの新規タブで対象ページを開くようにするには、URL欄の右隣にある「その他の設定」ボタンをクリックして表示された「新規タブで開く」のトグルをオンにします。

ブロックオプション(右側サイドバー)

ブログカード設定

右側の設定サイドバーにある「ブログカード設定」にて表示するブログカードの配色やラベルなどのデザインのカスタマイズが行えます。

ラベルの先頭にアイコンを表示する

ブログカードの上部にラベルを表示する場合、さらにラベルのテキストの先頭にアイコンを表示することができます。
ラベルアイコンの入力フォームにカーソルを置くと、テーマにプリセット済みのアイコンがランダムに100個表示されます。
目的のアイコンが100個の中にない場合は、キーワードを直接入力して検索します。

検索ワードは日本語にも対応しています。