Docs

[Yawarundi]

Hi,

I would like the post slider at my site (http://www.allpachaski.com) to loke like the one on this site: http://www.laderasur.cl/

That means:
1. Reduce the darkening that covers the featured image to half the height of the slider.
2. Put the post excerpts in the slider.
3. Remove the View Post mesage from the slider.

Can you help me with these? Thank you.

[Nico]

Hi There,

Thanks for writing in.

We’ll be happy to assist you with this issue, but we’ll first need you to provide us with some information below to check your setup closer (don’t forget to select “Set as private reply” to ensure that your data remains hidden):

Your URL.
Your WordPress login credentials.
Your FTP credentials (in case we need to check anything out on your server).
Once we have all of this, we’ll be happy to take a deeper look into things.

Thanks.

[Yawarundi]

This reply has been marked as private.

[Rad]

Hi there,

Thanks for writing in.

Add this css at Admin > Appearance > Customizer > Custom > CSS.

.x-post-slider-entry>a {
top: 50% !important;
}
.x-post-slider-entry .featured-view {
display: none;
}

Then copy this file /wp-content/themes/x/framework/views/ethos/_post-slider.php to your child theme of same folder structure. Eg. /wp-content/themes/x-child/framework/views/ethos/_post-slider.php

Edit your child theme’s _post-slider.php and replace this code :

<div class="cover">
                    <div class="middle">
                      <span class="featured-meta"><?php echo x_ethos_post_categories(); ?> / <?php echo get_the_date( 'F j, Y' ); ?></span>
                      <h2 class="h-featured"><span><?php x_the_alternate_title(); ?></span></h2>
                      <span class="featured-view"><?php _e( 'View Post', '__x__' ); ?></span>
                    </div>
                  </div>

with this code :

<div class="cover">
                    <div class="middle">
                      <span class="featured-meta"><?php echo x_ethos_post_categories(); ?> / <?php echo get_the_date( 'F j, Y' ); ?></span>
                      <h2 class="h-featured"><span><?php x_the_alternate_title(); ?></span></h2>
                      <span class="featured-excerpt"><?php echo strip_tags( get_the_excerpt() ); ?></span>
                    </div>
                  </div>

Last, save it and upload it.

Hope this helps.

[Yawarundi]

Perfect!
Now, can I control de color of the excerpt text? I need it white.
Thank you.

[Christopher]

Hi there,

Please add the following CSS under Customize -> Custom -> CSS :

.entry-content.excerpt {
  color: white;
}

Hope it helps.

[Yawarundi]

No, that changed the color of the excerpts in the blog. I need to change the color of the text in the post slider. Thank you.

[Thai]

Hi There,

Sorry for the confusion.

Try following CSS instead:

span.featured-excerpt {
    color: #fff;
}

Hope it helps.

[Yawarundi]

Perfect, thank you. Case closed.

[Thai]

You’re most welcome.

[Yawarundi]

No, I am sorry but there is an effect that I didn’t realize: now the pictures in the post slider apear low res and moved. It was perfect before. Any idea about what happened?

[Zeshan]

Hi there,

This is because the slider is now 100% wide. As some of the background images in the slider are only 800×600 pixels, this causes distortion. I’d advise not to stretch the slider 100% and instead show it in its default size as shown in the Ethos 01 demo.

Thanks!

[Yawarundi]

I have reduced the slider to its previous size. The problem is still there: pics are low res and not showing up properly. It was perfect prior to the changes. What is happening?

Thank you

http://www.allpachaski.com

[Zeshan]

Hi there,

The reason of this behaviour is that the images are set as background on post slider’s slides. To ensure that images expand vertically and horizontally without loosing the proportions, a css property of background-size: cover is applied to the container/slide. This sometimes leads a background image getting cut-off from edges of its container.

If you want to show full without loosing its proportions, you can add following code under Custom > CSS in the Customizer, though it might leave some blank areas to the sides of the image (see: http://prntscr.com/7kt23a):

.x-post-slider-entry {
   -webkit-background-size: contain !important;
   background-size: contain !important;
}

Thanks!

[Yawarundi]

No, that is not acceptable. And I insist, the images where perfect before we started these changes. Is there any way we could improve this?

[Author]

Posts