Ethos post carousel hover info changed

Hello!

I had my post carousel set up to display the author, post title, and date on hover. Over the weekend, something changed somewhere and now it displays all the categories where the title used to be. Here is what I have in custom css:

/Post Carousel on Home Page – Show full post title on hover/
.x-post-carousel .x-post-carousel-meta>span {
text-overflow: clip;
white-space: normal;
height: auto;
}

/Adjust font size on post carousel hover/
.x-post-carousel-meta>span.entry-cover-categories {
font-size: 18px; /Change this to your preferred font size for the title/
}
.x-post-carousel-meta>span.entry-cover-date {
font-size: 15px; /Change this to your preferred font size for the date/

So what I’m trying to achieve is getting this back to Author on the top, Post Title in the center, Date on the bottom on hover. I am up to date on the theme and WordPress, we have a php upgrade pending for tonight.

Thanks in advance for your help!

Hi Julianne,

I just checked the link that you have provided and the carousel seems to be displaying correctly:

Were you able to get it sorted?

Cheers!

Hi Jade,

No, it’s not displaying correctly. What you’re seeing is not correct :slight_smile:
I need it to read as Author, Post Title, Date… so the middle section needs to change from categories to post title.

Hi Julianne,

The codes you showed above does not do the displaying of title on hover, you’ll need a custom template to do that. Maybe what you have before is the full title showing on the cover, and then the author and date on hover, at least that is what your CSS code above suggests. if so, please add this to Theme Options > CSS

.x-post-carousel-item .h-entry-cover {
	top: calc(100% - 6em);
}
.x-post-carousel-item span {
	text-overflow: clip;
    white-space: normal;
    height: auto;
}
.x-post-carousel-meta .entry-cover-categories {
	display: none;
}

Hope it helps,
Cheers!

Hi Friech,

Thanks for this code, I popped it in and it does what you said it would. However it’s not what I needed.

Last week, the carousel would display the post title in the middle section on hover, and I’m not sure why that changed. It appeared as:

author
----------
post title
----------
date

The code I shared was the code that was given to my by this support team 3 or so years ago to make that happen. I have not changed it but maybe during the updates we’ve run something inadvertently changed? Why would I need a custom template to accomplish that when for three years up until recently it was working that way?

Thanks again for your help!

Hi again,

Custom development is required because by default the categories are displayed in the middle section on hover see the demo here http://demo.theme.co/ethos-1/

However you can display the post title in the middle instead of the categories by adding the following code in your child theme’s functions.php file:

// Ethos - Carousel
// ===================================

if ( ! function_exists( 'x_ethos_entry_cover' ) ) :
  function x_ethos_entry_cover( $location ) {

    if ( $location == 'main-content' ) { ?>

      <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
        <a class="entry-cover" href="<?php the_permalink(); ?>" style="<?php echo x_ethos_entry_cover_background_image_style(); ?>">
          <h2 class="h-entry-cover"><span><?php x_the_alternate_title(); ?></span></h2>
        </a>
      </article>

    <?php } elseif ( $location == 'post-carousel' ) { ?>

      <?php GLOBAL $post_carousel_entry_id; ?>

      <article <?php post_class(); ?>>
        <a class="entry-cover" href="<?php the_permalink(); ?>" style="<?php echo x_ethos_entry_cover_background_image_style(); ?>">
          <h2 class="h-entry-cover"><span><?php ( $post_carousel_entry_id == get_the_ID() ) ? the_title() : x_the_alternate_title(); ?></span></h2>
          <div class="x-post-carousel-meta">
            <span class="entry-cover-author"><?php echo get_the_author(); ?></span>
            <span class="entry-cover-categories"><?php x_the_alternate_title(); ?></span>
            <span class="entry-cover-date"><?php echo get_the_date( 'F j, Y' ); ?></span>
          </div>
        </a>
      </article>

    <?php }

  }
endif;

Remove any old customization from your child theme’s functions.php file regarding the post carousel. Let us know how this goes!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.