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.

Katsushi Kawamori

ishitaka

<h4>Blog card</h4>
<ul>
<li>Generated with shortcode</li>
<li>Generated with block</li>
<li>Can specify the number of characters displayed in the description.</li>
<li>Displays an ogp image.</li>
<li>Can specify the size of the displayed ogp image.</li>
<li>Can change the title and description.</li>
</ul>
<h4>Warning</h4>
<p>A redirect loop occurs when all three of the following factors are met:<br />
* When two sites with different domains embed “Siｍple Blog Card” for each other on their top pages.<br />
* When two sites with different domains are on the same server (same IP address).<br />
* When the ”Simple Blog Card” caches of two sites on different domains are empty.</p>
<h4>How it works</h4>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/xTicX7DiGjU?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe></span>
<h4>Customize</h4>
<ul>
<li>Template files allow for flexible <a href="https://github.com/katsushi-kawamori/Simple-Blog-Card-Templates" rel="nofollow ugc">customization</a>.</li>
<li>The default template file is template/simpleblogcard-template.php. Using this as a reference, you can specify a separate template file using the filters below.</li>
</ul>
<pre><code>/** ==================================================
 * Filter for template file.
 *
 */
add_filter(
    'simple_blog_card_generate_template_file',
    function () {
        $wp_uploads = wp_upload_dir();
        $upload_dir = wp_normalize_path( $wp_uploads['basedir'] );
        $upload_dir = untrailingslashit( $upload_dir );
        return $upload_dir . '/tmp/simpleblogcard-template.php';
    },
    10,
    1
);
</code></pre>
<ul>
<li>CSS files can be set separately. Please see the filters below.</li>
</ul>
<pre><code>/** ==================================================
 * Filter for CSS file.
 *
 */
add_filter(
    'simple_blog_card_css_url',
    function () {
        $wp_uploads = wp_upload_dir();
        $upload_url = $wp_uploads['baseurl'];
        if ( is_ssl() ) {
            $upload_url = str_replace( 'http:', 'https:', $upload_url );
        }
        $upload_url = untrailingslashit( $upload_url );
        return $upload_url . '/tmp/simpleblogcard.css';
    },
    10,
    1
);
</code></pre>


SU Blocks Blogcard vs Simple Blog Card