Custom Post Type UI single post type styling to match Ethos

[Raychill]

Hi there,

I know Themeco does not support customizations, but I’m sure there is a simple/quick solution that I’m just not seeing.

I’m using Custom Post Type UI to create a “Podcast” post type.

It is displaying, but not formatted the same way as the rest of the posts.

As per some other advice elsewhere, I created a wp-single_podcast.php and single_podcast.php in both the Child Theme and the regular Pro theme (trying all options). The wp-single_podcast.php I put under the Ethos theme (I’m using Ethos).

I’m doing all kinds of combos to get it to work, but nothing seems to make the post display like the others.

What it looks like as a single post
You can see the formatting is missing the previous and next arrows, as well as the spacing between the header and the “previous”/“next” arrow in Ethos

What it looks like with the rest of the blogs (showing meta, when the others do not)

What a normal post looks like

Can someone point me in the right direction?

[christopher]

Hi @RachelDi,

Unfortunately, it is not possible to have a 100% view like the Ethos posts without a great deal of customization and CSS styling which is as you mentioned outside of our support scope.

The idea of adding the single and archive PHP files for the custom post type is a correct one and I guess if you use the content of file below as a starting point you will have an easier path to customization:

wp-content/themes/pro/framework/views/ethos/wp-single.php

For the archive page you can use the content of file below as a starting point:

wp-content/themes/pro/framework/views/ethos/wp-index.php

Please consider that the method above is only a starter and you will need to customize the look and feel and maybe more PHP code to make it work and you will need a developer to do the customization.

Thank you for your understanding.

[Raychill]

Thanks for this, it’s a really good start. I can do the css no problem, just didn’t want to hack it that way if there was something more efficient.

What makes the previous/next arrows appear? Is there something I can add to get those previous/next arrows to show up like in Ethos on the new post type?

I also noticed that the blog posts before and after the custom post type doesn’t have the custom post registered. For example, if I have blogs

1, 2, 3, 4, … etc

Where “1” is the new post type but still appearing on the blog page with the other blog posts, “2” does not show a ‘previous’ arrow to go to “1”. It’s like it’s disconnected from the rest of them. Is there an additional PHP file I should reference to make sure the new post type is in sequence with the rest?

[ruenel]

Hello @RachelDi,

Thanks for the updates.

The Next and Previous arrows were built in the theme. It is loaded using this PHP function code:

// Entry Navigation
// =============================================================================

if ( ! function_exists( 'x_entry_navigation' ) ) :
  function x_entry_navigation() {

  $stack = x_get_stack();

  if ( $stack == 'ethos' ) {
    $left_icon  = '<i class="x-icon-chevron-left" data-x-icon-s="&#xf053;"></i>';
    $right_icon = '<i class="x-icon-chevron-right" data-x-icon-s="&#xf054;"></i>';
  } else {
    $left_icon  = '<i class="x-icon-arrow-left" data-x-icon-s="&#xf060;"></i>';
    $right_icon = '<i class="x-icon-arrow-right" data-x-icon-s="&#xf061;"></i>';
  }

  $is_ltr    = ! is_rtl();
  $prev_post = get_adjacent_post( false, '', false );
  $next_post = get_adjacent_post( false, '', true );
  $prev_icon = ( $is_ltr ) ? $left_icon : $right_icon;
  $next_icon = ( $is_ltr ) ? $right_icon : $left_icon;

  ?>

  <div class="x-nav-articles">

    <?php if ( $prev_post ) : ?>
      <a href="<?php echo get_permalink( $prev_post ); ?>" title="<?php __( 'Previous Post', '__x__' ); ?>" class="prev">
        <?php echo $prev_icon; ?>
      </a>
    <?php endif; ?>

    <?php if ( $next_post ) : ?>
      <a href="<?php echo get_permalink( $next_post ); ?>" title="<?php __( 'Next Post', '__x__' ); ?>" class="next">
        <?php echo $next_icon; ?>
      </a>
    <?php endif; ?>

  </div>

  <?php

  }
endif;

This function were exclusively used within Ethos stack only.

Meanwhile, the blog index will display all the posts. It will not include your custom post types. If you have modified your child theme, then maybe that is why the custom post types mixed up with the blog posts. To better assist you with your issue, kindly provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/docs/getting-support

Best Regards.