Table Layout
Displaying query results in a table with Ajax Load More
In this example:
Ajax Load More will infinite scroll query results in a table layout.
Note: To help avoid display issues with table rendering you should remove the .alm-reveal container by setting transition_container=”false” in your shortcode.
The following shortcode was used to create the Table Layout example.
[ajax_load_more repeater="template_26" scroll="false" button_label="Show More" button_loading_label="Loading data..." container_type="table" css_classes="tbl-example" transition="none" transition_container="false" posts_per_page="4"]
The following Repeater Template was used to create the Table Layout example.
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php if($alm_item === 1){?> <tr> <th class="the_id">ID</th> <th class="the_date">Date</th> <th>Title</th> </tr> <?php } ?> <tr> <td class="the_id"><?php the_ID();?></td> <td class="the_date"><?php the_time("d/m/Y"); ?></td> <td><strong><?php the_title(); ?></strong><br/><span><a href="<?php the_permalink();?>"><?php the_permalink();?></a></span></td> </tr> |