Как да направим хоризонтална навигация от втори ред в WordPress

С персонализираните менюта от WordPress създаването на навигация на страницата изисква по-малко усилия. Дори създаването на диференцирани менюта изисква само няколко кликвания, а не редактиране на файлове с шаблони. Ако сте искали многостепенна втора навигация, която също е хоризонтална, можете да използвате тази функция и да добавите няколко CSS настройки. Това позволява на уебсайта на фирмата ви да предлага повече връзки в менюто от страниците, публикациите и друго съдържание, вече в блога ви, и да използват по-добре пространството в темата на WordPress.

Добавяне на менюта

1.

Инсталирайте тема като Twenty Eleven, която използва опцията "Custom Menu" на WordPress.

2.

Влезте в таблото за управление на WordPress и кликнете върху „Менюта“ под „Външен вид“. Въведете име за менюто си в текстовото поле и кликнете върху „Създаване на меню“, за да направите ново меню.

3.

Изберете страници или категории от списъците и кликнете върху „Добавяне в менюто“, за да ги добавите към менюто си като първо ниво.

4.

Изберете страниците, които искате да се показват като второ ниво, и кликнете върху бутона "Добавяне". Кликнете и плъзнете елемента, който се появява надясно, и го преместете така, че да се извисява над категорията или страницата на първия ред. Тя ще прихване под елемента, добавяйки го към поднавигацията.

5.

Повторете този процес за всички страници и подстраници. Кликнете върху „Запазване на менюто“, когато приключите.

Редактиране на CSS

1.

Отворете CSS файла или чрез достъп до вашия сървър чрез FTP или чрез отваряне на файла в редактора на таблото за управление на WordPress.

2.

Намерете редовете за "#navigation" и ".sub-menu". Вие ще искате да промените класа на елементите от списъка на под-менюто, за да го оставите в ляво и да го покажете като вграден, за да направите този хоризонт хоризонтален. Например CSS може да изглежда подобно на следното:

.sub-menu li {float: left; дисплей: inline; }

Можете, разбира се, да добавите подплата, полета, цветове и други атрибути, които харесвате.

3.

Добавете персонализирания CSS клас към връзките си, ако промяната на CSS файла не промени незабавно сайта. Можете да направите това, като влезете в WordPress, като влезете в потребителските менюта, щракнете върху "Опции на екрана" и изберете "CSS Classes". Когато разширявате отделните подменюта, можете да добавите "подменю" като клас.

Бакшиш

  • Можете да приложите различен CSS клас към всеки елемент от списъка, за да го разграничите. Например, всичките ви подменюта могат да използват различен цвят на шрифта.

Препоръчано