WordPress-də etiketləri necə tərtib etmək olar

WordPress məzmununuzu taksonomiyalara sıralamağa imkan verir. Varsayılan olaraq kateqoriyalar və etiketlər ilə gəlir. Kategoriyalar məzmununuzu müxtəlif hissələrə çeşidləmək üçün istifadə oluna bilər, etiketlər daha çox xüsusi mövzularda məzmun çeşidləmək üçün istifadə edilə bilər. Saytınızda istifadə olunan yazıları etiket buludu və ya siyahı formatında göstərə bilərsiniz. Bu yazıda WordPress etiketlərini necə dizayn edəcəyinizi sizə göstərəcəyik.

Bütün etiketləri WordPress post sayımları ilə göstərin

Bəzi məşhur veb saytlar, ən populyar etiketlərini sənədlər səhifələrində və ya altbilgi bölgəsində mövzular olaraq göstərirlər. Budur, bütün yazı etiketlərinizi, yazı sayı ilə və etiket buludundan istifadə etmədən necə göstərə bilərsiniz.

Ediləcək ilk şey bu kodu kopyalamaq və temanınızın funksiyaları.php faylı və ya sayt üçün xüsusi plagin.

function wpb_tags() { 
 $wpbtags =  get_tags();
 foreach ($wpbtags as $tag) { 
 $string .= 'term_id) .'">'. $tag->name . ''. $tag->count .'' . "n"   ;
 } 
 return $string;
 } 
 add_shortcode('wpbtags' , 'wpb_tags' );
 

Bu kod sadəcə etiketlərin hamısını yanındakı yazı sayı ilə göstərir. Bununla birlikdə, fayl səhifənizdə və ya vidjetdə göstərmək üçün bu qısa kodu istifadə etməlisiniz:

(wpbtags)

Bu kodu istifadə etiket bağlantılarını və yanında olanların sayını göstərəcəkdir. Bu onun yaraşıqlı görünməsinə səbəb olmaz. Gözəl olmaq üçün bəzi CSS əlavə edək. Bu CSS-i kopyalayın və mövzu tərzinizə yapışdırın.

.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;
 }
 

CSS-i ehtiyaclarınıza uyğun dəyişdirmək üçün çekinmeyin. Demo saytımızda göründüyü budur:

WordPress-də yazı sayı etiketlərini göstərin

Post meta məlumatlarında stil etiketləri

Bəzi WordPress mövzuları yazı tarixi, müəllif və digər metal bağlantılar olan post metadata məlumatları altında çox yaxşı göstərilir. Ancaq bəzi mövzular onları ümumiyyətlə dizayn edə bilməz və ya başqa cür dizayn etmək istəyə bilərsiniz.

Bir WordPress yazıının altındakı etiket bağlantılarını necə dizayn edə biləcəyimizi görək.

Əvvəlcə etiketləri göstərmək üçün WordPress mövzusunuzun istifadə etdiyi CSS sinifini tapmalısınız. Bunu etmək üçün etiketləri sağ vurun və brauzer menyusundan yoxlama elementini seçin.

Bu veb səhifənin altındakı geliştiricinin alətlər qutusunu göstərmək üçün brauzer ekranını parçalayacaqdır. Geliştirici alət qutusunda etiketləri göstərmək üçün WordPress mövzusunda istifadə olunan CSS sinifini görə bilərsiniz.

Etiketlər üçün mövzunun istifadə etdiyi css sinifini tapın

Yuxarıdakı ekran görüntüsündə, mövzunun CSS sinfi üçün terminlərdən istifadə etdiyini görə bilərsiniz. İndi bu sinifdən standart CSS mövzusunu ləğv etmək üçün mövzumuzda və ya uşaq mövzusunda stil cədvəlində istifadə edəcəyik.

.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;
 }
 

Mövzunun rənglərinə uyğun CSS dəyişdirmək üçün çekinmeyin. Etiketlərin demo saytımızda göründüyü budur:

WordPress yazıları altındakı etiketlər üçün CSS tərzi dəyişdirildi

CSS dəyişikliklərinə əlavə olaraq iki ekran görüntüsü arasındakı fərqi görə bilərsiniz, etiketləri Etiketlə dəyişdirdik və etiketlər arasındakı vergülləri çıxartdıq. Bunu necə etdik?

Biz the_tags () dəyişdiririk; şablon etiketi bizim single.php faylımızda bu kimi:

 

Göstərmək üçün göstərilən etiketlərin ümumi sayını məhdudlaşdırmaq istəyirsinizsə 5 Və ya başqa bir şey, dərc edildikdən sonra məhdud sayda etiketin necə göstəriləcəyi barədə bu məqaləni nəzərdən keçirin.

Ümid edirik ki, bu məqalə WordPress etiketlərini tərtib etməyə kömək etdi. İstədiyiniz nəticəni əldə etməyinizə qədər CSS ilə sınaqdan keçirin.

Bu yazını bəyənmisinizsə, kanalımıza abunə olun YouTube daha çox WordPress video dərsləri üçün. Ayrıca, bizi Google+-da tapa bilərsiniz Twitter.