как сделать категории в меню
Создаем WooCommerce меню категорий и не только (через админку, виджеты, плагины)
Есть у некоторых разработчиков плагинов нехорошая привычка скрывать важные опции во вкладку «Настройки экрана». Отчасти из-за этого раньше я создавал навигацию для магазина через добавление произвольных ссылок, вручную прописывая URL’ы. Каково же было мое удивление, когда в одном из проектов увидел полноценное WooCommerce меню категорий товаров. Сегодня расскажу как легко его реализовать + рассмотрю другие смежные нюансы. В работе нам помогут некоторые виджеты и, рассмотренный ранее, модуль MegaMenu.
По формату заметка будет напоминать перечень ответов и подсказок по типовым ситуациям. Практически все задачи взаимосвязаны, поэтому советую почитать статью от начала и до конца, а затем задавать вопросы. Содержание:
Меню категорий WooCommerce
Здесь есть несколько подходов. В начале рассмотрим классический вариант создания меню в WordPress через специальный инструмент в админке. Его особенностью является то, что пункты размещаются вручную, а следовательно вы можете сформировать любой результат, который вам нужен.
Навигационное горизонтальное меню WooCommerce
Если разрабатываете тему с нуля, то вам придется использовать функции вывода меню. Однако в большинстве случаев речь идет о готовом шаблоне, а там зачастую изначально предусмотрены специальные области отображения навигации. В таком случае в этом же разделе админки переходите во вкладку «Управление областями».
Здесь все, в принципе, зависит от конкретного шаблона, но обычно в шапке сайта используют названия по типу Main, Top, Header и др. В документации премиум тем этот вопрос детально описан, но вы легко можете определить соответствующие области, протестировав их вручную.
Также, как правило, разработчики изначально прописывают все стили выпадающего меню WooCommerce будь то или обычный список страниц. Вам нужно лишь создать соответствующую иерархию элементов в админке.
Продвинутое меню категорий WooCommerce
Самый популярный навигационный плагин меню WooCommerce, с которым я непосредственно работал — это Max Mega Menu (по ссылке найдете его обзор и принцип настройки). Не буду сейчас повторяться, а лишь пару слов скажу о том, как можно использовать данный модуль в магазине. Радует, что его бесплатных функций вполне достаточно.
Итак, когда плагин уже установлен, при наведении на разные пункты увидите соответствующую кнопку:
WooCommerce меню в сайдбаре
Список категорий продукции, располагающийся на сайте в сайдбаре справа или слева — традиционный элемент интернет-магазинов. Теоретически вы можете использовать методику, описанную в самом начале статьи, но есть и второй способ — создание навигационного меню в WooCommerce с помощью виджета, который называется «Категории товара».
Из настроек элемента пользователю доступны:
Пользовательский класс и видимость на скриншоте выше, скорее всего, являются опциями установленной темы, а не конкретного виджета. Не забудьте сохраниться.
Отличительной фишкой такого подхода есть то, что результат формируется автоматически — то есть при добавлении в магазине новой категории товаров в админке, она сразу появится здесь. По теме не могу не упомянуть хак позволяющий скрыть категорию Woocommerce в данном блоке, если вдруг потребуется.
Также сделать меню WooCommerce в сайдбаре вы можете, совместив первый метод из текущей статьи и специальный виджет «Произвольное меню»:
В настройках указываете заголовок (если нужно) и выбираете один из ранее созданных объектов. Затем сохраняете виджет. Отображается информация в виде списка, при желании ее можно оригинально оформить через CSS стили.
Итого. Этих четырех методов создания WooCommerce меню с категориями товаров должно хватить в большинстве ситуаций. Недавно также рассмотрел как редактировать меню личного кабинета WooCommerce — возможно кому-то пригодится. Иногда встречаются задачи с добавлением корзины в навигационный блок, но это относится больше к другой теме. В крайнем случае попробуйте реализовать ее через Mega Menu или соответствующую функцию в шаблоне. Если что-то новое будет появляться, обновлю статью.
Дополнения и вопросы по статье традиционно пишите ниже.
Как добавить категорию в меню WordPress? Создание отдельного меню для разных рубрик.
В данной статье я покажу вам, как вывести рубрики в меню сайта на WordPress, а также рассмотрим работу с плагином, который создает возможность задать логику вывода дополнительных меню на отдельных страницах категорий.
Если вам необходимо добавить рубрику в основное или любое другое меню сайта, то для этого можно воспользоваться встроенным функционалом WordPress.
Алгоритм работы следующий.
1. Заходим в админку, и переходим в раздел «Внешний вид» — «Меню».
2. Выбираем или создаем новое меню, с которым вы будете работать.
3. Слева в блоке «Добавьте элементы меню», выбираем вкладку «Рубрики».
4. Далее в верхней навигации выбираем пункт «Все» и в списке ставим чекбокс напротив нужной категории.
5. Нажимаем кнопку «Добавить в меню». После этого ваш пункт меню отобразиться в правой части данного блока.
6. Нажимаем на него, чтобы отредактировать. Тут у вас есть возможность указать текст ссылки, проще говоря, название самого меню. Это крутая опция, если вы создали длинное название рубрики для seo оптимизации, то тут вы можете сократить его, чтобы оно гармонично вписывалось в дизайн сайта.
Также, у вас есть возможность с помощью мышки, перетащить пункт меню в нужную вам позицию. После всех настроек жмете «Сохранить меню», и можно идти смотреть, как оно будет отображаться на сайте.
Вывести созданное таким образом меню можно с помощью виджета «Меню», либо же прописав код для вывода меню непосредственно в файлах WordPress.
Привязка различных меню к рубрикам
Иногда нужно создать отдельные типы навигации внутри самих рубрик, и так, чтобы в каждой отдельной рубрике было свое меню. В таком случае вам нужно воспользоваться логическими операторами. Сделать это можно с помощью кода, например функции is_category(), например, используя id рубрики или же slug, редактируя файлы вашей темы. Второй вариант – это установить плагин, который дает возможность задавать логику вывода меню. В данной статье мы рассмотрим плагин — Menu Item Visibility Control. Он позволяет использовать в качестве параметров встроенные в WordPress — Conditional Tags и таким образом контролировать настройки вывода меню.
Давайте разберемся, как с ним работать.
1. Устанавливаем плагин. Для этого в админке переходим в раздел «Плагины» — «Добавить новый».
2. В поиске вписываем название плагина – «Menu Item Visibility Control». Жмем установить, и активировать плагин.
3. После этого переходим в раздел «Внешний вид» — «Меню» и выбираем нужное нам меню. Далее справа выбираем пункт меню и жмем стрелку для его редактирования. Вы увидите, что появилось новое поле Visibility logic.
4. В этом поле нам нужно указать логику вывода меню, в нашем случае это касается рубрик. Со всем списком условных тегов WordPress, вы можете ознакомиться вот тут — https://codex.wordpress.org/Conditional_Tags. Допустим, в нашем случае мы хотим вывести рубрику «Подкатегория» в меню только для категории «Название рубрики», которая имеет параметры: id – «19» и slug – «podrubrika». Для этого в поле Visibility logic для пункта меню «Подрубрика» мы можем указать следующий код.
Вот как это выглядит в админке.
Жмем «Сохранить меню».
Теперь пункт меню «Подрубрика» будет появляться в меню только после перехода на страницу категории «Название категории». С помощью условных тегов вы можете настроить любую необходимую вам логику работы меню. Используя эти же теги, вы можете и в шаблоне с помощью кода делать то же самое.
На этом сегодня все. Жду ваших комментариев.
Создание новых категорий товаров в WooCommerce
Здравствуйте друзья! В этот уроке вы узнаете как добавлять новые категории товаров в интернет-магазин WooCommerce.
Новые категории можно добавлять непосредственно и при добавлении самого товара, но в данном уроке мы рассмотрим более классический вариант добавления.
Как добавить новые категории товаров в WooCommerce
В открывшемся окне мы видим поля для заполнения, в которых необходимо указать название новой категории и выбрать родительскую категорию если необходимо.
После того как вы указали в соответствующем поле название и указали родительскую категорию (необходимо), не забудьте нажать кнопку «Добавить новую категорию товаров». После этого категория будет создана и доступна в выборе категорий при добавлении товара.
Если вы настроили правильно ЧПУ для WooCommerce — указывать ярлык не нужно. Он будет генерироваться сам, и сразу латиницей.
Напомню, что родительскую категорию нужно указывать для создания правильной иерархии товаров и их категорий.
Например если у вас интернет-магазин бытовой техники — вначале создаем категорию «Бытовая техника» без родительской категории, а при добавлении последующих категорий относящихся к бытовой технике (например Холодильники, Стиральные машины, Пылесосы) указываем родительскую категорию «Бытовая техника».
На изображении ниже вы увидите пример добавления категории «Пылесосы» в категорию «Бытовая техника»:
Теперь при добавлении нового товара у вас будет выбор созданных категорий с правильной иерархией.
Пример выбора категории «Холодильники», которая относиться к «Бытовой технике»
Как видите, создание категорий достаточно простой процесс, который не требует особых навыков или больших затрат времени.
И еще раз напомню, если у вас возникнут какие-либо вопросы — смело задавайте их в комментариях!
Спасибо за внимание!
Обзор
Проголосуйте за урок
Оценка
Итог : Уважаемые читатели! Если вам понравилась статья не поленитесь проголосовать и оставить комментарий, ведь так я смогу понять полезность уроков и статей, и улучшить их качество в будущем. Заранее спасибо!
Красивое меню с подкатегориями
С помощью HTML, CSS и jQUery у нас должно получиться прекрасное меню, которое станет украшением любого сайта.
Прежде всего нам необходимо вставить следующий код между тегами :
Здесь мы подключаем необходимые скрипты и таблицу стилей. Далее идет черед оформления меню в виде неупорядоченного списка. Ниже Вы можете увидеть структуру нашего тестового меню:
Вот и все! Пользуйтесь, на здоровье! Всем хороших выходных 🙂
Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: www.justjquery.com
Перевел: Максим Шкурупий
Урок создан: 16 Мая 2009
Просмотров: 61263
Правила перепечатки
5 последних уроков рубрики «jQuery»
Анимация набора текста на jQuery
Сегодня мы бы хотели вам рассказать о библиотеке TypeIt — бесплатном jQuery плагине. С её помощью можно имитировать набор текста. Если всё настроить правильно, то можно добиться очень реалистичного эффекта.
Временная шкала на jQuery
jQuery плагин для создания временной шкалы.
Заметка: Перезагрузка и редирект на JavaScript
Быстрая заметка, где вы сможете найти парочку JS сниппетов для перезагрузки и перенаправления пользователей через JavaScript.
Рисуем диаграмму Ганта
jQuery плагин для создания диаграммы Ганта.
AJAX и PHP: загрузка файла
Пример того как осуществить загрузку файла через PHP и jQuery ajax.
Как добавить категории в WordPress? (Все сценарии)
Одна из ключевых функций WordPress – это возможность категоризировать ваш контент. Вы можете отображать свой контент на веб-сайте в разных тегах и категориях.
Вы можете создать несколько подкатегорий для каждой из ваших категорий. В этой статье мы научим вас добавлять категории в WordPress.
Что такое категория WordPress и дочерняя категория?
С помощью категорий вы можете организовать свой контент. Важно с самого начала создать прочную структуру для вашего сайта. Но если вы захотите изменить или создать свою таксономию позже, есть способ сделать это.
Представьте, что вы создали сайт туристических достопримечательностей. Ваши посетители предпочитают осматривать достопримечательности каждой страны и города в одиночку.
Например, вы создали веб-сайт туристических достопримечательностей со всего мира и создали раздел о Новой Зеландии.
Лучше всего делать контент на основе разных городов (Окленд, Веллингтон и т.д. ). Убедитесь, что вы также используете подкатегории. Страна Новая Зеландия должна быть вашей родительской категорией, а Окленд – подкатегорией.
Вам не обязательно добавлять контент одновременно в подкатегорию и родительскую категорию. Например, когда вы пишете статью о туристических достопримечательностях Окленда, у вас есть возможность добавить ее в категории Окленда и Новой Зеландии.
Это предотвратит создание повторяющегося контента. Если вы добавляете статью только в подкатегорию, то статья будет заархивирована в подкатегории.
Как добавить категории в WordPress?
Чтобы добавить категории в WordPress, при создании публикации прокрутите вниз, пока не увидите «Добавить новую категорию», и нажмите на нее.
Вы также можете создать категорию, не редактируя свой пост. На панели управления WordPress нажмите «Сообщения», а затем «Категории».
На открывшейся странице вы можете создать новую категорию или отредактировать старые категории.
Как создать дочернюю категорию в WordPress
Добавить подкатегорию так же просто, как добавить категорию в WordPress. Как и выше, нажмите «Добавить новую категорию». Введите название своей категории и в раскрывающемся меню выберите родительскую категорию.
Другой способ – это, конечно, добавить подкатегорию, не редактируя пост. На панели управления WordPress нажмите «Сообщения», а затем «Категории».
Выберите имя и в раскрывающемся меню «Родительская категория» выберите родительскую категорию. Кроме того, убедитесь, что вы выбрали имя в разделе Slug.
Как назначить посты по категориям?
Есть два простых способа. Первый способ – просто выбрать категорию во время публикации сообщения.
Для этого просто прокрутите вниз, пока не увидите поле «Категории», и отметьте нужную категорию для своего сообщения.
Второй способ – перейти на панель управления WordPress, навести курсор на «Записи» и нажать «Все публикации».
Выберите сообщения, к которым вы хотите добавить категории. В меню «Массовое действие» выберите «Изменить» и нажмите «Применить». На вашем экране появится новое окно. Найдите раздел “Категории”. Выберите нужную категорию и нажмите «Обновить».
Теперь выбранные вами сообщения находятся в нужной категории.
Как добавить описание к категории?
Чтобы добавить описание к категории в WordPress, вам необходимо его отредактировать. На панели управления WordPress наведите указатель мыши на «Записи» и нажмите «Категория».
Найдите категорию, которую вы хотите отредактировать, и нажмите «Изменить» под ней.
В поле «Описание» введите предпочтительное описание и по завершении нажмите «Обновить», чтобы сохранить изменения.
Как изменить категорию WordPress по умолчанию
Есть два способа изменить категорию по умолчанию:
Как переименовать категорию в WordPress?
Чтобы улучшить SEO сайта, вам может потребоваться переименовать категорию; или вы можете создать новую категорию и перенести в нее связанный контент.
Чтобы переименовать категорию, на панели управления WordPress наведите указатель мыши на «Записи» и нажмите «Категории». Нажмите «Изменить» под категорией. Выберите новое имя и заголовок для категории и нажмите «Обновить», когда закончите, чтобы сохранить изменения.
Имейте в виду, чтобы переименовать категорию в WordPress.com, выполните шаг, упомянутый выше. Однако заголовок изменяется автоматически после переименования категории.
WordPress сам заботится о процессе перенаправления. Потому что идентификационный номер категории не изменился.
Как удалить категорию в WordPress?
Выполните следующие действия, чтобы удалить категорию без потери содержимого.
На панели управления WordPress наведите указатель мыши на «Записи» и нажмите «Категории». В меню «Массовое действие» выберите «Удалить».
При этом все ваши сообщения будут перенесены в категорию по умолчанию. Не волнуйтесь, вы можете отредактировать их позже.
Как удалить категорию и ее сообщения в WordPress?
Помимо добавления категории в WordPress, вы также можете удалить ее.
В предыдущем методе контент остается на вашем сайте. Но что, если мы хотим удалить категорию и все ее содержимое? Затем нам нужно использовать функцию массового редактирования.
Из панели управления WordPress перейдите в Записи. Выберите категорию, чтобы просмотреть все содержимое. Убедитесь, что вы не удаляете не тот пост. Выберите любые сообщения, которые вы хотите удалить, или нажмите «Выбрать все» рядом с заголовком.
В меню «Массовое действие» выберите «Переместить в корзину» и нажмите «Применить». Если ваши сообщения находятся в разных категориях, вам нужно выбрать их по одной и удалить.
Вы также можете использовать плагин Bulk Delete для удаления сообщений и категорий из WordPress.
Некоторые другие указатели на категории
Как использовать категории для улучшения SEO вашего сайта?
Как вы знаете, использование ключевых слов в URL-адресе веб-сайта – отличный способ привлечь посетителей и добиться более высокого рейтинга в поисковых системах. Если вы используете подкатегории в своих сообщениях, у вас может быть хорошее ключевое слово в URL-адресе веб-сайта.
Обычно Категория отображается в URL-адресе. Чтобы удалить категорию из URL-адреса веб-сайта, установите плагин FV Top Level Categories. С помощью этого плагина вы можете удалить слово Категория из URL-адреса веб-сайта.
Всегда старайтесь, чтобы URL вашего сайта был аккуратным и привлекательным.
Вывод
В этой статье мы говорили о добавлении категорий в WordPress, подкатегорий и упомянули некоторые ключевые моменты, касающиеся категорий в WordPress.
Всегда не забывайте использовать ключевые слова в категориях, чтобы улучшить SEO сайта.