Docs

[BEAT]

Hi, guys.

I’ve been trying to find a way to modify the post’s template (tried a few solutions you provided on the forum) in order make this possilbe, but I didn’t succeed.

What I want is a mix bettween the full width and archive’s templates (as you can see in the little mockeup attached). I guess the solutions is modify the layout and “widgetize” it… as I said I tried different options without any luck.

Wish you can help me.

Regards.
b.

[Nabeel A]

Hi there,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[BEAT]

This reply has been marked as private.

[Friech]

Hi There,

Thanks for the credentials. But would you mind providing us with a little more clarification of what you’re trying to do? Sorry, the mockup above does not explain much. (a link to a similar example site would be very helpful)

We’ll be happy to provide you with a better response once we have a better understanding of the situation.

Thanks.

[BEAT]

Ok.

I’d like to change the post template in order to show ans structure similar to the one in the mockup. I can do it using cornerstone in a page or post, i know, but i’d like it being automatic (a layout that will lets editors create news without having to use a cornestone template).

Using the post layout options I can pick between fullwidth or a post with a sidebar, sadly none of them work as i want:

– Fullwidth won’t let me add a sidebar but shows the image on the top as i want (width: 100%): http://demo.theme.co/ethos-1/mens-fashion-101/

– When swithching to Global Layout > Content Left, Sidebar Right the sidebar appears (dividing the layout in two blocks) forcing the image on top going smaller (like width: 70%): http://demo.theme.co/ethos-1/these-shoes-were-made-for-walking/

What i want is a mix between both (as shown in the mockup):

– Image on top displaying fullwidth
– Content below showing in two blocks (text: 70%, sidebar: 90%)

Somehow like this: http://demo.theme.co/ethos-1/category/fashion/

So, making it short, I’d like to modify the single-post php file to make it possible to look like the category-archive.

🙂

[Rad]

Hi there,

You mean the slider on top of them? That’s possible in ethos stack and there is no need for template editing. Or do you wish to place another template above it? Should it be manually added on top through templates? Or do you have shortcodes?

I understand what you need to implement, but it’s quite confusing since you want to edit the templates. And I’m not sure what else you need to put there. Would you mind providing more details on how you should put the top full width?

Thanks!

[BEAT]

Nope. I just used the category page as a layout´s example. I don’t know if it´s a way to do it on the single post pages without making template changes… That would be awesome.

Either ways, what i want are post pages (so when my client creates a new post he doesn´t have to make any extra configuration) with the layout that follows:

TOP PAGE:
– Full width image: As it’s a post the media resource comes from the Featured Image.

BELOW IMAGE, TWO CONTAINERS:
– 70% width container: Normal posts structure (Title / Meta / Content)
– 30% width container: Sidebar / Widget area

[Friech]

Hi There,

Thank you for the clarification. On your child theme, navigate to this directory: \x-child\framework\views\ethos. Create a file named wp-single.php there and paste the code below on that file.

<?php

// =============================================================================
// VIEWS/ETHOS/WP-SINGLE.PHP
// -----------------------------------------------------------------------------
// Single post output for Ethos.
// =============================================================================

$fullwidth = get_post_meta( get_the_ID(), '_x_post_layout', true );

?>

<?php get_header(); ?>
  
  <div class="x-container max width main">
    <div class="offset cf">
    <div class="custom-featured-image"><?php x_featured_image(); ?></div>
      <div class="<?php x_main_content_class(); ?>" role="main">

        <?php while ( have_posts() ) : the_post(); ?>
          <?php x_get_view( 'ethos', 'content', get_post_format() ); ?>
          <?php x_get_view( 'global', '_comments-template' ); ?>
        <?php endwhile; ?>

      </div>

      <?php if ( $fullwidth != 'on' ) : ?>
        <?php get_sidebar(); ?>
      <?php endif; ?>

    </div>
  </div>

<?php get_footer(); ?>

Then add this on your custom CSS on Customizer.

.single-post .entry-featured {display: none;}
.custom-featured-image .entry-thumb img {
	width: 100%;
	margin-bottom: 40px;
}

Hope it helps, Cheers!

[BEAT]

Thank you! I’m testing it and works like a charm, so far.

🙂

[Rahul]

Glad it worked for you!

Let us know if you have anything further to ask. We’d be happy to assist you with everything.

Thank You.

[Author]

Posts