mark l chaves

<p>With <strong>GIC</strong>, you can display the title, caption, and description image attributes. You can also change/filter the rendering HTML to whatever you want.</p>
<p>After installing and activating GIC, write your filter and add the WordPress <a href="https://codex.wordpress.org/Gallery_Shortcode" rel="nofollow ugc">Gallery shortcode</a> to your page.</p>
<p>If you’ve been <em>dreaming</em> of writing a filter to customise the gallery image captions, then this plugin is for you.</p>
<p><a href="https://streetphotography.blog/gallery-image-captions-demo/" rel="nofollow ugc">Visit the live demo page.</a></p>
<h4>Motivation</h4>
<p>The default WordPress gallery shortcode will only display the <strong>caption</strong> from the media’s attachment metadata. Sometimes it’s nice to display more like the title—even the description.</p>
<p>The <strong>GIC plugin</strong> overrides the WordPress gallery shortcode function to create a <a href="https://developer.wordpress.org/plugins/hooks/" rel="nofollow ugc">hook</a>. With this <em>hook</em> you can do a little bit more than just displaying the caption.</p>
<p>Some premium themes hide the caption completely. This leaves photography lovers like me scratching their head and spending precious time cobbling together makeshift caption blocks.</p>
<h3>Usage</h3>
<h4>Custom Filter For Displaying Captions</h4>
<p>The <strong>crux</strong> of this plugin is the ability to filter the gallery image caption. The <code>galimgcaps_gallery_image_caption</code> hook makes this possible.</p>
<p>For the usage examples below, this is the filter used.</p>
<pre><code>/**
 * Custom Filter for Gallery Image Captions
 *
 * Note: Avoid altering captiontag, selector, and itemtag.
 */
function mlc_gallery_image_caption($attachment_id, $captiontag, $selector, $itemtag) {

    $id = $attachment_id;

    // Grab the meta from the GIC plugin.
    $my_image_meta = galimgcaps_get_image_meta($id);

    /**
     * Here's where to customise the caption content.
     * 
     * This example uses the meta title, caption, and description. 
     * 
     * You can display any value from the $my_image_meta array. 
     * You can add your own HTML too.
     */
    return "<{$captiontag} class='wp-caption-text gallery-caption' id='{$selector}-{$id}'>" .
            "Title: " . $my_image_meta['title'] . "<br>" .
            "Caption: " . $my_image_meta['caption'] . "<br>". 
            "Description: ". $my_image_meta['description'] . 
        "</{$captiontag}></{$itemtag}>";

}
add_filter('galimgcaps_gallery_image_caption', 'mlc_gallery_image_caption', 10, 4);
</code></pre>
<p>Feel free to use this filter code as a starter template. After activating the GIC plugin, add the code above to your child theme’s <code>functions.php</code> file. Rename the function and tweak the return string to suit your needs.</p>
<h4>New Filter To Get Custom Fields</h4>
<pre><code>/**
 * New GIC 1.4.0 filter for custom meta fields.
 */
function gic_add_custom_fields( $image_meta, $attachment ) {

    // This is how you add a custom fields to the array that
    // GIC uses to display captions.
    $image_meta['credit_text'] = $attachment->credit_text;
    $image_meta['credit_link'] = $attachment->credit_link;

    return $image_meta;
}
add_filter( 'galimgcaps_image_meta', 'gic_add_custom_fields', 10, 2 );
</code></pre>
<p>To use these two custom fields, your <code>galimgcaps_gallery_image_caption</code> would look something like this.</p>
<pre><code>function mlc_gallery_image_caption($attachment_id, $captiontag, $selector, $itemtag) {

    $id = $attachment_id;

    // Grab the meta from the GIC plugin.
    $my_image_meta = galimgcaps_get_image_meta($id);

    // If there's credit, give it where it's due complete with link.
    $credit = $my_image_meta['description'] ? 
        "<br><strong>Credit</strong>: <a style='display: inline;' href='" . 
        $my_image_meta['credit_link'] . 
        "'>" . $my_image_meta['credit_text'] . "</a>" . "<br>" : 
        '';

    /**
     * With GIC 1.4.0 you can also add custom media attachment fields
     * to your captions.
     */
    return "<{$captiontag} class='wp-caption-text gallery-caption' id='{$selector}-{$id}'>" .
            "<strong>Caption</strong>: " . $my_image_meta['caption'] . "<br>" . 
            $credit .
            "</{$captiontag}></{$itemtag}>";

}
add_filter('galimgcaps_gallery_image_caption', 'mlc_gallery_image_caption', 10, 4);
</code></pre>
<p><strong>Since v1.2.0</strong>, GIC automatically adds an <strong>Image ID</strong> column to your WordPress Media Library. This is to help you add the image IDs to your GIC shortcodes.</p>
<p><a href="https://ps.w.org/gallery-image-captions/assets/screenshot-11.png" rel="nofollow ugc">See where GIC automatically adds an Image ID column to your WordPress Media Library.</a></p>
<p><strong>New in v1.4.0</strong>, GIC support custom media attachment fields.</p>
<h3>Usage Example 1</h3>
<h4>Shortcode</h4>
<p>For starters, let’s use a</p>
<pre><code><p></p> 
</code></pre>
<p>tag for the caption tag.</p>
<pre><code>[gallery size="full" columns="1" link="file" ids="114" captiontag="p"]
</code></pre>
<h4>Styling</h4>
<p>Let’s override the generated styles with our own style for one particular image.</p>
<pre><code>/* Targeting a Specific Image */

