Jeremy Felt

Happy Prime

philcable

slocker

<p>The Theme Image Block plugin allows you to register images from your theme and make them available as blocks in the WordPress editor. This is useful for logos, icons, and other images that are part of your theme’s design system.</p>
<h3>Usage</h3>
<h3>Registering Theme Images</h3>
<p>Theme images should be registered using <code>HappyPrime\ThemeImageBlock\register_theme_image()</code>. This is likely best done on the <code>init</code> or <code>after_setup_theme</code> action.</p>
<pre><code>HappyPrime\ThemeImageBlock\register_theme_image(
    'happy-prime-logo',
    [
        'title' => 'Happy Prime Logo',
        'description' => 'The Happy Prime logo.',
        'alt' => 'Happy Prime',
        'path' => 'images/happy-prime-logo.svg',
        'width' => '300',
        'height' => '',
        'variations' => [
            'small' => [
                'path'   => 'images/happy-prime-logo-small.svg',
                'width'  => '100',
                'height' => '100',
            ],
            'medium' => [
                'path'   => 'images/happy-prime-logo-medium.svg',
                'width'  => '200',
                'height' => '200',
            ],
            'large' => [
                'path'   => 'images/happy-prime-logo-large.svg',
                'width'  => '300',
                'height' => '300',
            ],
        ],
        'sizes' => '(max-width: 600px) 100vw, 300px',
    ]
);
</code></pre>
<h3>Registering Theme Image Styles</h3>
<p>Theme image styles should be registered using <code>HappyPrime\ThemeImageBlock\register_theme_image_style()</code>. This is likely best done on the <code>init</code> or <code>after_setup_theme</code> action.</p>
<pre><code>HappyPrime\ThemeImageBlock\register_theme_image_style(
    'hero',
    [
        'name'   => 'Hero',
        'width'  => 'clamp(10rem, 100vw, 60rem)',
        'height' => 'auto',
    ]
);
</code></pre>


Theme Image Block

Use images from your theme as blocks in content.

Burhan Nasir

