آموزش سفارشی سازی نمایش آرشیو وردپرس در سایدبار

شاید شما هم دوست داشته باشید تا آرشیو ماهانه سایت خود را که بر اساس سال مرتب شده، در سایدبار سایت خود به نمایش دراورید. برای درک بهتر میتوانید تصویر زیر را مشاهده کنید:

برای انجام این کار کافی است کد زیر را در فایل sidebar.php قالب سایت خود قرار دهید:

<div class="widget-archive"><ul>
<?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; ?>
</ul></div>

کد بالا دارای محدودیت در نمایش تعداد ماه های آرشیو است و علت این امر جلوگیری از بهم ریختن سایت به علت نمایش کل آرشیو در یک مکان است. از همین رو تنها ۱۸ ماه آرشیو نمایش داده می شوند.

توجه: در صورتیکه میخواهید تعداد ماه های نمایش داده شده را افزایش دهید، کافی است عدد ۱۸ در آخر کد را به عدد دلخواه خود تغییر دهید.

حالا نوبت آن است که کد CSS خود را به فایل style.css قالب سایت خود اضافه کنید:

.widget-archive{padding: 0 0 40px 0; float: right; width: 100%;}
.widget-archive ul {margin: 0;}
.widget-archive li {margin: 0; padding: 0;list-style:none;border-bottom:1px solid #d6d7d7;}
.widget-archive li a{ border-right: 1px solid #d6d7d7; padding: 5px 0 3px 10px; margin: 0 55px 0 0; display: block;}
li.archive-year{float: right; font-family: tahoma, Arial, san-serif; padding: 5px 0 3px 10px; color:#ed1a1c;}
li.archive-year a{color:#ed1a1c; margin: 0; border: 0px; padding: 0;}

حالا کافی است تغییرات انجام شده در قالب را ذخیره کنید. نمونه شبیه آن چیزی خواهد شد که پیشتر در بالای صفحه نشان دادیم.

حالا اگر شما میخواهید علاوه بر نمایش آرشیو، تعداد پست های هر ماه را نیز نمایش دهید، میبایست از کد زیر در کدی که پیشتر ارائه شده استفاده کنید:

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

در صورتیکه دستی بر فتوشاپ داشته باشید میتوانید طرح هایی مشابه نمونه زیر طراحی کنید:

سپس با کمی کدنویسی و ایجاد تغییرات در کدهای CSS به نتیجه دلخواه خود برسید.