[Kerri CParticipant]

Hi,

I really like the look of the Ethos Demo #1, especially the carousel at the top, but it doesn’t quite meet the need I’m trying to solve for. What I want to do with that space is include the cover graphic for an audio book, and have the graphic link to the book on the Audible website. But, the way that carousel is working it is driven by a feature image in a post, then the person has to go to the post to then get to the book page.

How could I possibly achieve this? Also, the audio book cover images are 300px x 300px, so the slider resizes them, and some of the images are cut off at the top (thus cutting heads off of people).

Here is my site – I started with the slider so nothing else is really fixed up yet visually, please don’t judge 🙂

http://www.kerrimccann.com

Any suggestions for how I may replicate this functionality, but have the images look better and just link to another page would be great! I love the look of it… nice way to show off my books!

[ChristianModerator]

Hey there,

Thanks for writing in! Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities. Thanks for understanding. Take care!

[Kerri CParticipant]

Is it possible to override the size of the slides? Right now it looks like they are 337px wide and 225px tall. Is it possible to change the size so that the top of the image isn’t cut off? I’m already using a child theme. Thanks!

<li class=”x-post-carousel-item slick-slide” style=”width: 337px;”>

<article class=”post-10267 post type-post status-publish format-standard has-post-thumbnail hentry category-audio-books”>

<h2 class=”h-entry-cover”><span>Transition: Chronicles of the Uprising 4 by K.A. Salidas</span></h2>
<div class=”x-post-carousel-meta”>
<span class=”entry-cover-author”>kmaudio</span>
<span class=”entry-cover-categories”>Audio Books</span>
<span class=”entry-cover-date”>April 3, 2016</span>
</div>

</article>

[RupokMember]

Hi there,

Thanks for updating. You can add this under Custom > CSS in the Customizer.

.x-post-carousel.unstyled {
  height: 300px;
}

.x-post-carousel.unstyled .entry-cover {
  padding-bottom: 300px;
}

Hope this helps.

Cheers!

[Author]

Posts