京都大学東南アジア地域研究研究所　情報処理室 > Links > Developed Tools > WordPress Development > List View for Posts

The plugin is the shortcode for comprehensively displaying the list view for pages, posts, custom posts, events for The Event Calendar plugin. The plugin supports the multi language with WPML plugin.

The HTML output templates except for the default template (“li”) continue to be adjusted.

List View for Posts

History

Feb 28, 2023: 1.8 released(Tested up WordPress 6.1 with PHP8.2).
Dec 03, 2020: 1.7 released.
Feb 23, 2020: 1.6 released.
Feb 05, 2020: 1.5 released.
Jul 19, 2019: 1.4 released.
Nov 11, 2017: 1.3 released.
Sep 01, 2017: 1.2 released.
Aug 31, 2017: 1.1 released.
Aug 30, 2017: 1.0 released.
Aug 29, 2017: 1.0 submitted to the public plugin.

Shortcode

[list-view-posts]

The list view on the posts are displayed. The HTML tag is <li> and .

[list-view-posts html_tag=”p”]

The HTML tag can change to and .
4 templates (li, p, dd, lip) are prepared .
If you want to use the original template, please use the hook.

Shortcode options (Version 1.0)

You can use various settings, such as a category view, the view of a custom post type name, a view of a future post, the change of a date format, using the shortcode options. Then, you can specific the display area, such as from 50 item to 100 items.

If WPML plugin is activated, the only current language of the list view is displayed. If you want to specific the language, you can use wpml_lang option. Then, please check “Translate” option on posts, custom post, page, taxonomy in WPML setting. In case of activating WPML plugin, the plugin displays only the data which is turned on “Translate” setting in WPML setting.

[list-view-posts post_type=”post” post_status=”publish” date_format=”Y.m.d” orderbysort=”DESC” max_items=5 page=1 html_tag=”li” html_tag_class=”” enable_view_post_type=”” enable_view_category=”” category_taxonomy=”category” enable_passowrd_protected_post=”” enable_the_event_calendar_events=”” wpml_lang=”” hook_secret_key=”” id=””]

The description in detail is as below:

post_type = Set Post Types. In case of plural settings, separate as comma. Default is “post”.
post_status = Set Post Status.In case of plural settings, separate as comma. Default is “publish”.
date_format = Set date value. Default is “Y.m.d” (= YYYY.MM.DD) . ex. “d/m/Y” = DD/MM/YYYY, “M d, Y” = Aug 29, 2017
orderbysort = Set order by sort for date. Default is “DESC” (descending order). Set “ASC” (ascending order) or “DESC”. If you set other value, “DESC” is set.。
max_items = Set the number of items on list view. Default is 5.
page = Set a page number. Default is 1. ex. page=2 and max_items=50; From 50 to 100 item is displayed.
html_tag = Set a HTML output template. There are 4 templates (li, p, dd, lip). Default is “li”. The template files are in the plugin’s folder/includes/tags/ . If you can use your original template using the hook.
html_tag_class = Set the head of a CSS class. Default is “list-view-posts”. ex. <li class=”list-view-posts “>[Date]<a class=”list-view-posts_link” href=”[Link]”>[Title]</a></li>
enable_view_post_type = Hide / Display a name of a custom post type. Default is empty (Hide). If you set a character, such as “true”,”Display” is set. ex. <li class=”list-view-posts “>[Date]A name of a Custom Post Type<a class=”list-view-post_link” href=”[Link]”>[Title]</a></li>
enable_view_category = Hide / Display a category including a taxonomy. Default is empty (Hide). If you set a character, such as “true”, “Display” is set. If you set plural categories for a post, only first category on each categories is set. ex. <li class=”list-view-posts “>[Date]Category 1 (in the post category)Category 2 (in taxonomy）<a class=”list-view-posts_link” href=”[Link]”>[Title]</a></li> Please keep in mind that the items which is set as Uncategorized or Unclassified category are not displayed.
category_taxonomy = Set a slug of a category (including a taxonomy).In case of plural settings, separate as comma. Default is “category” (Category on Post).
enable_password_protected_post = Hide / Display a password protected post. Default is empty (Hide). If you set a character, such as “true”,”Display” is set.
enable_the_event_calendar_events = In case of activating “The Event Calendar ” plugin, Hide / Display an event on the list view. Default is empty (Hide). If you set a character, such as “true”,”Display” is set. An event category on “The Events Calendar” plugin cannot be displayed even if category_taxsonomy is specified.
wpml_lang = In case of activating WPML plugin, you can display a specific langauge items as this option. Default is empty. Set a language tag in WPML setting (ex. “ja” = Japanese , “en” = English).please check “Translate” option on posts, custom post, page, taxonomy in WPML setting. In case of activating WPML plugin, the plugin displays only the data which is turned on “Translate” setting in WPML setting.
hook_secret_key = It’s for safely using a hook. If you use this plugin’s hook, please set this key and return ‘hook_secrey_key’ in the hook. In detail, please see ‘Hook’ section in this document.
id = Set an unique key for the plugin hooks. If you want to customize the value using a hook each a shortcode, id can use a unique key.

Case Example

Case 1) View of plural categories on a custom post type