<p>Smart Auto Upload Images automatically imports external images from your post content into your WordPress media library. When you save or update a post, the plugin detects any external image URLs, downloads them to your server, and replaces the original URLs with your hosted versions. This improves site performance, ensures image availability, and gives you complete control over your content.</p>
<h3>Why Auto Upload Images to Your Media Library?</h3>
<p>When you copy content from external sources or use remote images, you risk broken images when the original source removes them. Hosting images on your own server provides several benefits:</p>
<ul>
<li><strong>Better SEO performance</strong> – Search engines favor self-hosted images</li>
<li><strong>Faster page load times</strong> – Eliminates external HTTP requests</li>
<li><strong>Full content control</strong> – Images remain available even if sources go offline</li>
</ul>
<h3>How Auto Upload Images Works</h3>
<p>The plugin runs automatically whenever you save or update a post. Here’s the process:</p>
<ol>
<li>Scans post content for external image URLs (any image not hosted on your domain)</li>
<li>Downloads each external image to a temporary location</li>
<li>Validates image file integrity and format</li>
<li>Uploads valid images to your WordPress media library</li>
<li>Replaces original external URLs with new local URLs</li>
<li>Attaches imported images to your post in the media library</li>
</ol>
<p>No manual intervention required. Just write your content and let the plugin handle the rest.</p>
<h3>Key Features</h3>
<h3>Automatic External Image Detection</h3>
<p>The plugin automatically identifies external images in your post content when you save. It distinguishes between local images (already hosted on your site) and external images that need importing.</p>
<h3>Smart URL Replacement</h3>
<p>After importing images, the plugin intelligently replaces all instances of the external URL with your new local URL. This works with images in:</p>
<ul>
<li>Post content (Classic Editor and Gutenberg blocks)</li>
<li>Image galleries</li>
<li>Featured images</li>
</ul>
<h3>Media Library Integration</h3>
<p>All imported images are added to your WordPress media library with proper metadata. You can:</p>
<ul>
<li>Edit images using WordPress image editor</li>
<li>View which post each image is attached to</li>
<li>Set custom alt text during import</li>
<li>Apply your site’s image optimization settings</li>
</ul>
<h3>Flexible Domain Exclusions</h3>
<p>Exclude specific domains from auto-import. Useful for:</p>
<ul>
<li>CDN-hosted images you want to keep external</li>
<li>Partner websites where you have permission to hotlink</li>
<li>Your own secondary domains</li>
<li>Social media embeds you want to keep as external</li>
</ul>
<h3>Custom Post Type Control</h3>
<p>Choose which post types trigger auto-upload. Enable for:</p>
<ul>
<li>Posts and pages (default)</li>
<li>WooCommerce products</li>
<li>Custom portfolio post types</li>
<li>Documentation posts</li>
<li>Or disable for specific types you want to skip</li>
</ul>
<h3>Advanced File Naming Patterns</h3>
<p>Set custom file naming patterns for imported images using dynamic tags:</p>
<ul>
<li><code>%filename%</code> – Original filename</li>
<li><code>%post_title%</code> – Current post title</li>
<li><code>%post_id%</code> – Post ID</li>
<li><code>%image_title%</code> – Image title attribute</li>
<li><code>%date%</code> – Current date</li>
<li><code>%time%</code> – Current timestamp</li>
</ul>
<p>Example: <code>%post_title%-%filename%</code> becomes <code>my-blog-post-example-image.jpg</code></p>
<h3>Custom Alt Text Patterns</h3>
<p>Define alt text patterns for better SEO:</p>
<ul>
<li><code>%post_title%</code> – Use post title in alt text</li>
<li><code>%filename%</code> – Use filename as alt text</li>
<li>Custom text – Set consistent alt text across imports</li>
</ul>
<h3>Image Size Constraints</h3>
<p>Set maximum width and height for imported images to:</p>
<ul>
<li>Control storage usage</li>
<li>Maintain consistent image sizes</li>
<li>Automatically resize oversized images</li>
<li>Prevent huge images from slowing your site</li>
</ul>
<h3>Featured Image from URL</h3>
<p>Set a post’s featured image using an external URL. The plugin will:</p>
<ul>
<li>Download the image from the URL</li>
<li>Import it to your media library</li>
<li>Set it as the post’s featured image</li>
<li>Work via REST API or post editor</li>
</ul>
<h3>How to Import External Images from Posts</h3>
<ol>
<li>Install and activate Auto Upload Images</li>
<li>Go to Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Auto Upload Images</li>
<li>Configure your preferences (or use defaults)</li>
<li>Create or edit any post with external images</li>
<li>Click Save or Update – images import automatically</li>
<li>Check your Media Library to see imported images</li>
</ol>
<h3>How to Exclude Specific Domains</h3>
<p>If you want to prevent images from certain domains from being imported:</p>
<ol>
<li>Go to Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Auto Upload Images</li>
<li>Find the “Excluded Domains” section</li>
<li>Enter domains one per line (e.g., cdn.example.com)</li>
<li>Save settings</li>
<li>Images from excluded domains will be left as external URLs</li>
</ol>
<h3>How to Set Custom File Names for Imported Images</h3>
<ol>
<li>Navigate to Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Auto Upload Images</li>
<li>Find “File Name Pattern” setting</li>
<li>Enter your pattern using available tags:
<ul>
<li>Example: <code>%post_title%-%filename%</code></li>
<li>Example: <code>imported-%date%-%filename%</code></li>
</ul>
</li>
<li>Save settings</li>
<li>New imports will use your naming pattern</li>
</ol>
<p>This helps organize your media library and improves SEO with descriptive file names.</p>
<h3>How to Set Featured Image via URL</h3>
<p><strong>Using the Post Editor:</strong></p>
<ol>
<li>Edit your post</li>
<li>Find the Featured Image section in the sidebar</li>
<li>Enter the external image URL in the “Set from URL” field</li>
<li>The image imports automatically and sets as featured image</li>
</ol>
<h3>Integration with Page Builders</h3>
<p>Auto Upload Images works with popular page builders:</p>
<h3>Gutenberg Block Editor</h3>
<p>All images in Gutenberg blocks are automatically detected and imported when you save the post.</p>
<h3>Classic Editor</h3>
<p>External images in Classic Editor content are imported on post save.</p>
<h3>WooCommerce</h3>
<p>Enable auto-import for Product post type to automatically import external product images.</p>
<h3>Custom Post Types</h3>
<p>Configure any custom post type to trigger auto-import functionality.</p>
<p>Just ensure Auto Upload Images is active when running imports.</p>
<h3>Performance and Storage Considerations</h3>
<h3>Server Storage</h3>
<p>Imported images consume server storage. Monitor your hosting plan’s disk space if importing large quantities of images.</p>
<h3>Import Speed</h3>
<p>Import time depends on:<br />
* Image file sizes<br />
* Your server’s download speed<br />
* Number of images per post<br />
* Configured maximum dimensions</p>
<h3>Optimization Tips</h3>
<ul>
<li>Set maximum width/height to reduce storage</li>
<li>Use an image optimization plugin after import</li>
<li>Exclude domains hosting very large images</li>
<li>Test with small batches before bulk imports</li>
</ul>
<h3>Developer Features</h3>
<h3>Filter: smart_aui_validate_image_url</h3>
<p>Programmatically control which image URLs get imported.</p>
<pre><code>`
</code></pre>
<p>add_filter( ‘smart_aui_validate_image_url’, function( $is_valid, $url ) {<br />
    // Skip images from specific paths<br />
    if ( strpos( $url, ‘/cdn/avatars/’ ) !== false ) {<br />
        return false;<br />
    }<br />
    return $is_valid;<br />
}, 10, 2 );<br />
    `</p>
