
So one of my recent projects was to create a shortcode that displays a scrollable list of recent posts of a specific category.
It was intended to show past, current and future exhibits.
What I came up with was a scrollable list of child pages.
But it does everything else just fine!
Doesn’t work on private pages annoyingly enough so I had to create several public pages to demonstrate.
Code
add_shortcode( 'david_pager', 'david_pager_shortcode' );
/**
* Gets all recent pages with a specific parent page.
* If there is only 1 page it will be given the header "Current".
* If there is 2 pages ther will be given the headers "Current" and "Past".
* If there is 3 pages ther will be given the headers "Future", "Current" and "Past".
*/
function david_pager_shortcode($atts) {
if (!(isset($atts['vertical']->a)) && !empty($atts['vertical'])) {
if($atts['vertical'] == "true") {
$vertical = true;
}
} else {
$vertical = false;
}
if($vertical) {
$parent = $atts['parent'];
//Get recent Programme child pages
$mypages = get_pages(
array(
'number' => 10, //Number of pages to show
'child_of' => $parent, //Parent page ID (Programme = 580)
'sort_column' => 'post_date', //Sort by date posted
'sort_order' => 'desc' //Decending order
)
);
$ressy = '<div class="row"
style="
overflow-y: scroll;
height: 270px;
flex-direction: row;
flex-flow: column;
margin-right: 0px;
margin-left: 0px;
">
<div class="thing">';
$pagesleft = count($mypages);
if($pagesleft == 0) {
$ressy .= '</div></div>';
return $ressy;
}
$headed = false;
if (!(isset($atts['current']->a)) && !empty($atts['current'])) {
if($atts['current'] == "false") {
$cheaded = true;
} else {
$cheaded = false;
}
} else {
$cheaded = false;
}
//If only 1 page
if($pagesleft == 1 && !$cheaded) {
$ressy .= '<h2>Current</h2>';
$headed = true;
$cheaded = true;
}
if (!(isset($atts['future']->a)) && !empty($atts['future'])) {
if($atts['future'] == "false") {
$fheaded = true;
} else {
$cheaded = false;
}
} else {
$fheaded = false;
}
if (!(isset($atts['past']->a)) && !empty($atts['past'])) {
if($atts['past'] == "false") {
$pheaded = true;
} else {
$pheaded = false;
}
} else {
$pheaded = false;
}
$thinged = true;
foreach( $mypages as $page ) {
if(!$thinged) {
$ressy .= '<div class="thing">';
}
$thinged = false;
if(!$headed) {
//If 3 or more pages
if($pagesleft >= 3 && !$fheaded) {
$ressy .= '<h2>Future</h2>';
$fheaded = true;
} else if($pagesleft >= 2 && !$cheaded) {
//If 2 or more pages
$ressy .= '<h2>Current</h2>';
$cheaded = true;
} else if($pagesleft >= 1 && !$pheaded) {
$ressy .= '<h2>Past</h2>';
$pheaded = true;
$headed = true;
}
$pagesleft -= 1;
}
//Get the excerpt
$excerpt = $page->post_excerpt;
$excerpt = apply_filters( 'the_excerpt', $excerpt );
$ressy .= '<div class="lil-posts"">
<h3>
<a href="' . get_page_link( $page->ID ) . '">
' . $page->post_title . '
</a>
</h3>
<div class="d-flex flex-row">
' . get_the_post_thumbnail( $page->ID, 'thumbnail' ) . '
<div class="excerpt flex-grow-1">
' . $excerpt . '
</div>
</div>
</div>';
$ressy .= '</div>';
}
$ressy .= '</div>';
return $ressy;
} else {
$parent = $atts['parent'];
//Get recent Programme child pages
$mypages = get_pages(
array(
'number' => 10, //Number of pages to show
'child_of' => $parent, //Parent page ID (Programme = 580)
'sort_column' => 'post_date', //Sort by date posted
'sort_order' => 'desc' //Decending order
)
);
$ressy = '<div class="row"
style="
overflow-x: scroll;
height: 270px;
flex-direction: column;
flex-flow: row;
margin-right: 0px;
margin-left: 0px;
">
';
$pagesleft = count($mypages);
if($pagesleft == 0) {
$ressy .= '</div></div>';
return $ressy;
}
$headed = false;
if (!(isset($atts['current']->a)) && !empty($atts['current'])) {
if($atts['current'] == "false") {
$cheaded = true;
} else {
$cheaded = false;
}
} else {
$cheaded = false;
}
//If only 1 page
if($pagesleft == 1 && !$cheaded) {
$ressy .= '<h2>Current</h2>';
$headed = true;
$cheaded = true;
}
if (!(isset($atts['future']->a)) && !empty($atts['future'])) {
if($atts['future'] == "false") {
$fheaded = true;
} else {
$cheaded = false;
}
} else {
$fheaded = false;
}
if (!(isset($atts['past']->a)) && !empty($atts['past'])) {
if($atts['past'] == "false") {
$pheaded = true;
} else {
$pheaded = false;
}
} else {
$pheaded = false;
}
$thinged = true;
if($fheaded && $cheaded && $pheaded) {
$ressy .= '<div class="thing" style="margin-top: 38px;">';
} else {
$ressy .= '<div class="thing">';
}
foreach( $mypages as $page ) {
if(!$thinged) {
if($fheaded && $cheaded && $pheaded || ($pagesleft <= 2 && ($cheaded && $pheaded))) {
$ressy .= '<div class="thing" style="margin-top: 38px;">';
} else {
$ressy .= '<div class="thing">';
}
}
$thinged = false;
if(!$headed) {
//If 3 or more pages
if($pagesleft >= 3 && !$fheaded) {
$ressy .= '<h2>Future</h2>';
$fheaded = true;
} else if($pagesleft >= 2 && !$cheaded) {
//If 2 or more pages
$ressy .= '<h2>Current</h2>';
$cheaded = true;
} else if($pagesleft >= 1 && !$pheaded) {
$ressy .= '<h2>Past</h2>';
$pheaded = true;
$headed = true;
}
$pagesleft -= 1;
}
//Get the excerpt
$excerpt = $page->post_excerpt;
$excerpt = apply_filters( 'the_excerpt', $excerpt );
$ressy .= '<div class="lil-posts" style="width:430px;">
<h3>
<a href="' . get_page_link( $page->ID ) . '">
' . $page->post_title . '
</a>
</h3>
<div class="d-flex flex-row">
' . get_the_post_thumbnail( $page->ID, 'thumbnail' ) . '
<div class="excerpt flex-grow-1">
' . $excerpt . '
</div>
</div>
</div>';
$ressy .= '</div>';
}
$ressy .= '</div>';
return $ressy;
}
}
Shortcode
Horizontal Example
[david_pager parent=2688]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Current
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Future
[david_pager parent=2688 future=false]
Current
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Current
[david_pager parent=2688 current=false]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Past
[david_pager parent=2688 past=false]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Current
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without All
[david_pager parent=2688 future=false current=false past=false]
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Vertical Example
[david_pager parent=2688 vertical=true]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Current
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Future
[david_pager parent=2688 vertical=true future=false]
Current
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Current
[david_pager parent=2688 vertical=true current=false]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Past
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without Past
[david_pager parent=2688 past=false vertical=true]
Future
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Current
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Without All
[david_pager parent=2688 future=false current=false past=false vertical=true]
Test Child Page 4

The fourth child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 3

The third child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 2

The second child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.
Test Child Page 1

The first child page created for testing purposes. Used only in posts to demonstrate shortcodes that make use of child pages.