Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #388008

    Hi there,
    Just wondering how I can add image captions underneath the image for features images in posts please.
    Thanks for your help.
    /D

    #388409

    Hi dcashion!

    Open up /enfold/includes/loop-index.php and around line 93 you should see this.

    if($slider) echo '<div class="big-preview '.$blog_style.'">'.$slider.'</div>';
    

    Add this beneath it.

    echo '<p>'.$featured_img_desc.'</p>';
    

    Cheers!
    Elliott

    #936765

    This is cool, but if I don’t put anything in the image caption field, it automatically pulls from the post title. Is there a way to modify this so, if the client doesn’t add a cation to the image, there’s no caption?

    Thanks!

    #937010

    Hi sky19er,

    Can you please be more specific what you’re trying to achieve? In which slider?

    Best regards,
    Victoria

    #937015

    I’m trying to add image captions underneath the large featured image in single post pages. I can’t send you directly to this url, because we have a coming soon page blocking the site, but here’s a screen shot — https://www.evernote.com/shard/s320/sh/0f555ea6-3347-476e-8e6b-60d7dd6e4dc0/c85e8bc412d3026bee39c8363930e088 — in this example, I have nothing entered in the Caption field for the image, so it’s apparently just pulling in the post title by default. My client wants to be able to add captions to their featured images, if they have a caption, but they don’t want to just duplicate the post title there, if there’s no caption — if there’s no caption, they would like there to be no caption showing under the image. Make sense?

    Thanks and let me know if you have any other questions.

    #937587

    Hi sky19er,

    Thank you for the explanation and the screenshot.

    Can you give us temporary admin access to your website in the private content box below, so that we can have a closer look?

    Best regards,
    Victoria

    #937862

    Sure thing:

    #938903

    Hi,

    If there is no caption and you do not want to duplicate the post title, then you need to:
    1. Either remove the custom post title, if meta of image is empty
    2. Add a ” space ” character ( yes just a space ) and it will be a blank section

    That will help you out.
    If you need something else, please let us know.

    Best regards,
    Basilis

    #940195

    Remove the custom post title? Sorry, I don’t understand that one — could you elaborate on that, please?

    Thanks

    #941351

    Hi,

    I’m sorry for the confusion. Please replace the modification with the following.

    if($featured_img_desc) echo ''.$featured_img_desc.'';
    

    Best regards,
    Ismael

    #941647

    Thanks, but that doesn’t seem to change anything — if there’s nothing entered in the image/media caption field, it still shows the post title as the image caption, on the front end. Got anything else for me? :)

    #942464

    Hi,

    I would like to make a few changes to the includes > loop-index.php file but it’s not writable. Please provide the FTP details in the private field.

    Best regards,
    Ismael

    #942703

    Yeah, this client needs to clear IPs for me to work on the site — can you give me an IP I can ask them to clear for you? Thanks!

    #943421

    Hi,

    Please ask your client to send a whitelist link in this email. (see private field) Or replace the modification with this code.

    if($featured_img_desc !== the_title_attribute( 'echo=0' )) echo ''.$featured_img_desc.'';
    

    Best regards,
    Ismael

    #1149670

    I’m trying to do the same and tried all three options in the php and there is still no caption underneath the featured image. I’m using the elegant theme with fullwidth featured images on single posts. Thanks!

    #1150371

    Hi,

    Thank you for following up.


    @webWahine
    : Did you add a caption to the featured image? You can do that directly during the upload, or in the Media > Library panel. Try to replace the code with this:

    if ($featured_img_desc) echo '<span>'.$featured_img_desc.'</span>'; 
    

    Best regards,
    Ismael

    #1150699

    Hello, Ismael

    Thanks, but it’s still not working. Yes, I added in a caption, description, title and alt tag in the media library to the featured image. At around line 162 in the latest loop-index.php I’ve modified this in the parent theme – do I perhaps need to create a new functions.php for the child?

            if ( !in_array( $blog_style, array('bloglist-simple', 'bloglist-compact', 'bloglist-excerpt') ) ) {
                //echo preview image
                if (strpos($blog_global_style, 'elegant-blog') === false) {
                    if (strpos($blog_style, 'big') !== false) {
                        if ($slider) $slider = '<a href="' . $link . '" title="' . $featured_img_desc . '">' . $slider . '</a>';
                        if ($slider) echo '<div class="big-preview ' . $blog_style . '">' . $slider . '</div>';
    					if ($featured_img_desc) echo '<span>'.$featured_img_desc.'</span>'; 
                    }
    
                    if (!empty($before_content))
                        echo '<div class="big-preview ' . $blog_style . '">' . $before_content . '</div>';
                }
            }
    #1151157

    Hi,

    Thank you for the update.

    There are actually two instances in the file where the big preview image or slider is rendered. Please look for the other instance of the code, then try to place the description snippet below it. The second one can be found around line 280.

    if ($slider) echo '<div class="big-preview ' . $blog_style . '">' . $slider . '</div>';
    

    If it doesn’t work, please create a new ticket and post the WP and FTP login details in the private field so that we can see what’s going on.

    Best regards,
    Ismael

    #1152214

    I cut the code from the first instance and added it to the second, as advised. I now see the text but I’m trying to target it and it’s impossible to see what element it is to style it. Could you please let me know how to style it? Thanks, again :)

    #1152803

    Hi,

    Glad to know that it’s somehow working. If you want to style it, try to add a class name or attribute to the surrounding span tag.

    if ($featured_img_desc) echo '<span class="featured-image-description">'.$featured_img_desc.'</span>';
    

    You can now use the class name to target the description. Example:

    .featured-image-description {
        color: red;
    }
    

    Please don’t forget to toggle the Performance > File Compression settings after adding the css.

    Best regards,
    Ismael

    #1153166

    Ok, that worked but I still have an issue, please.

    When I turn on background of course it’s targeting just the background of the text, so not the element that is holding it. I’d like to be able to adjust either the padding or margins where the text sits – I’ve tried every possible combination and it’s still not moving, using span and p after and before the class, with and without spaces.

    I made a div and gave it an id of fi-descr and placed it outside of the span class but that made the styling for the loop-index.php stop working.

    What I need to do is be able to adjust the vertical spacing, top and bottom.

    Thanks, again :)

    #1154834

    Hi,

    Sorry for the late response. Please try to set the “display” property of the “featured-image-description” container to “block” so that it takes the available spaces or make it full width.

    .featured-image-description {
       display: block;
       background: red;
       width: 100%;
       height: 30px;
       line-height: 30px;
       padding: 11px 23px;
    }

    Best regards,
    Ismael

    #1155771

    That worked perfectly! Thank you, Ismael :) You can close the post.

    #1155872

    Hi,

    Thanks for the update, I’ll go ahead and close this thread for now then. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

Viewing 24 posts - 1 through 24 (of 24 total)
  • The topic ‘Adding captions underneath featured images on posts’ is closed to new replies.