Takashi Fujisaki

<p>WordPress標準のURL埋め込み機能は、リンク先がWordPressサイトでなければ埋め込むことができません。</p>
<p>そこで、あらゆるリンク先をサムネイルつきのカードでスタイリッシュに表示するためにこのプラグインを作りました。</p>
<p>URLをブロックエディターに貼り付けるだけ。あっという間にブログカードを表示できます。</p>


LitoBlocks Blogcard

URLを貼るだけでnoteやZennのようなサムネイルつきのリンク、ブログカードを表示できます。

whywaita

<p>WWI Blogcard is a Gutenberg block plugin that creates visually appealing blog cards from any URL. Simply paste a URL, and the plugin automatically fetches OGP (Open Graph Protocol) information to generate a rich preview card.</p>
<h4>Features</h4>
<ul>
<li><strong>Easy to use</strong>: Just paste a URL and the blog card is automatically generated</li>
<li><strong>OGP support</strong>: Fetches title, description, and images from OGP meta tags</li>
<li><strong>Responsive design</strong>: Cards look great on any device</li>
<li><strong>Dark mode support</strong>: Automatic dark mode based on system preferences</li>
<li><strong>Caching</strong>: OGP data is cached for improved performance</li>
<li><strong>Security</strong>: SSRF protection blocks requests to private IP addresses</li>
</ul>
<h4>Usage</h4>
<ol>
<li>Add a new “Blogcard” block in the Gutenberg editor</li>
<li>Paste the URL you want to create a card for</li>
<li>Click “Fetch” to retrieve OGP information</li>
<li>The blog card is automatically generated</li>
</ol>
<h3>Source Code</h3>
<p>The source code for this plugin, including uncompiled JavaScript and CSS files, is available on GitHub:</p>
<p><a href="https://github.com/whywaita/wwi-blogcard" rel="nofollow ugc">https://github.com/whywaita/wwi-blogcard</a></p>
<h4>Building from Source</h4>
<p>To build the plugin from source, you need Node.js and npm installed. Then run the following commands:</p>
<ol>
<li>Clone the repository: <code>git clone https://github.com/whywaita/wwi-blogcard.git</code></li>
<li>Navigate to the plugin directory: <code>cd wwi-blogcard</code></li>
<li>Install dependencies: <code>npm install</code></li>
<li>Build the plugin: <code>npm run build</code></li>
</ol>
<p>The build process uses <code>@wordpress/scripts</code> to compile and minify the JavaScript and CSS files from the <code>src/</code> directory to the <code>build/</code> directory.</p>


WWI Blogcard

A WordPress block plugin that generates beautiful blog cards from URLs using OGP information.

LitoBlocks Blogcard vs WWI Blogcard