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.

Takashi Fujisaki

<p>WordPress’s standard URL embedding feature only works with WordPress sites.</p>
<p>This plugin was created to display any link destination as a stylish card with thumbnails.</p>
<p>Just paste the URL into the block editor. Blog cards are displayed in an instant.</p>
<p>New features from version 2.0.0 include the ability to create blog cards from site search.<br />
This allows you to search for articles within your own site and convert them into blog cards.</p>
<blockquote>
<p><strong>Important Notice:</strong><br />
  Starting from version 2.1.0, the block is rendered dynamically on the server side to improve stability.<br />
  <strong>Note:</strong> Manual edits made via “Edit as HTML” will be reset to the standard design.<br />
  If you see “Attempt Block Recovery” after updating, please click the button to recover the block.</p>
</blockquote>
<h3>Key Features</h3>
<ul>
<li><strong>Easy Operation</strong>: Simply enter a URL and press Enter to instantly generate a blog card</li>
<li><strong>Universal Compatibility</strong>: Works with non-WordPress sites (note, Zenn, Qiita, GitHub, etc.)</li>
<li><strong>Automatic Metadata Fetching</strong>: Automatically retrieves title, description, and thumbnail images</li>
<li><strong>Customizable</strong>: Retrieved information can be edited later</li>
<li><strong>SEO Friendly</strong>: Set rel attributes like nofollow, nofollow, sponsored, ugc</li>
<li><strong>Responsive Design</strong>: Beautiful display on mobile devices</li>
<li><strong>Caching</strong>: Caches retrieved metadata for fast display</li>
<li><strong>Site Search</strong>: Search and convert internal posts into blog cards</li>
<li><strong>Dark Mode Support</strong>: Supports dark mode with .dark class</li>
<li><strong>Advanced Management</strong>: Configure default link targets, cache duration, and manual favicon support</li>
</ul>
<h3>Usage</h3>
<h3>Basic Usage</h3>
<ol>
<li>Click the ‘+’ button in the post/page editor</li>
<li>Search for and select ‘Blog Card’</li>
<li>Enter the destination URL in the URL input field</li>
<li>Press Enter to automatically fetch metadata and generate a blog card</li>
</ol>
<h3>Advanced Settings</h3>
<p>When the block is selected, the following settings appear in the right sidebar:</p>
<ul>
<li><strong>URL</strong>: Destination URL</li>
<li><strong>TARGET Attribute</strong>: How to open the link (_blank, _self, etc.)</li>
<li><strong>Rel Attributes</strong>: noopener, nofollow, noreferrer, sponsored, ugc</li>
<li><strong>Thumbnail</strong>: Show/hide thumbnail image</li>
<li><strong>Title</strong>: Manual title editing</li>
<li><strong>Description</strong>: Manual description editing</li>
<li><strong>Thumbnail Image</strong>: Manual thumbnail image setting</li>
</ul>
<h3>Support</h3>
<p>For questions about the plugin or bug reports, please use the following methods:</p>
<ul>
<li>GitHub Issues: [Plugin repository URL]</li>
<li>Email: [Support email address]</li>
</ul>
<h3>Developer Information</h3>
<p>This plugin is developed using the following technologies:</p>
<ul>
<li>WordPress Block Editor (Gutenberg)</li>
<li>React</li>
<li>WordPress REST API</li>
<li>PHP 7.4 or higher</li>
</ul>
<p>If you would like to customize or add features, please send a pull request to the GitHub repository.</p>
<h3>License</h3>
<p>This plugin is released under the GPLv2 or later license.</p>
<h3>Acknowledgments</h3>
<p>In developing this plugin, we referenced the following open source projects:</p>
<ul>
<li>WordPress</li>
<li>React</li>
<li>Other open source libraries</li>
</ul>
<h3>Development</h3>
<p>This plugin is actively maintained and developed. Contributions are welcome!</p>
<p>For development setup and contribution guidelines, please refer to the GitHub repository.</p>


SU Blocks Blogcard

A WordPress plugin that makes it easy to create blog cards. Simply enter a URL and automatically fetch metadata to display beautiful cards.

WWI Blogcard vs SU Blocks Blogcard