/* Add some padding all around. */
#gallery-1 .gallery-item, 
#gallery-1 .gallery-item p {
    padding: 1%;
}

/* Add some moody background with typewriter font. */
#gallery-1 .gallery-item {
    color: whitesmoke;
    background-color: black;
    font-size: 1.25rem;
    font-family: Courier, monospace;
    text-align: left !important;
}
</code></pre>
<h3>Usage Example 2</h3>
<h4>Shortcode</h4>
<p><strong>A 2 column x 1 row gallery with large size images using an H4 for the caption.</strong></p>
<pre><code>[gallery size="large" columns="2" link="file" ids="109,106" captiontag="h4"]
</code></pre>
<p><strong>A 3 column x 1 row gallery with medium size images using a blockquote for the caption.</strong></p>
<pre><code>[gallery size="medium" columns="3" link="file" ids="109,106,108" captiontag="blockquote"]
</code></pre>
<p>Did you notice that we are using</p>
<pre><code><blockquote></blockquote> 
</code></pre>
<p>in the second shortcode? Let’s give it try just for <em>kicks</em>.</p>
<h4>Styling</h4>
<pre><code>/* 1. Style the H4 Used in the Caption Example */
h4 {
    color: #777777 !important;
    font-size: 1.2rem !important;
    font-family: Helvetica, Arial, sans-serif !important;
}

/* 2. Help Align the Blockquote */
#gallery-3 .gallery-caption {
    margin-left: 40px !important;
}
</code></pre>
<h3>Responsive CSS Example</h3>
<p>I recommend adding the following media queries if you use galleries with more than one image. The two media queries below will stack 2×1 and 3×1 galleries into a 1 column x n rows or 2 column x n rows  as needed.</p>
<pre><code>/* Media Queries for Responsive Galleries */

/**
 * Styling based on article "How To: Style Your WordPress Gallery"
 * by Par Nicolas.
 * 
 * https://theme.fm/how-to-style-your-wordpress-gallery/
 */

/* Mobile Portrait Breakpoint - 1 column */
@media only screen and (max-width: 719.998px) {
    .gallery-columns-2 .gallery-item,
    .gallery-columns-3 .gallery-item { 
     width: 100% !important; 
  }
}

/* Mobile Landscape and Tablet Breakpoints - 2 columns */
@media only screen and (min-width: 720px) and (max-width: 1024px) {
  .gallery-columns-3 .gallery-item { 
     width: 50% !important; 
  }
}
</code></pre>


Gallery Image Captions (GIC)

Gallery Image Captions (GIC) allows you to customise WordPress gallery image captions.

patrickposner

