Искате ли да добавите нечетни и четни класове към статии по темата на вашия WordPress блог ? Добавянето на клас ще ви позволи да покажете определен стил за всяка статия.
В този урок ще ви покажем как да показвате четни или нечетни класове в WordPress.
Защо да добавяте класове? двойки "Или" нечетен » по темата на вашия WordPress блог ?
много Теми на WordPress използвайте стар или същия клас за коментари в WordPress. Позволява на потребителите да видят къде свършва един коментар и къде започва друг.
По същия начин можете да използвате тази техника за вашите статии. Изглежда естетически приятно да позволи на потребителите бързо да сканират обемисти страници. Това е особено полезно за началната страница на сайтове на вестници или списания.
Въпреки това ще видим как да добавим клас във вашите статии WordPress блог.
Как да добавите четен / нечетен клас в WordPress
WordPress генерира CSS класове по подразбиране и ги добавя към различни статии на вашия уебсайт в движение. Тези класове CSS помагат на плъгини и разработчици на теми да добавят свои собствени стилове към всяка различна статия.
WordPress предлага и функция, наречена „ post_class Което се използва от разработчиците на теми за добавяне на класове към статии.
Функцията post_class Също така е филтър, което означава, че можете да манипулирате това с. Точно това ще направим тук.
Просто добавете този код към вашия файл functions.php. WordPress тема.
функция oddeven_post_class ($ class) {global $ current_class; $ classes [] = $ current_class; $ current_class = ($ current_class == 'странно')? 'even': 'odd'; return $ classes; } add_filter ('post_class', 'oddeven_post_class'); глобален $ current_class; $ current_class = 'нечетен';
Тази функция просто добавя клас към нечетни и четни елементи.
Ще намерите странни и четни класове в изходния код на вашия сайт. Просто прекарайте мишката до заглавието на статия, след което щракнете с десния бутон, за да проверите елемента.
След като добавихте нечетните и четни класове към статиите си. Следващата стъпка е да им придадете уникален стил с CSS. Можете да добавите своя персонализиран CSS код към вашата дъщерна тема или да използвате обикновена приставка за CSS.
Ето пример за CSS код, който можете да използвате като отправна точка:
.even {фон: #f0f8ff; } .odd {фон: #f4f4fb; }
Ето как може да бъде резултатът:
Ще ви трябва малко практика, за да постигнете добри резултати, но за това ще трябва да овладеете CSS или просто да използвате инструмент като CSS Hero.
Това е толкова просто като това. Надявам се този урок да ви бъде от голяма полза. Не се колебайте да ни задавате въпроси или да споделите този урок с приятелите си в любимите си социални мрежи.
