|
/* Volume Custom Post Navigation */ |
|
/* Markup in Hook Element: before_footer / execute PHP / Priority 100 */ |
|
|
|
<div id="post-nav"> |
|
<?php global $post; |
|
$prevPost = get_previous_post(false); |
|
if($prevPost) { |
|
$args = array( |
|
'posts_per_page' => 1, |
|
'include' => $prevPost->ID |
|
); |
|
$prevPost = get_posts($args); |
|
foreach ($prevPost as $post) { |
|
setup_postdata($post); |
|
?> |
|
<a class="post-previous" href="<?php the_permalink(); ?>"> |
|
<div class="post-nav-wrap" style="background: linear-gradient(0deg,rgba(52,62,71,0.1),rgba(52,62,71,0.3)),url('<?php the_post_thumbnail_url(); ?>');"> |
|
<div class="post-nav">Previous</div> |
|
<h3 class="post-nav-title"><?php the_title(); ?></h3> |
|
</div></a> |
|
<?php |
|
wp_reset_postdata(); |
|
} //end foreach |
|
} // end if |
|
|
|
$nextPost = get_next_post(false); |
|
if($nextPost) { |
|
$args = array( |
|
'posts_per_page' => 1, |
|
'include' => $nextPost->ID |
|
); |
|
$nextPost = get_posts($args); |
|
foreach ($nextPost as $post) { |
|
setup_postdata($post); |
|
?> |
|
<a class="post-next" href="<?php the_permalink(); ?>"> |
|
<div class="post-nav-wrap" style="background: linear-gradient(0deg,rgba(52,62,71,0.6),rgba(52,62,71,0.3)),url('<?php the_post_thumbnail_url(); ?>');"> |
|
<h3 class="post-nav-title"><?php the_title(); ?></h3> |
|
<div class="post-nav">Next</div> |
|
</div></a> |
|
<?php |
|
wp_reset_postdata(); |
|
} //end foreach |
|
} // end if |
|
?> |
|
</div> |
|
|
|
/* CSS CUSTOM POST NAVIGATION - ENSURE GP NAV IS DISABLED */ |
|
|
|
.post-nav { |
|
background-color: #ff3366; |
|
color: #fff !important; |
|
} |
|
|
|
#post-nav a { |
|
-webkit-box-flex: 1; |
|
-ms-flex: 1 0 50%; |
|
flex: 1 0 50%; |
|
box-sizing: border-box; |
|
} |
|
|
|
@media (max-width: 768px) { |
|
#post-nav a { |
|
-webkit-box-flex: 1; |
|
-ms-flex: 1 0 100%; |
|
flex: 1 0 100%; |
|
} |
|
} |
|
|
|
#post-nav .post-nav-wrap { |
|
background-size: cover !important; |
|
background-position: center center !important; |
|
min-height: 120px; |
|
height: 100%; |
|
padding: calc(6% + 1em) 5%; |
|
-webkit-box-shadow: inset 0 -50px 70px 20px rgba(0, 0, 0, 0.5); |
|
box-shadow: inset 0 -50px 70px 20px rgba(0, 0, 0, 0.5); |
|
-webkit-transition: -webkit-box-shadow 500ms; |
|
transition: -webkit-box-shadow 500ms; |
|
transition: box-shadow 500ms; |
|
transition: box-shadow 500ms, -webkit-box-shadow 500ms; |
|
position: relative; |
|
} |
|
|
|
#post-nav .post-nav-wrap:hover { |
|
-webkit-box-shadow: inset 0 -90px 70px 20px rgba(0, 0, 0, 0.5); |
|
box-shadow: inset 0 -90px 70px 20px rgba(0, 0, 0, 0.5); |
|
} |
|
|
|
.post-nav-wrap>* { |
|
color: #fff; |
|
} |
|
|
|
.post-nav-date { |
|
font-size: 0.9em; |
|
} |
|
|
|
.post-nav-title { |
|
margin: 5px 0 !important; |
|
} |
|
|
|
.post-nav { |
|
min-width: 60px; |
|
position: absolute; |
|
top: 0; |
|
border-radius: 0 0 2px 0; |
|
} |
|
|
|
.post-nav:first-child { |
|
left: 0; |
|
} |
|
|
|
.post-nav:last-child { |
|
right: 0; |
|
} |