چگونه می توان نمایش بایگانی های وردپرس را در نوار کناری خود سفارشی کرد

اخیراً ، ما در حال طراحی سایت مشتری بودیم که ما را ملزم به نمایش بایگانی ماهانه مرتب شده بر اساس سال در نوار کناری می کرد. مسخره کردن آن در فتوشاپ برای طراح آنها واقعاً آسان بود ، اما دستیابی به آن در وردپرس کمی پیچیده بود. تصویر زیر را ببینید:

اکنون احتمالاً از خود می پرسید که چرا ورود آن به وردپرس هنگام کار wp_get_archives () بایگانی ها را ماهانه با سال بعد لیست می کند؟ خوب این به این دلیل است که این مشتری فقط می خواست سال را یک بار روی آن بماند. هیچ روشی واقعی برای شخصی سازی یک ظاهر طراحی عملکرد wp_get_archives () وجود ندارد.

برای یافتن راه حل در وب جستجو کردیم و به هیچ چیز برخورد نکردیم. این مسئله باید واقعاً نادر باشد ، با این وجود دریافتیم که Andrew Appleton مشکل مشابهی داشت و او راه حلی برای آن داشت. ما از کدهای وی با کمی تغییر استفاده کردیم.

کد اندرو برای بایگانی ها پارامتر محدودیتی ندارد. بنابراین استفاده از کدهای وی به این معنی است که شما تمام بایگانی ها را در ماه نشان خواهید داد. تصور کنید که این برای یک وبلاگ 5 ساله است. بنابراین یک پارامتر محدودیت اضافه کردیم که به ما امکان می داد تعداد ماههای نمایش داده شده را در هر زمان مشخص به 18 ماه محدود کنیم.

بنابراین اساساً کاری که شما باید انجام دهید اینست که کد زیر را در پرونده sidebar.php طرح زمینه خود یا هر پرونده دیگری که می خواهید بایگانی های سفارشی وردپرس را در آن نمایش دهید ، جایگذاری کنید:

 get_results ("انتخاب ماه تمیز (تاریخ پس از تاریخ) به عنوان ماه ، YEAR (تاریخ پس از تاریخ) به عنوان سال ، COUNT (شناسه) به عنوان post_count از $ wpdb-> پست های WHERE post_status =" انتشار "و post_date  year؛
اگر ($ year_current! = $ year_prev) {
if ($ year_prev! = null) {؟>

= 18) {break؛ }

endforeach؛ ؟>

توجه: اگر می خواهید تعداد ماههای نمایش داده شده را تغییر دهید ، پس باید خط 19 را تغییر دهید که مقدار محدوده فعلی $ روی 18 تنظیم شده باشد.

CSS ما کمی شبیه این بود:

.widget-archive {padding: 0 0 40px 0؛ شناور به سمت چپ؛ عرض: 235px؛}
.widget-archive ul {margin: 0؛}
.widget-archive li {margin: 0؛ بالشتک: 0؛}
.widget-archive li a {border-left: 1px solid # d6d7d7؛ بالشتک: 5px 0 3px 10px؛ حاشیه: 0 0 0 55px؛ نمایش: بلوک؛}
li.archive-year {float: left؛ font-family: Helvetica، Arial، san-serif؛ بالشتک: 5px 0 3px 10px؛ رنگ: # ed1a1c؛}
li.archive-a a {color: # ed1a1c؛ حاشیه: 0؛ حاشیه: 0px؛ بالشتک: 0؛}

بنابراین با انجام این روش ، نتیجه نهایی به این شکل در آمد:

حال اگر می خواهید تعداد پست ها را در هر ماه نشان دهید ، پس باید این بیت کد را در هر کجای خط بین 12 تا 16 کد بالا اضافه کنید:

  post_count؛ ؟> 

یک نمونه از کارهایی که می توانید با شمارش پست انجام دهید و همه چیز در تصویر زیر قابل مشاهده است:

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

آیا روش ساده تری برای تحقق این امر سراغ دارید؟ آیا در طراحی بعدی می خواهید صفحه بایگانی وردپرس خود را سفارشی کنید؟ لطفاً نظرات خود را در جعبه نظرات زیر به اشتراک بگذارید.