Moving titles on the home page / category pages etc

I am trying to move the titles underneath their respective images on my homepage, category and meta tag pages on my site Foodus.com … It almost worked by adding the following lines to functions.php:

// Move titles under images

add_action( ‘genesis_meta’, ‘move_title_below’ );

function move_title_below() {

if (is_category() || is_home() || is_archive()) {

remove_action( ‘genesis_entry_content’, ‘genesis_do_post_image’, 8);

add_action( ‘genesis_entry_header’, ‘genesis_do_post_image’, 3);

}

}

The titles now appear underneath the images for the first 9 images, at which point the infinite scroll kicks in, and then the titles go back to being displayed above the images. How do I fix this?

I have granted access through the WPMU dashboard plugin, in case that is helpful.

Thanks for your help…

  • Tyler Postle
    • CGO

    Hey d-invent,

    Hope you’re doing well today and thanks for your question!

    I would of expected your code above to work for past the scroll as well. Would you mind sending in your FTP and WP login so we can grab a copy of your theme and do some of our own testing with it? :slight_smile:

    Send in:

    Subject: “Attn: Tyler Postle

    -WordPress admin username

    -WordPress admin password

    -login url

    -FTP credentials (host/username/password)

    -link back to this thread for reference

    -any other relevant urls

    Select “I have a different question” for your topic – this and the subject line ensure that it gets assigned to me :slight_smile:

    https://premium.wpmudev.org/contact/

    Look forward to hearing back!

    All the best,

    Tyler

  • Tyler Postle
    • CGO

    Hey d-invent,

    Hope you’re doing well today!

    I’ve been looking into this and I see the grid layout is actually from a plugin, is that right? The theme doesn’t look like it comes with it, but I see you have a Genesis Grid plugin that I’m guessing it’s coming from?

    I’m not too familiar with Genesis themes, my apologies!

    I just want to make sure that I know all the details here to pass onto one of our developers so they can take a quick look too :slight_smile:

    Talk to you soon!

    Cheers,

    Tyler

  • d-invent
    • The Incredible Code Injector

    The homepage layout comes from the Genesis Grid plugin and the infinite scroll feature comes from the “Jetpack by WordPress.com” plugin along with the “Genesis Jetpack Infinite Scroll” plugin.

    Thanks for passing this on to one of your developers! Can’t wait to get to the bottom of this!

  • d-invent
    • The Incredible Code Injector

    That seems to work for the posts after the first 9 (so page 2 and on), however it has made the titles for the first 9 posts appear completely distorted. Also, when the screen is resized, the titles after the first 9 (page 2 and on) have a strange behavior, rather than being responsive and being resized along with the resizing of the images…

    I’m assuming that the code below is the custom css that you added. I have removed it until it is tweaked to work so that the homepage does not look strange until then…

    body.gppro-custom.archive .one-third .entry-header,

    body.gppro-custom.home .one-third .entry-header {

    position: absolute;

    bottom: 3px;

    display: inline-block;

    }

    body.gppro-custom.archive .entry-header h2.entry-title,

    body.gppro-custom.archive .one-third .entry-content,

    body.gppro-custom.home .entry-header h2.entry-title,

    body.gppro-custom.home .one-third .entry-content {

    display:inline-block;

    }

    body.gppro-custom.archive .entry-header h2.entry-title a,

    body.gppro-custom.home .entry-header h2.entry-title a {

    font-size: 17.1px;

    }

    Thanks for your help!

  • Predrag Dubajic
    • Support

    Hey @d-invent,

    I was unable to fix the issue you are having, it seems that issue is with some of the scripts used for loading posts on scroll.

    First set of posts doesn’t get the height for the image image holder and that’s why the titles are showing below the image, but the posts loaded after the scroll do get height for the image and push the title to its original location since your HTML structure is TITLE – IMAGE instead of IMAGE – TITLE

    This may help SLS developers figuring it out.

    Best regards,

    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.