Last active
August 29, 2015 14:07
-
-
Save srikat/c6a50da438c733850b62 to your computer and use it in GitHub Desktop.
How to display Posts organized by category as Data Tables in Genesis. http://sridharkatakam.com/display-posts-organized-category-data-tables-genesis/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery(function( $ ){ | |
$('.category-table').DataTable({ | |
// Reference: http://www.datatables.net/reference/option/ | |
// paging: false, // disable table pagination. | |
pageLength: 25, // initial page length (number of rows per page). | |
lengthChange: false, // remove the option for end user to change number of records to be shown per page. | |
// pagingType: 'simple', // http://datatables.net/reference/option/pagingType. | |
order: [[2, 'desc']], // define which column(s) the order is performed upon, and the ordering direction.http://datatables.net/reference/option/order | |
// language: { | |
// "sProcessing": "Procesando...", | |
// "sLengthMenu": "Mostrar _MENU_ registros", | |
// "sZeroRecords": "No se encontraron resultados", | |
// "sEmptyTable": "Ningún dato disponible en esta tabla", | |
// "sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros", | |
// "sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros", | |
// "sInfoFiltered": "(filtrado de un total de _MAX_ registros)", | |
// "sInfoPostFix": "", | |
// "sSearch": "Buscar:", | |
// "sUrl": "", | |
// "sInfoThousands": ",", | |
// "sLoadingRecords": "Cargando...", | |
// "oPaginate": { | |
// "sFirst": "Primero", | |
// "sLast": "Último", | |
// "sNext": "Siguiente", | |
// "sPrevious": "Anterior" | |
// }, | |
// "oAria": { | |
// "sSortAscending": ": Activar para ordenar la columna de manera ascendente", | |
// "sSortDescending": ": Activar para ordenar la columna de manera descendente" | |
// } | |
// }, | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* | |
Template Name: Category Tables | |
*/ | |
//* Enqueue DataTables | |
add_action( 'wp_enqueue_scripts', 'sk_enqueue_scripts' ); | |
function sk_enqueue_scripts() { | |
wp_enqueue_style( 'datatables-jqueryui-stylesheet', get_stylesheet_directory_uri() . '/css/jquery.dataTables.min.css', array(), CHILD_THEME_VERSION ); | |
wp_enqueue_style( 'datatables-responsive-stylesheet', get_stylesheet_directory_uri() . '/css/dataTables.responsive.css', array(), CHILD_THEME_VERSION ); | |
wp_enqueue_script( 'datatables', get_stylesheet_directory_uri() . '/js/jquery.dataTables.min.js', array( 'jquery' ), '', true ); | |
wp_enqueue_script( 'datatables-responsive', get_stylesheet_directory_uri() . '/js/dataTables.responsive.min.js', array( 'jquery' ), '', true ); | |
wp_enqueue_script( 'datatables-init', get_stylesheet_directory_uri() . '/js/datatables-init.js', array( 'datatables' ), '1.0.0', true ); | |
} | |
add_filter( 'body_class', 'custom_body_class' ); | |
/** | |
* Adds a css class to the body element | |
* | |
* @param array $classes the current body classes | |
* @return array $classes modified classes | |
*/ | |
function custom_body_class( $classes ) { | |
$classes[] = 'category-tables'; | |
return $classes; | |
} | |
# Force full width content | |
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' ); | |
# Remove the post content | |
remove_action( 'genesis_entry_content', 'genesis_do_post_content' ); | |
# Add custom post content | |
add_action( 'genesis_entry_content', 'sk_do_post_content' ); | |
/** | |
* Outputs custom post content | |
* | |
* @return void | |
*/ | |
function sk_do_post_content() { | |
$cat_args = wp_parse_args( | |
genesis_get_custom_field( 'cat_args' ), | |
array( | |
'orderby' => 'name', | |
) | |
); | |
// array of category objects matching the query parameters. | |
$categories = get_categories( $cat_args ); | |
foreach ( $categories as $category ) { | |
echo '<div class="category-item">'; | |
// Linked Category title | |
echo '<h2 class="category-title"><a href="' . get_category_link( $category->term_id ) . '">' . $category->name . '</a></h2>'; ?> | |
<!-- http://www.datatables.net/manual/styling/classes --> | |
<!-- display = stripe, hover, row-border and order-column --> | |
<table class="category-table display responsive"> | |
<thead> | |
<tr> | |
<th>Title</th> | |
<th>Author</th> | |
<th>Date</th> | |
<th>Tags</th> | |
<th>Views</th> | |
</tr> | |
</thead> | |
<tbody> | |
<?php | |
$args = array( | |
// 'orderby' => 'title', | |
// 'order' => 'ASC', | |
'cat' => $category->term_id, | |
'posts_per_page' => -1 | |
); | |
// The Query | |
$the_query = new WP_Query( $args ); | |
while ( $the_query->have_posts() ) { | |
$the_query->the_post(); | |
?> | |
<tr> | |
<td><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></td> | |
<td><?php the_author_posts_link(); ?></td> | |
<td><?php echo get_the_date(); ?></td> | |
<td><?php the_tags('','<br />',''); ?></td> | |
<td><?php if(function_exists('get_post_views')) { echo get_post_today_views(); } ?></td> | |
</tr> | |
<?php } | |
/* Restore original Post Data */ | |
wp_reset_postdata(); ?> | |
</tbody> | |
</table> | |
<?php | |
echo '</div><!-- .category-item -->'; | |
} | |
} | |
genesis(); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Category Tables | |
--------------------------------------------- */ | |
.category-tables .entry-header { | |
margin-bottom: 60px; | |
} | |
.category-item { | |
margin-bottom: 60px; | |
} | |
.dataTables_wrapper .dataTables_filter input { | |
padding: 5px; | |
} | |
.category-tables h2 { | |
margin-bottom: 0; | |
} | |
.category-tables .dataTables_wrapper .dataTables_paginate .paginate_button { | |
padding: 0em 0.5em; | |
} | |
.dataTables_wrapper .dataTables_info, | |
.dataTables_wrapper .dataTables_paginate { | |
font-size: 15px; | |
} | |
.category-tables .dataTables_wrapper .dataTables_paginate { | |
padding-top: 0.755em; | |
} | |
@media only screen and (max-width: 320px) { | |
.category-table { | |
width: auto !important; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment