I want to add an excerpt to the recent posts feature. I’ve tried various things in topics I have found here, but nothing works. I followed the instructions in this thread: https://community.theme.co//forums/topic/recent-post-excerpt-and-excerpt-length-cornerstone/ but to no avail.

Then I thought that maybe it’s because I didn’t use a child theme. So I installed a child theme. Now, when I paste the function code into functions.php, everything goes white and I have to re-upload the old functions.php via FTP to make it work again.

Ideally, it would be great to add the option of excerpts to the recent posts element in Cornerstone. But I need a quicker solution. Please help!

Ideally, I’d actually need the option to display the full content, since the posts are going to be rather short.

My info:

URL: http://www.brandsourcery.com
Wordpress Version 4.2.2
Theme Version: 4.0.1
X-Shortcodes Version 3.0.5

I’ll post my login info below, so you can take a look. The news section is on my home page.

Thanks for writing in.

Try adding following PHP code into the functions.php file locates in the child theme’s folder:

// Displaying Excerpt in Recent Posts
// =============================================================================

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

  $allowed_post_types = apply_filters( 'cs_recent_posts_post_types', array( 'post' => 'post' ) );
  $type = ( isset( $allowed_post_types[$type] ) ) ? $allowed_post_types[$type] : 'post';

  $id            = ( $id          != ''          ) ? 'id="' . esc_attr( $id ) . '"' : '';
  $class         = ( $class       != ''          ) ? 'x-recent-posts cf ' . esc_attr( $class ) : 'x-recent-posts cf';
  $style         = ( $style       != ''          ) ? 'style="' . $style . '"' : '';
  $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';

  $js_params = array(
    'fade' => ( $fade == 'true' )
  );

  $data = cs_generate_data_attributes( 'recent_posts', $js_params );

  $output = "<div {$id} class=\"{$class}{$orientation}\" {$style} {$data} 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              = wp_get_attachment_image_src( get_post_thumbnail_id(), 'entry-cropped' );
        $bg_image           = ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
        $image_output       = '<div class="x-recent-posts-img"' . $bg_image . '></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"', csl18n() ), 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>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . '<span class="x-recent-posts-excerpt">' . strip_tags( get_the_excerpt() ) . '</span>'
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    endwhile; endif; wp_reset_postdata();

  $output .= '</div>';

  return $output;
}

add_filter('wp_head', 'custom_recent_posts');

function custom_recent_posts() {
  remove_shortcode( 'x_recent_posts' );

  add_shortcode( 'x_recent_posts', 'x_shortcode_recent_posts_v2' );
}

Let us know how it goes!

I use this line to insert it into my page:

[x_recent_posts type="post" count="3" enable_excerpt="true" 
orientation="horizontal"]

I also tried turning “Full Post Content on Index” on and off again in the Customizer –> Blog settings. That didn’t help either.

I added a new page called ‘X support’ and added recent posts shortcode in there, the excerpt display on Cornerstone but not in the page itself.

Please update X and try again, Also you could try testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Hope it helps.

One (I hope) last question: Now the whole excerpt text is displayed as a link. Is there a way to remove that?

And would it be possible to remove all links from the displayed posts? The posts are meant to be really short and there is no need to link to an extra post page.

Not sure of what are you trying to achieve. Would you mind sharing us more details about it.

Recent post shortcode is wrapped with link. So from images to the texts its a link. If you want to remove the link for the text only for the image and title. That could be a technical coding, it would be best to contact a custom developer for that one. But if you want just to make the text looks like not clickable, Try adding this code below.

a.x-recent-posts-excerpt{
pointer-events:none;
cursor:none;
color:#aaa;
}

Hope it helps.

Thanks.

What I try to achieve is this:

The majority of the content of the site is on the main page. On this page there shall be a section that displays “news” about the company. Those news are rather short, maybe one or two sentences. I want the clients to be able to easily add those news as posts in the back end. It does not make sense to have separate pages for such short news items, so I just want those items displayed as is, with no link and no hover effect.

It should look more or less like this:

I don’t know how better to describe it. Just display the (full) posts, with no link (on the headline, image, text …) whatsoever. No “read more” links either (I know they’re in the image).

—

My next idea would be to go into the x-shortcodes/functions/shortcodes.php file and remove the<a> tag there.

Or maybe I can just copy the whole section and create my own shortcode and call it something else?

I’d prefer a solution that doesn’t need me to customize the system files though.

You can just edit your custom recent post shortcode and remove the link from there. You can not remove a tag because if you do so, it will break the styling. Please try to replace your code with this one instead:

// Displaying Excerpt in Recent Posts
// =============================================================================

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

  $allowed_post_types = apply_filters( 'cs_recent_posts_post_types', array( 'post' => 'post' ) );
  $type = ( isset( $allowed_post_types[$type] ) ) ? $allowed_post_types[$type] : 'post';

  $id            = ( $id          != ''          ) ? 'id="' . esc_attr( $id ) . '"' : '';
  $class         = ( $class       != ''          ) ? 'x-recent-posts cf ' . esc_attr( $class ) : 'x-recent-posts cf';
  $style         = ( $style       != ''          ) ? 'style="' . $style . '"' : '';
  $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';

  $js_params = array(
    'fade' => ( $fade == 'true' )
  );

  $data = cs_generate_data_attributes( 'recent_posts', $js_params );

  $output = "<div {$id} class=\"{$class}{$orientation}\" {$style} {$data} 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              = wp_get_attachment_image_src( get_post_thumbnail_id(), 'entry-cropped' );
        $bg_image           = ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
        $image_output       = '<div class="x-recent-posts-img"' . $bg_image . '></div>';
        $image_output_class = 'with-image';
      }

      $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="#" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', csl18n() ), 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>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . '<span class="x-recent-posts-excerpt">' . strip_tags( get_the_excerpt() ) . '</span>'
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    endwhile; endif; wp_reset_postdata();

  $output .= '</div>';

  return $output;
}

add_filter('wp_head', 'custom_recent_posts');

function custom_recent_posts() {
  remove_shortcode( 'x_recent_posts' );
  add_shortcode( 'x_recent_posts', 'x_shortcode_recent_posts_v2' );
}

We have remove the href="the-link" so that it will not go anywhere. And to remove the link pointer, you also need to add this css code in your customizer, Appearance > Customize > Custom > CSS

.x-recent-posts a{
    cursor: default;
}

And to make sure that the link doesn’t go anywhere, please add the following js code in the customizer, Appearance > Customize > Custom > Javascript

(function($){
  $('.x-recent-posts a').on('click touchstart', function(e){
    e.prevenDefault();
  });
})(jQuery);

Please let us know if this works out for you.

But there are still some problems:

a) Now the excerpt is shown in the live version, but not in Cornerstone.

b) The image still has a rollover effect.

c) There’s still a link, which, granted, doesn’t go to the post, but to the main page instead. So if you happen to click on the article, it reloads the page and goes back to the top.

Do I lose all kind of styling if I remove the <a> tag? Couldn’t I just add my own CSS class to it somehow by replacing the <a> with a <div> tag?