Hur man anpassar visningen av WordPress-arkiv i ditt sidofÀlt

Hur man anpassar visningen av WordPress-arkiv i ditt sidofÀlt

Nyligen arbetade vi med en kunds webbdesign som krÀvde att vi visade mÄnadsarkiv ordnade efter Är i sidofÀltet. Det var förmodligen vÀldigt enkelt för deras designer att göra narr av det i Photoshop, men det var lite komplicerat att uppnÄ i WordPress. Se bilden nedan:

Nu undrar du förmodligen varför det var knepigt att fÄ det till WordPress nÀr wp_get_archives () listar arkiven varje mÄnad med Äret bredvid det? Det beror pÄ att den hÀr klienten bara ville visa Äret en gÄng efter det. Det finns inget riktigt sÀtt att anpassa utformningen av funktionen wp_get_archives ().

Vi letade efter lösningar pÄ nÀtet och stötte pÄ ingenting. Det hÀr problemet mÄste vara riktigt sÀllsynt men vi fann att Andrew Appleton hade samma problem, och han hade en fix för det. Vi anvÀnde hans koder med smÄ Àndringar.

Andrews kod hade ingen grÀnsparameter för arkiven. SÄ att anvÀnda hans koder skulle innebÀra att du kommer att visa alla arkiv mÄnad. TÀnk dig det för en blogg som Àr 5 Är gammal. SÄ vi lade till en grÀnsparameter som gjorde det möjligt för oss att begrÀnsa antalet visade mÄnader till 18 vid varje given tidpunkt.

SÄ i princip Àr vad du behöver göra att klistra in följande kod i ditt temas fil eller nÄgon annan fil dÀr du vill visa anpassade WordPress-arkiv:


<?php
global $wpdb;
$limit = 0;
$year_prev = null;
$months = $wpdb->get_results("SELECT DISTINCT MONTH( post_date ) AS month ,	YEAR( post_date ) AS year, COUNT( id ) as post_count FROM $wpdb->posts WHERE post_status="publish" and post_date <= now( ) and post_type="post" GROUP BY month , year ORDER BY post_date DESC");
foreach($months as $month) :
	$year_current = $month->year;
	if ($year_current != $year_prev){
		if ($year_prev != null){?>
		
		<?php } ?>
	
	<li class="archive-year"><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/"><?php echo $month->year; ?></a></li>
	
	<?php } ?>
	<li><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/<?php echo date("m", mktime(0, 0, 0, $month->month, 1, $month->year)) ?>"><span class="archive-month"><?php echo date_i18n("F", mktime(0, 0, 0, $month->month, 1, $month->year)) ?></span></a></li>
<?php $year_prev = $year_current;

if(++$limit >= 18) { break; }

endforeach; ?>

Obs! Om du vill Àndra antalet visade mÄnader mÄste du Àndra rad 19 dÀr det nuvarande $ -grÀnsvÀrdet Àr instÀllt pÄ 18.

VÄr CSS sÄg ut sÄ hÀr:


.widget-archive{padding: 0 0 40px 0; float: left; width: 235px;}
.widget-archive ul {margin: 0;}
.widget-archive li {margin: 0; padding: 0;}
.widget-archive li a{ border-left: 1px solid #d6d7d7; padding: 5px 0 3px 10px; margin: 0 0 0 55px; display: block;}
li.archive-year{float: left; font-family: Helvetica, Arial, san-serif; padding: 5px 0 3px 10px; color:#ed1a1c;}
li.archive-year a{color:#ed1a1c; margin: 0; border: 0px; padding: 0;}

SÄ genom att göra det pÄ det hÀr sÀttet fick vi det slutliga resultatet att se ut sÄ hÀr:

Anpassad arkivvisning i WordPress-sidofÀltet

Om du nu vill visa antalet inlĂ€gg i varje mĂ„nad, mĂ„ste du lĂ€gga till den hĂ€r biten kod var som helst mellan rad 12 – 16 i ovanstĂ„ende kod:

<?php echo $month->post_count; ?>

Ett exempel pÄ vad du kan göra med antalet inlÀgg och allt kan ses i bilden nedan:

Anpassad WordPress-arkivvisning med antal inlÀgg

OvanstÄende bild togs frÄn Andrew Appletons webbplats eftersom det var den lösning han kom fram frÄn vilken vi hÀmtade vÄr stil. Om du vill se css för hans stilar klickar du helt enkelt pÄ hans webbplatslÀnk ovan.

KÀnner du till ett enklare sÀtt att uppnÄ detta? Kommer du att anpassa visningen av dina WordPress-arkiv i nÀsta design? Dela dina tankar i kommentarfÀltet nedan.