Navigation
Archive / Adding excerpt to recent posts (Page 2)
This is archived content. Visit our new forum.
1 2 3 4 5
  • Author
    Posts
  • September 1, 2014 at 2:48 pm #96446
    Innovata
    Participant
    This reply has been marked as private.
    September 1, 2014 at 10:09 pm #96652
    Paul R
    Moderator

    Hi Innovata,

    Thank you for providing the login details.

    Can you try this code.

    This goes to functions.php of the child theme.

    
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>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . ( $enable_excerpt ? '<span class="x-recent-posts-excerpt">' .  str_replace('Read More',"",strip_tags(get_the_excerpt()))  . '</span><div class="xreadmore">Read more</div>' : '' )
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    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' );
}

    To change the color of read more.

    You can add this under Custom > CSS in the Customizer.

    
.xreadmore {
     color:red;  /* change color */
     text-align:center; /* to center */
}

    Then in your Homepage

    
[recent_posts enable_excerpt="true" type="post" orientation="horizontal" no_image="true"]

    Just include the category.

    Cheers!

    September 2, 2014 at 3:19 am #96738
    Innovata
    Participant

    Hello,

    Thanks! We are almost there. The excerpts are showing fine now, but 2 more questions:

    – There are now two ‘read more’ links in the excerpts on the homepage. ‘Lees verder’ is one and ‘read more’ is the second. How do I disable the ‘Lees verder’ from the excerpt (only on the homepage / recent_post shortcode)?

    – The excerpts differ from lenght. How do I get those in the same length? Is it possible to use the summary or do I have to change the max. words or characters of the excerpt? Where is this setting?

    I appreciate your help and quick responses!

    September 2, 2014 at 4:32 am #96756
    Paul R
    Moderator

    Hi Innovata,

    Sorry about that.

    Please replace the code in functions.php with the code below.

    
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>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . ( $enable_excerpt ? '<span class="x-recent-posts-excerpt">' .  substr(str_replace('Lees verder',"",strip_tags(get_the_excerpt())),0,150)  . '</span><div class="xreadmore">Lees verder</div>' : '' )
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    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' );
}

Thanks
    September 2, 2014 at 4:34 am #96757
    Playrom
    Participant

    hello,
    i want to display more than 4 recents posts, how can i do?

    and in vertical mode i want to display the feautured image on the left and the excerpt on the right
    i have changed css and now the layout is correct, but when i go over the posts it returns to the original mode, what css i had to change?
    this is my css

    .x-recent-posts article.hentry>.entry-wrap{
	float:left;
	position:relative;
	padding:20px;
	width;100%;
}

.x-recent-posts a:hover .x-recent-posts-img, .tp-leftarrow.default:hover, .tp-rightarrow.default:hover {
background-color: #ffd700;
position: relative;
float: left;
margin: 10px;
}

.x-recent-posts .has-post-thumbnail .x-recent-posts-img {
position: relative;
float: left;
width: 33%;
}

.x-recent-posts .x-recent-posts-content {
position: relative;
float: left;
width: 67%;
}

    also when the post lenght is more than the excerpt number of words with this css the “Read More” zone breaks everything!

    September 2, 2014 at 5:33 am #96783
    Innovata
    Participant

    That looks better, but now the excerpt is cut of in the middle of a word. I rather have it cut of after a word. Where do I change this?

    Or is it possible to use the summary as an excerpt?

    September 2, 2014 at 5:49 am #96788
    Paul R
    Moderator

    Hi Innovata,

    Try this code.

    
<?php
    
function word_count($string, $limit){
   $words = explode('',$string);
   return implode('', array_slice($words, 0, $limit));
}

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>'
                       . '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
                       . ( $enable_excerpt ? '<span class="x-recent-posts-excerpt">' .  word_count(str_replace('Lees verder',"",strip_tags(get_the_excerpt())),25)  . '</span><div class="xreadmore">Lees verder</div>' : '' )
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    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' );
}

    Thanks

    September 2, 2014 at 5:50 am #96789
    Paul R
    Moderator

    Hi Playrom,

    Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL as stated on the forum entrance page. 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.

    September 2, 2014 at 5:54 am #96792
    Playrom
    Participant
    This reply has been marked as private.
    September 2, 2014 at 7:18 am #96822
    Playrom
    Participant

    i have the same problem described here
    http://theme.co/x/member/forums/topic/posts-on-homepage-very-small-not-the-whole-post-or-excerpt/#post-96801

    September 2, 2014 at 7:31 am #96834
    Paul R
    Moderator

    Hi,

    I can’t access your site. It returns “Server not found”.

    September 2, 2014 at 7:49 am #96841
    Innovata
    Participant

    Oh no, after adding this code I get this error:

    Parse error: syntax error, unexpected ‘<‘ in /domains/teunvandekeuken.nl/nieuw/wp-content/themes/x-child-renew/functions.php on line 19

    September 2, 2014 at 8:13 am #96859
    Innovata
    Participant
    This reply has been marked as private.
    September 2, 2014 at 8:32 am #96874
    Playrom
    Participant
    This reply has been marked as private.
    September 2, 2014 at 8:36 am #96876
    Paul R
    Moderator

    Hi Innovata,

    Sorry about that, I was able to fix it.
    Please take a look http://nieuw.teunvandekeuken.nl/

    Thanks.

  • Author
    Posts
1 2 3 4 5
  • <script> jQuery(function($){ $("#no-reply-96050 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>