<p>Simply Static is a static site generator that converts your existing WordPress website to a static website that you can host on your server, a static hosting provider, or a CDN.</p>
<p>It drastically improves the performance of your website and minimizes security risks as it removes the connection between your traditional server and your static website.</p>
<p>Simply Static can also be used by local development tools like LocalWP or Lando to develop your website offline and push the static site online.</p>
<p>This reduces your hosting costs to zero (depending on your requirements and the used service/provider).</p>
<h4>Performance</h4>
<p>Converting your website to a static website can drastically improve your performance. Simply Static eliminates all requests to your database and by that reducing the first time to byte.</p>
<p>This is especially impactful for websites that use long pages with a lot of animations, graphs, and other load-heavy tools like sliders.</p>
<h4>Security</h4>
<p>Removing the connection to your database and traditional server reduces the risk of getting hacked.</p>
<p>This reduces the stress to keep your WordPress website up to date and keeps your data secure (locally or in a protected environment).</p>
<h4>Reduce hosting costs</h4>
<p>Using Simply Static to deploy your website to one of the static hosting providers, a CDN or an S3 bucket reduces the amount of money required for reliable web hosting.</p>
<p>With the right setup, you can even host your website completely for free (Cloudflare Pages and GitHub Pages for example).</p>
<h4>Local development</h4>
<p>Develop your site locally and only push the static exported website on a server. To ensure everything works as expected I created a list of development tools that are completely supported:</p>
<ul>
<li><a href="https://localwp.com/" rel="nofollow ugc">LocalWP</a></li>
<li><a href="https://docs.lando.dev/" rel="nofollow ugc">lando</a></li>
</ul>
<p>I highly recommend not to use another tool for local development if you are not a programmer as in most cases manual package installation is required.</p>
<h4>Static Studio</h4>
<p>Static Studio is our all-in-one Static WordPress cloud hosting solution – here is why you want it:</p>
<ul>
<li>Secure WordPress hosting (locked-down WP, Firewall, NGINX-powered, 24/7 monitoring)</li>
<li>Fast static site hosting via BunnyCDN (global distribution, low TTFB, caching, minification)</li>
<li>Secure logins via SSO, 2FA protection and team management</li>
<li>Automated (and free) migration for all your existing sites</li>
<li>Backups, SSL, unlimited file storage and 1TB bandwidth per site</li>
<li>WP-CLI, SSH, SFTP and hands-on code support</li>
</ul>
<p><a href="https://simplystatic.com/simply-static-studio/" rel="nofollow ugc">Start your 7-day free trial</a></p>
<h3>Simply Static Pro</h3>
<p>The pro version of Simply Static enhances the plugin with various features.</p>
<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/Vml537IIwVc?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>GitHub Integration</h4>
<p>With the GitHub integration, you can completely automate your entire development process.</p>
<p>The only thing you need is a GitHub account, no knowledge of Git or GitHub itself is required, as Simply Static Pro handles the entire process for you and keeps your repository up to date.</p>
<p>This allows deploying your static website to:</p>
<ul>
<li>GitHub Pages</li>
<li>Cloudflare Pages</li>
<li>Netlify</li>
<li>Vercel</li>
</ul>
<h4>AWS S3 Integration</h4>
<p>Export directly to Amazon AWS S3 from Simply Static Pro. Connect your bucket and run your export.</p>
<h4>SFTP</h4>
<p>Export directly to a remote SFTP server. Connect your server and run your export.</p>
<h4>BunnyCDN Integration</h4>
<p>Export directly to BunnyCDN and get all the benefits of their CDN – including caching, file optimization and DNS management.</p>
<h4>Incremental-, Builds and Single Exports</h4>
<p>Use Incremental Exports to update only changes to your static website. No configuration needed, just choose Update and run the export.</p>
<p>Use Build Exports to quickly roll out global changes to your static website. Want to update your style.css file? Or a new plugin? Use a build export.</p>
<p>Use Single Exports to quickly publish new pages and posts to your static site. This also supports scheduled posts.</p>
<h4>Forms</h4>
<p>Create and use forms created with your favorite form plugin on your static website with Simply Static Pro. Supported plugins are:</p>
<ul>
<li>Contact Form 7</li>
<li>Gravity Forms</li>
<li>WP Forms</li>
<li>FluentForms</li>
<li>WS Forms</li>
</ul>
<p>You can decide if you want to use an external service like Zapier and IFTTT to offload the submission (webhook) or embed the form from your WordPress website via iFrame.</p>
<h4>Search</h4>
<p>Use a fully static search solution that does not rely on any Third-Party-Providers. It uses Fuse.js and creates an index of your whole website as a JSON file.</p>
<p>The search supports autosuggestion and fuzzy logic and is by default way more convenient than your default WordPress search.</p>
<h4>Comments</h4>
<p>Enable comments on your static website without the requirement of Third-Party-Providers. Use your original WordPress website to process the comment.</p>
<p>After a comment was submitted, Simply Static automatically exports a new static version of the post. You don’t have to do anything.</p>
<h4>Multilingual</h4>
<p>Use WPML, Polylang or TranslatePress and run static exports per language or all at once.</p>
<p>Simply Static Pro also supports configuring settings per language, using the available language switchers and more to export a your multilingual website as easy as possible.</p>
<h4>WP-CLI</h4>
<p>Simply Static Pro has a detailed and comprehensive integration with WP-CLI.</p>
<p>Control every option, run different kinds of exports and more with the WP-CLI integration.</p>
<h4>Minification</h4>
<p>Automatically minfiy HTML, CSS and JavaScript files on your static site.</p>
<p>We can even minify inline CSS & JavaScript.</p>
<h4>Image Optimization</h4>
<p>Automatically optimize images on your static website with our ShortPixel API integration.</p>
<h4>Optimization</h4>
<p>Replace default WordPress paths and completely hide that you are using WordPress behind the scenes.</p>
<p>Replace:</p>
<ul>
<li>wp-content</li>
<li>wp-includes</li>
<li>wp-content/plugins/</li>
<li>wp-content/themes/</li>
<li>wp-content/uploads/</li>
</ul>
<p>Hide & Disable:</p>
<p>Disabled unwanted features in WordPress before running an static export like:</p>
<ul>
<li>XML-RPC</li>
<li>REST API URLs</li>
<li>Emoji support</li>
<li>Shortlink support</li>
<li>WordPress version in HTML</li>
</ul>
<p>and much more.</p>
<h4>Get the Pro version</h4>
<p>You can get the pro version <a href="https://simplystatic.com/pricing/" rel="nofollow ugc">here</a>.</p>
<h4>Simply Static Course</h4>
<p>We created an entire video course about Static WordPress with Simply Static – check out the first video:</p>
<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/Ei_w-Jcq4uQ?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>
<p>You can watch the entire course entirely for free on YouTube here: <a href="https://www.youtube.com/playlist?list=PLcpe8_rNg8U5g1gCOa0Ge6T17f50nSvmg" rel="nofollow ugc">Simply Static Course</a></p>
<h4>Tutorials</h4>
<p>We also publish new tutorials on our blog every other week on how to work with Simply Static and other static site tools.</p>
<p>You can check the latest tutorials <a href="https://simplystatic.com/tutorials/" rel="nofollow ugc">here</a></p>
<h4>Documentation</h4>
<p>We have a super extensive documentation that covers every aspect of Simply Static and Simply Static Pro.</p>
<p>You can check the documentation <a href="https://docs.simplystatic.com" rel="nofollow ugc">here</a></p>


