求助:如何在Easy FancyBox弹窗内显示图片标题与描述?
Hey Ketan, glad to hear you're having a good experience with Easy FancyBox! Let's walk through how to get that image title and description showing up in your popups—this should do the trick:
Step 1: Verify Your Image Metadata
First, make sure your images have the title and description filled out in your WordPress Media Library. When you edit an image, check the Title and Description fields on the right-hand side—these are the values the plugin will pull from.
Step 2: Access Easy FancyBox Settings
Head to your WordPress dashboard, then go to Settings > Media. You'll find an Easy FancyBox tab here (if you don't see it, double-check the plugin is activated, or click the "Settings" link under Easy FancyBox in your Plugins list).
Step 3: Configure Title Display
In the Easy FancyBox settings, navigate to the Images section:
- Look for the Title position dropdown. Make sure it's set to something other than None (options like Inside, Outside, or Over work great—pick whichever fits your design best). This will make the image title appear in the popup.
Step 4: Add Image Descriptions to Popups
By default, Easy FancyBox doesn't pull in image descriptions automatically, but there are two simple ways to fix this:
Option 1: Manual HTML Edit (For Individual Images)
If you're inserting images via the block editor or custom HTML, set the image's link to "Media File", then add a data-caption attribute to the anchor tag. Combine your title and description here, using <br> to separate them:
<a href="your-full-image-url.jpg" data-fancybox="gallery" data-caption="Your Image Title<br>Your image description text goes here"> <img src="your-thumbnail-url.jpg" alt="Image alt text"> </a>
Option 2: Automatic Code Snippet (For Bulk Handling)
If you want to apply this to all your images without editing HTML manually, use a code snippet:
- Install and activate a plugin like Code Snippets (to avoid editing your theme's functions.php directly).
- Create a new snippet and paste this code:
add_filter('fancybox_anchor_attributes', 'add_fancybox_caption_from_image_description', 10, 2); function add_fancybox_caption_from_image_description($attrs, $post) { // Combine title and description into the caption if (!empty($post->post_content)) { $attrs['data-caption'] = $post->post_title . '<br>' . $post->post_content; } elseif (!empty($post->post_title)) { $attrs['data-caption'] = $post->post_title; } return $attrs; }
- Save and activate the snippet. This will automatically pull the title and description from your Media Library images and display them in the popup.
Step 5: Test It Out
Save all your settings, clear any site cache, then refresh your front-end page. Click an image—you should now see both the title and description in the FancyBox popup!
If you run into any issues, make sure you're using the latest version of Easy FancyBox, and double-check that your image metadata is correctly filled out.
内容的提问来源于stack exchange,提问作者Ketan

