Docs

[anthony2483]

I’ve tried following some posted examples to add the read more link to post excerpts but I don’t know what I’m missing.

I’ve installed the child theme.
Currently using the ethos stack.

Which .php file am I supposed to copy and what code should I add?

Thanks

[Darshana]

Hi there,

Thanks for writing in! 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.

Then add the following code into your child theme’s functions.php file.

function x_shortcode_recent_posts_v2code( $atts ) {
  extract( shortcode_atts( array(
    'id'          => '',
    'class'       => '',
    'style'       => '',
    'type'        => '',
    'count'       => '',
    'category'    => '',
    'enable_excerpt' => '',
    'offset'      => '',
    'orientation' => '',
    'no_image'    => '',
    'fade'        => ''
  ), $atts ) );

  $id            = ( $id          != ''          ) ? 'id="' . esc_attr( $id ) . '"' : '';
  $class         = ( $class       != ''          ) ? 'x-recent-posts cf ' . esc_attr( $class ) : 'x-recent-posts cf';
  $style         = ( $style       != ''          ) ? 'style="' . $style . '"' : '';
  $type          = ( $type        == 'portfolio' ) ? 'x-portfolio' : 'post';
  $count         = ( $count       != ''          ) ? $count : 3;
  $category      = ( $category    != ''          ) ? $category : '';
  $category_type = ( $type        == 'post'      ) ? 'category_name' : 'portfolio-category';
  $offset        = ( $offset      != ''          ) ? $offset : 0;
  $orientation   = ( $orientation != ''          ) ? ' ' . $orientation : ' horizontal';
  $no_image      = ( $no_image    == 'true'      ) ? $no_image : '';
  $fade          = ( $fade        == 'true'      ) ? $fade : 'false';
  $enable_excerpt = ( $enable_excerpt == 'true'      ) ? true : false;

  $output = "<div {$id} class=\"{$class}{$orientation}\" {$style} data-fade=\"{$fade}\">";

    $q = new WP_Query( array(
      'orderby'          => 'date',
      'post_type'        => "{$type}",
      'posts_per_page'   => "{$count}",
      'offset'           => "{$offset}",
      "{$category_type}" => "{$category}"
    ) );

    if ( $q->have_posts() ) : while ( $q->have_posts() ) : $q->the_post();

      if ( $no_image == 'true' ) {
        $image_output       = '';
        $image_output_class = 'no-image';
      } else {
        $image_output       = '<div class="x-recent-posts-img">' . get_the_post_thumbnail( get_the_ID(), 'entry-' . get_theme_mod( 'x_stack' ) . '-cropped', NULL ) . '</div>';
        $image_output_class = 'with-image';
      }

      $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ) . '">'
                 . '<article id="post-' . get_the_ID() . '" class="' . implode( ' ', get_post_class() ) . '">'
                   . '<div class="entry-wrap">'
                     . $image_output
                     . '<div class="x-recent-posts-content">'
                       . '<h3 class="h-recent-posts">' . get_the_title() . '</h3></a>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . ( $enable_excerpt ? '<span class="x-recent-posts-excerpt">' . strip_tags( get_the_excerpt() ) . '</span>' : '' )
                       . ' ... <a href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ) . '">'
                       . 'Read More </a>'
                     . '</div>'
                   . '</div>'
                 . '</article>';
               
    endwhile; endif; wp_reset_postdata();
  
  $output .= '</div>';

  return $output;
}

add_action('wp_head', 'change_recent_posts_to_v2');

function change_recent_posts_to_v2() {
  remove_shortcode( 'recent_posts' );
  add_shortcode( 'recent_posts', 'x_shortcode_recent_posts_v2code' );
}

Then you can use the shorcode as follows with the parameter (enable_excerpt="true").

[recent_posts type="post" enable_excerpt="true" count="4" orientation="vertical"]

Hope that helps.

[anthony2483]

Maybe I didn’t explain things well. What I’m looking to do is on my blog posts pages the listed posts have a snippet or excerpt from the full post which currently get cut off with … . I’d like to replace this … with a read more link instead. I don’t think I should have to use the shortcode method you describe in this situation.

Based on searching for similar request I have already setup my child theme and I have read the knowledge base article you linked but the posted code in other forum posts didn’t work for me. I’m sure I’m doing something wrong but just to clarify when you say to add the code to functions.php this is the functions.php within the themes\x-child folder? Do I first copy the functions.php from the themes\x folder? Or should I have a functions.php within my themes\x-child\framework\views\ethos folder?

[Christian]

Sorry for the confusion. Please add the code below in your functions.php

function remove_x_excerpt_string() {
  remove_filter( 'excerpt_more', 'x_excerpt_string' );
}

add_filter('after_setup_theme', 'remove_x_excerpt_string');

function new_excerpt_more($more) {
  global $post;
  return ' ... <div><a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a></div>';
}

add_filter('excerpt_more', 'new_excerpt_more');

Hope that helps. 🙂

[anthony2483]

I will give that a shot but…

when you say to add the code to functions.php is this the functions.php within the themes\x-child folder? Do I first copy the functions.php from the themes\x folder? Or should I have a functions.php within my themes\x-child\framework\views\ethos folder?

[Darshana]

Hi there,

It is the functions.php file which is located under “/x-child/functions.php“. You don’t have to copy the functions file from your parent theme. Just edit the file in child theme and add the code.

Hope that’s clear.

[anthony2483]

Great! Got it

Actually, can you help me figure out how to append the read more link after the … instead of below?

[Christian]

Try changing the line

return ' ... <div><a href="' . get_permalink() . '" class="more-link">' . __( 'Read More', '__x__' ) . '</a></div>';

to

return ' ... <a href="' . get_permalink() . '">' . __( 'Read More', '__x__' ) . '</a>';

Thanks.

[anthony2483]

Awesome, thank you very much

[Rahul]

Glad we could help you.

If you have anything else, let us know. We’d be happy to assist you with everything.

Thanks for using X.

[Joao]

Hi There,

Glad to hear we managed to help.

Joao

[anthony2483]

Could I get some help tweaking this so that it will also display the same read more link if I use the custom excerpt field from the post page. Right now if that field is filled the read more link is missing.

Thanks

[Friech]

Hi There,

Regretfully, at this time I am not entirely certain of the issue. Please provide us with a little more clarification.

Thanks.

[anthony2483]

Currently on my blog index page the blog post show an excerpt which I can define the length of through the customizer. After the excerpt a read more link is added. All of this is working as expected.

My issue is that if I define a custom excerpt using the excerpt field on the wordpress blog page editor the excerpt shows correctly but I’m missing the same read more link after it.

[anthony2483]

This reply has been marked as private.

[Author]

Posts