Simply Static – The Static Site Generator

Straight forward site conversion.

I was able to "freeze" my disused subdomains and store them in a new directory on my webserver with minimal fuss.

Perfect for sending a site into retirement


I've been a happy user for quite a while now. It does what you expect, generates a nice static site that I can upload to cheap static hosting. 



I upgraded to pro as I like the automatic publishing options via GitHub, which saves me a few minutes from manually uploading it to my host. 



Support responses have been fast and top-notch. Thanks to Patrick for building a great tool. 


A must for sites that don't need to be dynamic.


Thanks to this plugin, I have saved myself lots of time. Instead of converting my WordPress theme to one of the static site generators (Gatsby, Hugo ..etc), this plugin just did exactly the same but also I kept the powerful editing experience of WordPress. Thanks for making this. 


Worked perfectly


I had to archive some old  wp websites to static and had no problem doing so thanks to this incredible plugin.


works perfectly.


This plugin is supreme. As an experiment, I achieved a 100% free personal site with custom domain and SSL thanks to Simply Static and GitHub. I run WordPress locally with MAMP, generate static site files in a local repo then push to remote for GitHub Pages to serve. Bob's my uncle!



You can buy Pro too, you know. It's easier.


Thanks for helping make my personal site 100% free


I use this to export my local wordpress site to cloudflare pages - free hosting for life (or until cloudflare decides to charge for it).



Works like a charm.


Goodbye expensive hosting


Simply Static is a genius product, able to create static exports of even the largest sites. The user interface is modern, clean, and intuitive.  It's also developer-friendly, with hooks and filters galore.



But it's the support that is blowing my mind: responsive both in terms of responding to issues, but also getting improvements into the code and deployed. Above and beyond on all fronts. 💯


Top-tier Plugin and Support

Create a static website directly from your WordPress website with Simply Static.

Gallery Image Captions (GIC) vs Simply Static – The Static Site Generator