Custom Post Type: FAQ (faq)
Taxonomy: Type (faq_type), OS (os)
Post Title: How to rescue the data in Windows.
- Turn on “Troubleshooting” (troubleshooting) in Type (faq_type)
- Turn on “Windows” (windows) in OS (os)

The Shortcode is as below;

[list-view-posts post_type=”faq” post_status=”publish” enable_view_post_type=”true” enable_view_category=”true” category_taxonomy=”faq_type,os”]

Output HTML code is as below;

<li class='list-view-posts_item'>
  <span class='list-view-posts_date'>29/08/2017</span>
  <span class='list-view-posts_post_type'>FAQ</span>
  <span class='list-view-posts_category_troubleshooting'>
     <a class='list-view-posts_category_link_troubleshooting'> href='***/faq_type/troubleshooting/'>Troubleshooting</a>
  </span>
  <span class='list-view-posts_category_windows'>
     <a class='list-view-posts_category_link_windows' href='http://localhost/wordpress-single/os/windows/'>Windows</a>
  </span> 
  <a class='list-view-posts_link' href='****/faq/*****'>How to rescue the data in Windows</a>
</li>

29/08/2017

FAQ

<a class='list-view-posts_category_link_troubleshooting'> href='***/faq_type/troubleshooting/'>Troubleshooting</a>

<a class='list-view-posts_category_link_windows' href='http://localhost/wordpress-single/os/windows/'>Windows</a>

<a class='list-view-posts_link' href='****/faq/*****'>How to rescue the data in Windows</a>

</li>

How to use the Hook

In the following description, the code is set on functions.php in the theme.
To prevent an illegal change, the hook is enabled in case of matching “hook_secret_key” option’s value and “hook_secret_key” return value in the hook.

Arguments which can use on the Hook

The arguments are given as $out_atts .

Set extract($out_atts); code, so you can use the following variables.
A part of variables were changed for easily coding.

Variables on Shortcode options (Default value is the right of “=>”. )
- post_type => array(‘category’) : Changed the values to array.
- post_status => ‘publish’
- date_format => ‘Y.m.d’
- orderbysort => ‘DESC’ : In case of setting up a value except “DESC” or “ASC” is set, “DESC” is set.
- max_items => 5 : If the number 0 or less than 0 is set, 5 is set.
- page => 1
- html_tag => ‘li’
- html_tag_class => ‘list-view-posts’
- enable_view_post_type =>”
- enable_view_category => ”
- category_taxonomy => ‘category’
- enable_the_event_calendar => ”
- enable_password_protected_post => ”
- wpml_lang => ”
- hook_secret_key => ”
- id => ”
Other Variables
- title : Post Title
- link : Post Link
- date : Post Date
- default_post_types => array(‘post’=>’post’, ‘page’=>’page’, ‘attachment’=>’attachment’, ‘revision’=>’revision’, ‘nav_menu_item’=>’nav_menu_item’)
  The variable is used by judging a custom post type or not.

Hook: lvp_each_item

Try to ouput the following HTML template (“lip” template / includes/tags/lip.php).

<li class='list-view-posts_item'>
  <p class='list-view-posts_date'><span>29/08/2019</span></p>
  <p class='list-view-posts_post_type'><span>FAQ</span></p>
  <p class='list-view-posts_category_troubleshooting'>
     <span><a class='list-view-posts_category_link_troubleshooting' href='***/faq_type/troubleshooting/'>Troubleshooting</a></span>
  </p>
  <p class='list-view-posts_category_windows'>
     <span><a class='list-view-posts_category_link_windows' href='***/os/windows/'>Windows</a></span>
  </p> 
  <a class='list-view-posts_link' href='****/faq/*****'>How to rescue the data in Windows</a>
</li>

29/08/2019

FAQ

<a class='list-view-posts_category_link_troubleshooting' href='***/faq_type/troubleshooting/'>Troubleshooting</a>

<a class='list-view-posts_category_link_windows' href='***/os/windows/'>Windows</a>

<a class='list-view-posts_link' href='****/faq/*****'>How to rescue the data in Windows</a>

</li>

Firstly, set “hook_secret_key” option.
Actually, please set complex characters.

[list-view-posts ******* hook_secret_key=”hogehoge” date_format=”d/m/Y”]

Then, add the following code to functions.php in the theme.
Please check return array(‘hook_secret_key’=>’hogehoge‘, ‘data’=>$out_temp); code. ‘hook_secret_key’ value is same as”hook_secret_key” option.
If the values are not matched, the hook is ignored.
Then, the following code is a little complex because of the category processing. If you don’t need to display a category, the coding will be very short.

add_filter( 'lvp_each_item' , 'lvp_each_item_fix' , 10 , 2 );

