Docs

[sergiopontoriero]

Hello, I need to change the order of recent posts and concerts in my pages “Concerti” (= Tour) and “News”.

Basically I want the posts listed in “Concerti” page from the closest date to the furthest in the future (and after a date has passed,it should be deleted… what can I do?), while instead in my “News page” it should be exactly the opposite: the most recent news before the oldest.

I have installed a plugin (“Default sort ascend”) to reverse the order of recent posts (ascending) in all pages, because I need the “Recent posts” block to be ascending in my home page after “Concerti” headline, where I list our next concerts. But in the dedicated pages it should be like described above.

Can you help me?

[sergiopontoriero]

This reply has been marked as private.

[Rad]

Hi there,

Thanks for posting in.

What do you mean by most recent post before the oldest?

The newest date down to oldest is DESC, while oldest to newest date is ASC. If you wish to set the most recent post before the oldest then it’s DESC. And it’s the default sorting order of recent post, which means, you didn’t need to change it.

It’s a bit confusing working with dates 🙂

As for the “Concerti”, please add this code to your child theme’s functions.php

function pre_get_category_date_range( $query ) {
    if ( is_category( 2 ) ) {
        add_filter( 'posts_where', 'filter_by_date_range' );
    }
    return $query;
}

add_filter( 'pre_get_posts', 'pre_get_category_date_range' );

function filter_by_date_range ( $where ) {
       $where .= " AND post_date >= '".date("Y-m-d H:i:s", strtotime("-30 days") )."'"; return $where;
}

This will skip posts older than 30 days, but display posts in the range of 30days.

Thanks!

[sergiopontoriero]

Ehm… we are using X theme as it is… what is a child Theme?
where do I find the functions.php? in the editor? Thanks again!!

[Christopher]

Hi there,

I’m sorry for not being clear enough.

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.

Hope it helps.

[sergiopontoriero]

Ah, ok, thank you. Meanwhile I have added your code to functions.php without creating any child theme…. I’m not a coder and I’m afraid it can be too complex for me 🙂
We’ll ask an expert.
After pasting your code, I noticed that the “Concerti” page now only displays future concerts and not the past ones.
But what about the “recent dates” in the home page? see screenshot.
They still display past concerts in ASC mode… how can I have concert dates displayed in the correct order (from the closest date to the most distant in the future)?

[sergiopontoriero]

I have downloaded the child Theme as you suggest in your tutorial, but before installing it, I need to know if by activating the child theme I will loose all the custom CSS I added to my theme so far.
Thank you!

[Rupok]

Hi there,

Thanks for writing back. You must use Child Theme to place such code because you should not edit the parent theme as it will be wiped out on update. Installing Child Theme won’t affect your Customizer settings or Custom CSS/JS. You can still keep a backup of your Customizer settings from X Addons Menu > Customizer Manager.

Cheers!

[sergiopontoriero]

Ok, thank you.
I downloaded the XCS file from the customizer manager. So if I will update the them ein the future, I just need to re-import the XCS file I just downloaded and all my customizatin made through CSS of each page, + what I added in the functions.php file of the child theme will still be saved and available?
thanks again
Diana

[sergiopontoriero]

One last thing about the concerts display mode:
But what about the “recent dates” in the home page? see screenshot.
They still display past concerts in ASC mode… how can I have concert dates displayed in the correct order (from the closest date to the most distant in the future)?

[Rue Nel]

Hello There,

Thanks for updating in! The XCS file contains all the customizer settings. You can always save a backup copy so that you can re import these settings when you activate a child theme or after any theme updates to make sure that you’ll have the same settings as your previous save settings.

And to modify the order of you recent posts when it is “Concert”, please add the following code in your child theme’s functions.php file

// Custom Recent Posts
// =============================================================================

