Docs

[paratusgc]

Hi Guys,

Happy Christmas! Unfortunately some of us are still working!

Please could someone advise how I could style the layout of my blog page like the attached custom layout I have created. Is this possible in the native x theme or does it require additional custom plugins to create such a layout? I have show 2 posts examples, but additional posts would run down the page.

Thanks
Gavin

[Christopher]

Hi there,

Please switch to Ethos stack.

Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Add following code in child theme’s functions.php file :

function display_meta() { ?>
<?php if ( !is_single() ) : ?>
    <?php  x_ethos_entry_meta(); ?>
<?php endif; ?>
 <?php }
add_action( 'x_after_the_excerpt_end', 'display_meta', 10 );

Copy _content-post-header.php from framework/views/ethos and put it in the same path inside child theme, replace existing code with following :

<?php

// =============================================================================
// VIEWS/ETHOS/_CONTENT-POST-HEADER.PHP
// -----------------------------------------------------------------------------
// Standard <header> output for various posts.
// =============================================================================

?>

<header class="entry-header">
  <?php if ( is_single() ) : ?>
    <?php x_entry_navigation(); ?>
    <h1 class="entry-title"><?php the_title(); ?></h1>
  <?php else : ?>
    	<?php if ( has_tag() ) : ?>
  <footer class="entry-footer cf">
    <?php echo get_the_tag_list( '<p><i class="x-icon-tags" data-x-icon=""></i> Tags: ', ', ', '</p>' ); ?>
  </footer>
<?php endif; ?>
    <h2 class="entry-title">
      <a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ); ?>"><?php x_the_alternate_title(); ?></a>
    </h2>
  <?php endif; ?>
  <?php if ( is_single() ) : ?>
  <?php x_ethos_entry_meta(); ?>
<?php endif; ?>
</header>

Hope it helps.

[paratusgc]

Brill. will give it a go and let you know.

Thanks very much – I didn’t think it was possible!!!

Gavin

[Paul R]

You’re welcome! 🙂

[paratusgc]

Hi Christopher,

Thanks again for taking the time to write back to me.

Just a quick question. I have installed the Child Theme and have changed to Ethos stack – however the styling of some parts of my header and footer have changed. I would prefer if the styling of the header and footer remained the same as the Renew stack.

See attached for a screenshot of the styling changes I am talking about.

Before I continue with the template amendments I wanted to ask if this was at all possible?

Many thanks,
Gavin

[Joao]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[paratusgc]

This reply has been marked as private.

[Nabeel A]

Hi again,

1. For header, try adding the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:

.x-navbar .desktop .x-nav>li:first-child>a {
    border-left: none !important;
}
.x-navbar .desktop .x-nav>li>a {
    border-right: none !important;
}

2. Each stack has it’s own design and layout, it might not be possible to take some features from any stack and use it in other stack.

Thank you for understanding!

[Author]

Posts