Docs

[flysocal]

In ethos, and when looking at a specific post, is it possible to have the title of the next post and previous post listed on either side of the Back / Forward buttons?

Or… maybe move the buttons to the bottom of the post for more room to include the titles of the Back / Forward posts.

Thanks

[Darshana]

Hi there,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks~

[flysocal]

From the screenshot, you can see that in this blog post, the back/forward buttons are on the bottom of the post. First off, that’s what I’m after. Also, next to the blog posts you can see the title of the next and previous post. Most likely sorted by logical date.

Thanks,

[Rupok]

Hey there,

Thanks for writing back! Regretfully, this particular customization request is outside the scope of our support as this is not related to an issue with the theme and instead has to do with your customization of it. As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.

[flysocal]

If I find a modification or plug-in for WordPress, would it override the theme to allow the modification?

Thank you for your response.

[Joao]

Hi There,

You would need to test it we cannot guarantee compatibility with all the plugins available.

Test it and let us know how it goes, if it needs a small fix we can try to help you.

You might also consult our Facebook Group X Theme Users for suggestion, the group counts with 7800+ users.

https://www.facebook.com/groups/xthemeusers/

Hope that helps,

Joao

[flysocal]

I attempted to modify the wp-single.php in the X-Child ethos folder with the following, but it didn’t work. Do I need to disable the current ethos back/forward navigation button first?

// ATTEMPT AT NEW BACK FORWARD BUTTONS

<div class=”navigation”>
<div class=”alignleft”>
<?php previous_post_link(‘« « %’, ”, ‘yes’); ?>
</div>
<div class=”alignright”>
<?php next_post_link(‘% » » ‘, ”, ‘yes’); ?>
</div>
</div> <!– end navigation –>

[John Ezra]

Hi there,

Thanks for updating the thread! Please check if your directory structure on your child is the same as the main X theme. If it isn’t it won’t work.

This is from the main X theme:
/wp-content/themes/x/framework/views/ethos/wp-single.php

Your child theme folder structure should match above like this:

/wp-content/themes/x-child/framework/views/ethos/wp-single.php

Let us know how that goes. Hope this helps – thanks!

[flysocal]

Thank you for responding.

Yes, I have verified that it is in the child theme path that you described above
There is still a copy in the parent path. Is this ok?

When I previously attempted the code above, I just copied the .php file from the parent path, modified it with the code above, and placed a copy in the child path?

If this is correct, should the code above work?

Thanks,

[Rue Nel]

Hello There,

To do this the right way, since you have your child theme active and ready, please follow the following steps below:
1] Using Notepad or TextEdit or Sublime Text or any text editor, please create a new file in your local machine.
2] Insert the following code into that new 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="<?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' ); ?>

          <!-- // ATTEMPT AT NEW BACK FORWARD BUTTONS -->

          <div class="navigation">
            <div class="alignleft">
              <?php previous_post_link('« « %link'); ?>
            </div>
            <div class="alignright">
              <?php next_post_link('%link » » '); ?>
            </div>
          </div> 
          <!-- end navigation -->

        <?php endwhile; ?>

        

      </div>

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

    </div>
  </div>

<?php get_footer(); ?>

3] Save the file named as wp-single.php
4] Upload this file to your server in the child theme’s folder
wp-content/themes/x-child/framework/views/ethos/

Hope this helps.

[flysocal]

The solution provided is very close with the exception of 3 things.
1. I’d like the font for the back/forward post name to be 1 or 2 pts larger.
2. Instead of arrows pointing back and forward… I’m seeing triangles with “?” marks inside.
3. Is it possible to move these back/forward buttons up to right below the post… and above the “Share this… and comment section?

Also… when we get this working correctly… is it possible with ethos to “not” display the standard back/forward buttons on the top right of the post?

Thank you!

[Rue Nel]

Hello There,

Thanks for the updates!

1] To make the font size larger, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.x-main .navigation {
    font-size: 18px;
}

2] Please have your code updated. Get the raw code here (http://pastebin.com/ynD4qWtC) to preserver the data-x-icon

3] To move these back/forward buttons up to right below the post… and above the “Share this… , please add the following JS code in the customizer, Appearance > Customize > Custom > Javascript

(function($){
  $('.single-post .navigation').insertBefore( $('.sharedaddy') );
})(jQuery);

4] Inorder not to display the standard back/forward buttons, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.site .x-nav-articles {
    display: none;
}

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

[flysocal]

Brilliant! You got it perfectly. It just makes sense to have the back/forward buttons near the bottom… on a blog anyway.

Thanks again!

[Christian]

You’re welcome. Glad we could help. 🙂

[Author]

Posts