Changing the position of the featured image in ethos correctly

Dear XTheme Support team…

I bought xtheme recently and start using it on my site… formamigliore.it
I need your help to customize the following in ethos theme…

How to change the position of featured image in the posts to be below the article title not above… + decrease the height of it…

I am waiting your support to perform these customization…

Zatari.

Hello @zatarim,

Thanks for asking. :slight_smile:

You can add following JS code in X > Theme Options > JS:

jQuery(".single-post .entry-featured").insertAfter(".single-post .entry-header");

After that add following CSS under X > Theme Options > CSS:

.entry-featured {
    margin-top: 20px !important;
}

.entry-thumb img {
    max-width: 80%;
    margin: 0 auto;
    display: block;
}

Thanks.

Thanks it works… but how could i align the image to the right…

Another question i want to change the background of the website to be white color including the sidebar… you can visit my site at formamigliore.it to get better idea… can you help with the code also…

Best regards

Hello @zatarim,

Thanks for updating the thread. :slight_smile:

Actually there is no need to use code for changing body background. First you need to remove Background Image from X > Theme Options > Background Options > Background Pattern. After that you need to select White color from the color picker from the same section X > Theme Options > Background Options > Background Color. Here is screencast that you can take a look. https://cl.ly/2T1N28213h2u

Thanks.

Thanks for your reply… it works again!

I have few questions and need your help in this also…

1- How do I include a “Read More” or “Continue Reading” link under the excerpt? i use ethos… i try to activate the options to show post meta but it didn’t work…

2- Is there any Option to make the xtheme resize the thumbnails of the excerpts in the home page ?

3- I have a post without featured image… how could i show a default thumbnail image for such posts that i don’t want to assign featured image for?

4- In the top of the page… the word “blog” is invisible how could i change its color to black… and how could i change the word itself from “blog” to site name…

Hello There,

Thanks for updating in!

1.) By default, there is no read more link in Ethos stack. If you want to add it, you will need to modify the excerpt more function. To do that, since the child theme is set up, please add the following code in your child theme’s functions.php file

// Custom Excerpt More String
// =============================================================================

if ( ! function_exists( 'x_excerpt_string' ) ) :
  function x_excerpt_string( $more ) {

    $stack = x_get_stack();

    if ( $stack == 'integrity' ) {
      return ' ... <div><a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a></div>';
    } else if ( $stack == 'renew' ) {
      return ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
    } else if ( $stack == 'icon' ) {
      return ' ...';
    } else if ( $stack == 'ethos' ) {
      return ' ... <a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a>';
    }

  }
  add_filter( 'excerpt_more', 'x_excerpt_string' );
endif;

2.) To change the feature image sizes, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.blog .entry-featured .entry-thumb {
    background-size: contain;
}

3.) By default, when a post does not have a featured image, the featured image content holder will not be displayed. This is also why you will be seeing a fullwidth post item. This request maybe possible with custom development overriding the defaults by modifying the functions and the templates in the theme. Regretfully since this request requires more time for this particular customization it is beyond already the scope of our support. I would highly recommend that you contact a developer familiar with X theme and do this particular customization for you. You must understand that our support only covers getting your site set up, bug fixes and minor cosmetic changes.

4.) You will need to go to X > Theme Options > Typography > Site Links and change the site links/ link hover color from white to black. You can use the color picker to do that. And then go to Pages and edit your “Blog” page. You will need to change the page title from Blog to your Sitename.

Hope this helps. Please let us know how it goes.

Thanks for your reply… for the question I follo the instructions it does not work first if you notice the white link color is for the top navigation and for the breadcrumb I want to change the color of breadcrumb link only… the second thing there is no page named blog in my site pages nor posts I checked and there is no such a page

HI there,

Your home page is also your blog, it doesn’t need a static page. It’s automatic once you set your home page are latest posts index page. Your stack is Ethos which doesn’t display a blog title, what title do you wish to displaye? Maybe it’s possible with hooks.

As for breadcrumbs links, it needs custom CSS since you wish it to be in specific color.

.x-breadcrumbs a {
color: red !important;
}

Please change it to your preferred color.

Thanks!

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