<h3>Additional Hooks</h3>
<p>Check plugin documentation for additional filters and actions to customize behavior.</p>
<h3>Troubleshooting</h3>
<h3>Images Not Importing</h3>
<p><strong>Problem:</strong> External images remain unchanged after saving post</p>
<p><strong>Solutions:</strong><br />
* Check if domain is in excluded domains list<br />
* Verify your server can make external HTTP requests<br />
* Check WordPress debug log for errors<br />
* Ensure PHP has necessary image processing libraries<br />
* Verify write permissions on uploads directory</p>
<h3>Import Errors in Debug Log</h3>
<p><strong>Problem:</strong> Seeing errors in wp-content/debug.log</p>
<p><strong>Solutions:</strong><br />
* Check image URL is publicly accessible<br />
* Verify image format is supported (JPG, PNG, GIF, WebP)<br />
* Ensure external server allows download/hotlinking<br />
* Check SSL certificate validity if using HTTPS images</p>
<h3>Images Upload but URLs Not Replaced</h3>
<p><strong>Problem:</strong> Images added to media library but old URLs remain</p>
<p><strong>Solutions:</strong><br />
* Clear any caching plugins<br />
* Check post content in Text/HTML mode<br />
* Verify images aren’t in excluded domain list<br />
* Review file naming pattern doesn’t cause conflicts</p>
<h3>Duplicate Images in Media Library</h3>
<p><strong>Problem:</strong> Same image imported multiple times</p>
<p><strong>Solutions:</strong><br />
* Plugin should detect and reuse existing images (v1.2.0+)<br />
* Check if images have different URLs but same file<br />
* Clear media library of duplicates and re-save post</p>
<h3>Featured Image Not Setting from URL</h3>
<p><strong>Problem:</strong> Featured image URL not importing</p>
<p><strong>Solutions:</strong><br />
* Verify URL is publicly accessible<br />
* Check image format is supported<br />
* Ensure PHP memory limit is sufficient<br />
* Review error logs for specific error messages</p>
<h3>Maximum Width/Height Not Applied</h3>
<p><strong>Problem:</strong> Images exceed configured dimensions</p>
<p><strong>Solutions:</strong><br />
* Ensure GD or ImageMagick is installed on server<br />
* Check PHP memory limit allows image processing<br />
* Verify dimensions are set in plugin settings<br />
* Test with smaller images first</p>


Smart Auto Upload Images – Import External Images

Import external images automatically on save. Adds to media library and updates URLs. No manual downloads. Works with any post type.

Theme Image Block vs Smart Auto Upload Images – Import External Images