Hur man anvÀnder miniatyrer med tidigare och nÀsta inlÀggslÀnkar i WordPress

Hur man anvÀnder miniatyrer med tidigare och nÀsta inlÀggslÀnkar i WordPress

En av vÄra anvÀndare frÄgade oss pÄ vÄr Facebook-sida: Hur man anvÀnder miniatyrer för föregÄende / nÀsta postnavigering i WordPress. Funktionerna next_post_link och previous_post_link har inte en tillrÀckligt enkel miniatyrparameter som en ny utvecklare helt enkelt kan slÄ pÄ och av. I den hÀr artikeln visar vi dig hur du anvÀnder miniatyrer för inlÀgg med föregÄende och nÀsta inlÀggslÀnkar i WordPress.

Det slutliga resultatet skulle se ut sÄ hÀr:

Det första du behöver göra Àr att öppna temat filen och lÀgga till följande kod inuti slingan troligtvis efter omrÄdet_content ():


<div id="cooler-nav" class="navigation">
<?php $prevPost = get_previous_post(true);
if($prevPost) {?>
<div class="nav-box previous">
<?php $prevthumbnail = get_the_post_thumbnail($prevPost->ID, array(100,100) );?>
<?php previous_post_link('%link',"$prevthumbnail  <p>%title</p>", TRUE); ?>
</div>

<?php } $nextPost = get_next_post(true);
if($nextPost) { ?>
<div class="nav-box next" style="float:right;">
<?php $nextthumbnail = get_the_post_thumbnail($nextPost->ID, array(100,100) ); } ?>
<?php next_post_link('%link',"$nextthumbnail  <p>%title</p>", TRUE); ?>
</div>
<?php } ?>
</div><!--#cooler-nav div -->

NÀsta sak du behöver göra Àr att öppna filen och lÀgga till följande stilar:


#cooler-nav{clear: both; height: 100px; margin: 0 0 70px;}
#cooler-nav .nav-box{background: #e9e9e9; padding: 10px;}
#cooler-nav img{float: left; margin: 0 10px 0 0;}
#cooler-nav p{margin: 0 10px; font-size: 12px; vertical-align: middle;}
#cooler-nav .previous{float: left; vertical-align: middle; width: 250px; height: 100px;}
#cooler-nav .next{float: right; width: 250px;}

Ändra gĂ€rna stylingen sĂ„ att den passar ditt tema. Ofta gillar vĂ„ra anvĂ€ndare att utforma koden, sĂ„ det blir lĂ€ttare för dem att justera den. Detta Ă€r bara grundlĂ€ggande styling som du borde kunna anpassa enkelt.

Om du vill Àndra miniatyrstorleken Àndrar du helt enkelt arrayen (100 100) till vad du vill.

KĂ€lla: itsbarry