function lvp_each_item_fix($out, $out_atts){
   extract($out_atts);

$output_category_temp = '';
$output_category_temp_post_type = '';
$output_category_temp_category = '';

if(!empty($enable_view_post_type)):
    if( ! isset($default_post_types[get_post_type_object(get_post_type())->name]) ? $default_post_types[get_post_type_object(get_post_type())->name] : "" ):
        $custom_category_label = esc_html( get_post_type_object(get_post_type())->label );
        $output_category_temp_post_type = "<p class='{$html_tag_class}_post_type'><span>$custom_category_label</span></p>";
    endif;
endif;

if(!empty($enable_view_category)):
    foreach($category_taxonomy as $cat):
        $terms = get_the_terms($post->ID, $cat);
        if($terms && !is_wp_error($terms)):
            $term  = esc_html( isset($terms[0]->name) ? $terms[0]->name : "" ); // Only get first value in the terms.
            $term_slug = esc_attr( isset($terms[0]->slug) ? $terms[0]->slug : "");
            if (strtolower($term) === 'uncategorized'): // 'uncategorized' is ignored.
                 continue;
            endif;
            $term_link = get_term_link($terms[0]);
            $output_category_temp_category .= "<p class='{$html_tag_class}_category_{$term_slug}'>";
            if(!is_wp_error($term_link) && !is_wp_error($term)):
                $output_category_temp_category .= "<span><a class='{$html_tag_class}_category_link_{$term_slug}' href='$term_link'>$term</a></span></p>";
            else:
                $output_category_temp_category .= "<span>$term</span></p>";
            endif;                              
        endif;
    endforeach;
endif;

$output_category_temp = $output_category_temp_post_type . $output_category_temp_category;

$out_temp = <<< ___EOF___
 <li class='{$html_tag_class}_item'><p class='{$html_tag_class}_date'>$date</p>$output_category_temp<a class='{$html_tag_class}_link' href='$link'>$title</a></li>
 
___EOF___;

    return array('hook_secret_key'=>'hogehoge', 'data'=>$out_temp);

}

add_filter( 'lvp_each_item' , 'lvp_each_item_fix' , 10 , 2 );

function lvp_each_item_fix($out, $out_atts){

extract($out_atts);

$output_category_temp = '';

$output_category_temp_post_type = '';

$output_category_temp_category = '';

if(!empty($enable_view_post_type)):

if( ! isset($default_post_types[get_post_type_object(get_post_type())->name]) ? $default_post_types[get_post_type_object(get_post_type())->name] : "" ):

$custom_category_label = esc_html( get_post_type_object(get_post_type())->label );

$output_category_temp_post_type = "$custom_category_label";

endif;

if(!empty($enable_view_category)):

foreach($category_taxonomy as $cat):

$terms = get_the_terms($post->ID, $cat);

if($terms && !is_wp_error($terms)):

$term = esc_html( isset($terms[0]->name) ? $terms[0]->name : "" ); // Only get first value in the terms.

$term_slug = esc_attr( isset($terms[0]->slug) ? $terms[0]->slug : "");

if (strtolower($term) === 'uncategorized'): // 'uncategorized' is ignored.

continue;

endif;

$term_link = get_term_link($terms[0]);

$output_category_temp_category .= "";

if(!is_wp_error($term_link) && !is_wp_error($term)):

$output_category_temp_category .= "<a class='{$html_tag_class}_category_link_{$term_slug}' href='$term_link'>$term</a>";

else:

$output_category_temp_category .= "$term";

endif;

endforeach;

endif;

$output_category_temp = $output_category_temp_post_type . $output_category_temp_category;

$out_temp = <<< ___EOF___

<li class='{$html_tag_class}_item'>$date$output_category_temp<a class='{$html_tag_class}_link' href='$link'>$title</a></li>

___EOF___;

return array('hook_secret_key'=>'hogehoge', 'data'=>$out_temp);

}

If you change the output code each shortcode, use “id” option.

[list-view-posts ” hook_secret_key=”hogehoge” id=1]

[list-view-posts ” hook_secret_key=”hogehoge” id=”case2″]

You want to apply the following hook in case of id is “case2”, the code is as below; (And in case of not displaying a category)

add_filter( 'lvp_each_item' , 'lvp_each_item_fix' , 10 , 2 );

<span id="_mce_caret" data-mce-bogus="true"><code></code><span id="_mce_caret" data-mce-bogus="1"><code data-mce-bogus="1"></code></span></span>
function lvp_each_item_fix($out, $out_atts){
   extract($out_atts);

   if(isset($id) && $id === "case2"):
      $out_temp = <<< ___EOF___
 <li class='{$html_tag_class}_item'><p class='{$html_tag_class}_date'>$date</p>$output_category_temp<a class='{$html_tag_class}_link' href='$link'>$title</a></li>
 
___EOF___;
   endif;

   return array('hook_secret_key'=>'hogehoge', 'data'=>$out_temp);
}

add_filter( 'lvp_each_item' , 'lvp_each_item_fix' , 10 , 2 );

function lvp_each_item_fix($out, $out_atts){

extract($out_atts);

if(isset($id) && $id === "case2"):

$out_temp = <<< ___EOF___

<li class='{$html_tag_class}_item'>$date$output_category_temp<a class='{$html_tag_class}_link' href='$link'>$title</a></li>

___EOF___;

endif;

return array('hook_secret_key'=>'hogehoge', 'data'=>$out_temp);

}

Created on August 29, 2017 @kimipooh