آموزش تغییر استایل نمایش برچسب ها در وردپرس

همان طور که میدانید وردپرس به شما این اجازه را میدهد که بتوانید مطالب و نوشته های خود را سفارشی سازی کرده و طبقه بندی کنید منظور از این طبقه بندی، دسته بندی ها و برچسب ها میباشد. برای مرتب کردن مطالب خود در بخش  های مختلف از دسته بندی و برای مرتب کردن مطالب به موضوعات خاص تر از برچسب ها استفاده میشود. با ما همراه باشید با آموزش تغییر استایل نمایش برچسب ها در وردپرس.

نمایش برچسب ها و یا پست ها در وردپرس

برخی از وبسایت ها برچسب های محبوب خود را به عنوان موضوعات خاص در فوتر قرار میدهند تا در ارشیو وبسایت قابل مشاهده باشد. برای شروع کار ابتدا کدهای زیر را در فایل  (functions.php) قالب خود کپی کنید. برای این که بتوانیم تمامی برچسب ها به همراه تعداد پستها را نمایش دهیم باید از کدهای زیر استفاده کنید.

function wpb_tags() { 
$wpbtags =  get_tags();
foreach ($wpbtags as $tag) { 
$string .= '<span class="tagbox"><a class="taglink" href="'. get_tag_link($tag->term_id) .'">'. $tag->name . '</a><span class="tagcount">'. $tag->count .'</span></span>' . "\n"   ;
} 
return $string;
} 
add_shortcode('wpbtags' , 'wpb_tags' );

همچنین برای نمایش برچسبها در فوتر میتوانید از کدکوتاه زیر استفاده کنید این کد را میتوانید در جای دبخواه مانند ابزارک ها استفاده کنید.

[wpbtags]

پس از استفاده از کد کوتاه مورد نظر ابر چسب ها در سایت شما نمایش داده خواهند شد، اما اگر ظاهر آن مورد دلخواهتان نبود برای این منظور کد زیر را به استایل css قالب خود اضافه کنید.

<pre>.tagbox { 
background-color:#eee;
border: 1px solid #ccc;
margin:0px 10px 10px 0px;
line-height: 200%;
padding:2px 0 2px 2px;

}
.taglink  { 
padding:2px;
}

.tagbox a, .tagbox a:visited, .tagbox a:active { 
text-decoration:none;
}

.tagcount { 
background-color:green;
color:white;
position: relative;
padding:2px;
}
</pre>

در آخر برچسب هایی که استفاده کرده اید به صورت زیر نمایش داده خواهند شد .

استایل برچسب ها در پست اطلاعات

برخی از قالب ها تاریخ ،تعداد و نویسنده برچسب ها را نمایش میدهند با این حال ممکن است در برخی از تم های وردپرس این استایل وجود نداشته باشد و شما بخواهید آن را تغییر دهید. برای نمایش استایل برچسب ها و پیدا کردن آدرس آن ها روی یکی از برچسب ها کلیک راست کرده و گزینه inspect element  بزنید.

حال برای نمایش برچسب ها باید کدهای زیر را در استایل css قالب خود کپی کنید.

<pre>.terms a, .terms a:visited, .terms a:active { 
background:#eee;
border:1px solid #ccc;
border-radius:5px;
text-decoration:none;
padding:3px;
margin:3px;
text-transform:uppercase;
}

.terms a:hover { 
background:#a8281a;
color:#FFF;
}
</pre>

بعد از ذخیره کردن اطلاعات، به فایل single.php که مربوط به نوشته های سایت میباشد رفته و کد زیر را در محل مربوطه قرار دهید.

<pre><?php the_tags('Tagged:', '' ,'' ); ?></pre>

پس از انجام این عمل برچسب های شما به صورت زیر نمایش داده خواهد شد .