function custom_x_shortcode_recent_posts( $atts ) {
  extract( shortcode_atts( array(
    'id'           => '',
    'class'        => '',
    'style'        => '',
    'type'         => 'post',
    'count'        => '',
    'category'     => '',
    'offset'       => '',
    'orientation'  => '',
    // 'show_excerpt' => 'true',
    'no_sticky'    => '',
    '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';
  // $show_excerpt  = ( $show_excerpt == 'true' );
  $no_sticky     = ( $no_sticky    == 'true' );
  $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}\" >";

  	if ( $category == 'concerti' ) {
  		$q = new WP_Query( array(
  		  'order'				=> 'ASC',
	      'orderby'             => 'date',
	      'post_type'           => "{$type}",
	      'posts_per_page'      => "{$count}",
	      'offset'              => "{$offset}",
	      "{$category_type}"    => "{$category}",
	      'ignore_sticky_posts' => $no_sticky
	    ) );
  	} else {
  		$q = new WP_Query( array(
	      'orderby'             => 'date',
	      'post_type'           => "{$type}",
	      'posts_per_page'      => "{$count}",
	      'offset'              => "{$offset}",
	      "{$category_type}"    => "{$category}",
	      'ignore_sticky_posts' => $no_sticky
	    ) );
  	}

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

      // $excerpt = ( $show_excerpt ) ? '<div class="x-recent-posts-excerpt"><p>' . preg_replace('/<a.*?more-link.*?<\/a>/', '', cs_get_raw_excerpt() ) . '</p></div>' : '';

      $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', 'cornerstone' ), 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>'
                       // . $excerpt
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    endwhile; endif; wp_reset_postdata();

  $output .= '</div>';

  return $output;
}

add_action('init', 'change_recent_posts_to_custom');
function change_recent_posts_to_custom() {
  remove_shortcode( 'x_recent_posts' );
  add_shortcode( 'x_recent_posts', 'custom_x_shortcode_recent_posts' );
}
// =============================================================================

Please keep in mind that will will not work if the child theme is not active. We highly recommend that you use a child theme so that all your modifications will not be overwritten when there is X theme updates.

Hope this helps.

[sergiopontoriero]

Hello, I did everything you told me (child theme installation, customizer settings backup and reset after child theme installation, pasted your code above in the functions.php file) but nothing changed. Can you please tell me how can I have the next concerts (from the closest to the most far in time) displayed properly (now they’re in reverse order) in the “Concerti” area of the Home page (www.iluf.net, see screenshot)?
THANK YOU!!

[Rad]

Hi there,

It should be concerti and not CONCERTI, it’s case sensitive. I went ahead and changed the category filter in your home page’s recent post.

And you’ll have to update the Rue’s code to this

// Custom Recent Posts
// =============================================================================

function custom_x_shortcode_recent_posts( $atts ) {
  extract( shortcode_atts( array(
    'id'           => '',
    'class'        => '',
    'style'        => '',
    'type'         => 'post',
    'count'        => '',
    'category'     => '',
    'offset'       => '',
    'orientation'  => '',
    // 'show_excerpt' => 'true',
    'no_sticky'    => '',
    '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';
  // $show_excerpt  = ( $show_excerpt == 'true' );
  $no_sticky     = ( $no_sticky    == 'true' );
  $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}\" >";
        

  	if ( $category == 'concerti' ) {

            add_filter( 'posts_where', 'filter_by_date_range' );

  		$q = new WP_Query( array(
  		  'order'				=> 'ASC',
	      'orderby'             => 'date',
	      'post_type'           => "{$type}",
	      'posts_per_page'      => "{$count}",
	      'offset'              => "{$offset}",
	      "{$category_type}"    => "{$category}",
	      'ignore_sticky_posts' => $no_sticky
	    ) );
           
            remove_filter( 'posts_where', 'filter_by_date_range' );

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

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

      // $excerpt = ( $show_excerpt ) ? '<div class="x-recent-posts-excerpt"><p>' . preg_replace('/<a.*?more-link.*?<\/a>/', '', cs_get_raw_excerpt() ) . '</p></div>' : '';

      $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink to: "%s"', 'cornerstone' ), 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>'
                       // . $excerpt
                     . '</div>'
                   . '</div>'
                 . '</article>'
               . '</a>';

    endwhile; endif; wp_reset_postdata();

  $output .= '</div>';

  return $output;
}

add_action('init', 'change_recent_posts_to_custom');
function change_recent_posts_to_custom() {
  remove_shortcode( 'x_recent_posts' );
  add_shortcode( 'x_recent_posts', 'custom_x_shortcode_recent_posts' );
}
// =============================================================================

Cheers!

[sergiopontoriero]

Thank you! Now it seems like working!
But: how can we only display in the home page not ALL concerts, but just the upcoming ones (now I can see concerts that have already been done in January and February…).
Also, what do you mean by “Rue’s code”? What is it? Where do I have to paste the code you pasted above?
Thank you Rad, you’re super!
(X support is SUPER too!)

[Rad]

Hi there,

With the code provided at #1359065, you have to replace it with the code that I just provided. But don’t do that, I think you should use events manager. Instead of using posts as your events post. WordPress will not display posts dated in the future(eg. scheduled post). Hence, if you will not display post that already happened and WordPress will not display future post, then it will be zero posts. The standard post has only one date, and it’s the publishing date.

You should use events manager instead, because it has event date different than publishing date ( 2 dates ).

Thanks.

[Author]

Posts