Навигация и меню в Wordpress

Иконки в меню WordPress — добавляем вручную и с плагином

Существует несколько причин для создания в WordPress меню с картинками (иконками). Во-первых, это отличный способ сэкономить место, заменив название главной страницы на «домик». Во-вторых, некоторые символы говорят намного больше нежели текстовые значения — кнопки Facebook, Twitter и т.п. И наконец, в-третьих, графические элементы могут сделать навигацию еще нагляднее за счет добавления изображений, например, в списке категорий. Все три варианта вы можете видеть с превьюшке поста слева. А ниже я расскажу как их можно реализовать. 

Оцените статью:

(голосов - 22, средний балл: 4,59 из 7)

Загрузка...

Категории: Возможности; Начинающим;

Редактируем меню личного кабинета WooCommerce (как добавить / удалить пункт)

В блоге я рассматривал около десятка задач по навигации на сайте: были списки ссылок, хлебные крошки, работа с пунктами меню админки и т.п. Сегодня чуть более экзотическая ситуация, которая случается не так часто, но все же имеет место быть. Речь пойдет о личном кабинете покупателя в WooCommerce, где также используется элемент навигации. Будем учиться его модифицировать — а именно добавлять новые пункты либо скрывать ненужные. Вторая задача встречается почаще, но мы уделим внимание обеим.

Оцените статью:

(голосов - 3, средний балл: 7,00 из 7)

Загрузка...

Категории: WooCommerce; Хаки и секреты;

Создаем WooCommerce меню категорий и не только (через админку, виджеты, плагины)

Есть у некоторых разработчиков плагинов нехорошая привычка скрывать важные опции во вкладку «Настройки экрана». Отчасти из-за этого раньше я создавал навигацию для магазина через добавление произвольных ссылок, вручную прописывая URL’ы. Каково же было мое удивление, когда в одном из проектов увидел полноценное WooCommerce меню категорий товаров. Сегодня расскажу как легко его реализовать + рассмотрю другие смежные нюансы. В работе нам помогут некоторые виджеты и, рассмотренный ранее, модуль MegaMenu. 

Оцените статью:

(голосов - 2, средний балл: 7,00 из 7)

Загрузка...

Категории: WooCommerce; Виджеты; Возможности;

Ссылки на предыдущие / следующие WordPress записи: функции next_post_link, previous_post_link и др.

В статье про оформление записей блога я рассмотрел примеры и коды для вывода некоторых дополнительных информационных элементов на страницах постов: связных заметок, названий тегов/категорий и т.п. Похожей фишкой также являются ссылки на предыдущие и следующие WordPress записи. Данные линки будут полезны при навигации посетителей сайта, а также являются еще одним способом перелинковки. Именно поэтому стараюсь добавлять их в каждый свой проект. 

Оцените статью:

(голосов - 4, средний балл: 5,50 из 7)

Загрузка...

Категории: Возможности;

Создаем список ссылок в сайдбаре с картинками +плагины блогролла

Недавно в заметке о плагинах популярных постов меня спросили как лучше организовать простой список ссылок в сайдбаре. Причем желательно, чтобы там присутствовали миниатюры, и все было максимально легко без сверхсложных модулей. Вопрос оказался не совсем однозначным, поэтому в статье решил рассмотреть несколько ситуаций.

Отчасти решение зависит от конкретной поставленной задачи. Во-первых, какие именно объекты нужно выводить в боковой панели сайта: посты блога? перелинковку произвольных страниц? внешние линки?

Оцените статью:

(голосов - 2, средний балл: 6,50 из 7)

Загрузка...

Категории: Виджеты; Возможности; Начинающим;

Max Mega Menu — функциональный плагин мега меню для WordPress сайтов

Насколько я понимаю, под термином мега меню в WordPress подразумевают сверхфункциональное огромный блок навигации по сайту со множеством разных элементов: списками, картинками, текстами, слайдерами и т.п. Наверняка вы такие встречали. Когда-нибудь опубликую полноценную подборку по теме, но сегодня речь пойдет о вполне конкретном решении — плагине Max Mega Menu. Выбрал его так как уже тестировал в работе для WooCommerce меню, он часто попадает в списки лучших модулей, плюс тут имеется одна из самых толковых и постоянно развивающихся бесплатных (Lite) версий. 

Оцените статью:

(голосов - 2, средний балл: 7,00 из 7)

Загрузка...

Категории: Плагины;

Разное обычное и мобильное меню в WordPress, функция wp_is_mobile, плагин WP Responsive Menu

В процессе работы над одним интернет-магазином у меня возникла ситуация, когда основное горизонтальное WordPress меню содержало около двух десятков ссылок. На сайте их легко можно оформить в виде выпадающих списков, но в мобильной версии все это скапливалось в одном блоке. Такой элемент выглядит «захламленным» и, вероятно, мешает некоторым пользователям сориентироваться.

Одним из выходов из ситуации есть создание альтернативного мобильного меню в WordPress, которое бы имело упрощенный вид и содержало лишь ссылки на основные разделы.

Оцените статью:

(голосов - 3, средний балл: 7,00 из 7)

Загрузка...

Категории: Возможности; Плагины;

Как убрать пункты меню в WordPress админке

В блоге найдете много статей по оформлению меню сайта, которое служит навигацией для посетителей вашего веб-проекта, например, были заметки о специальной функции wp_nav_menu, использованию иконок в меню или про создание хлебных крошек. Но сегодняшний пост посвящен немного другой теме — я поделюсь приемами модификации элементов внутри админки, в частности обсудим как убрать меню в WordPress, избавиться от ненужных разделов, выборочно скрывать пункты и т.п.

Я начинал данную тему с одной лишь задачи, что требовалось для недавнего проекта, однако со временем собрал несколько полезных фишек.

Оцените статью:

(голосов - 5, средний балл: 6,80 из 7)

Загрузка...

Категории: Возможности; Хаки и секреты;

Создаем хлебные крошки для WordPress сайта

Хлебные крошки в Вордпресс (Breadcrumbs) или в любой другой CMS — это дополнительная навигация по сайту, что отображает ваше положение относительно иерархии проекта. То есть, грубо говоря, данное меню показывает в каком разделе, странице или категории вы в текущий момент находитесь. Многие пользователи считают этот элемент именно «меню», т.к. он содержит активные ссылки с возможностью перехода. Не буду спорить о терминологии, а лучше расскажу обо всех сложностях и нюансах, возникающих при настройке хлебных крошек в WordPress.

Оцените статью:

(голосов - 20, средний балл: 4,55 из 7)

Загрузка...

Категории: Плагины;

Advanced Sidebar Menu — виджет зависимого бокового меню для wordpress

Давайте рассмотрим решение одной тривиальной задачи с wordpress меню которая время от времени встречается разработчикам. Бывает, что на сайтах нужно выводить сразу два меню, которые при этом между собой взаимосвязаны: одно верхнее горизонтальное 1-го уровня, а второе в сайдбаре 2-го уровня. Причем в боковом отображаются только те подпункты, для которых  выбран соответствующий родительский элемент в главном меню. Например, если у вас в шапке сайта есть перечень стран, то выбрав, допустим, Италию, в сайдбаре получите только лишь список итальянских городов.

Оцените статью:

(голосов - 5, средний балл: 5,80 из 7)

Загрузка...

Категории: Виджеты; Плагины;

Простое раскрывающееся вертикальное меню в WordPress

Для некоторых веб-проектов разработчики используют раскрывающееся вертикальное меню, где изначально все подразделы скрыты и отображаются только при клике на родительский элемент. Несколько раз я сталкивался с данной задачей, но, убеждал заказчиков отказаться от подобной реализации. Дело в том, что для небольшого числа страниц на сайте эффективность такого решения минимальна — намного лучше, когда посетитель сразу видит все доступные ссылки.

Итак, если у вас в проекте имеется сложная структура меню со множеством подразделов и страниц в них, то в целях экономии места вполне можно использовать раскрывающийся эффект. Рассмотрим его реализацию для WP с помощью CSS и JavaScript.

Оцените статью:

(голосов - 3, средний балл: 5,00 из 7)

Загрузка...

Категории: Возможности;

Использование иконок шрифта Font Awesome в WordPress

Font Awesome — это один из тех шрифтов, где вместо букв содержатся разные иконки: начиная от каких-то системных изображений по типу галочек, звездочек, папок и заканчивая иконками смартфонов, автомобилей, техники и т.п. При подключении шрифта на сайт вы можете использовать и размещать их на страницах своего веб-проекта. Сегодня рассмотрю пару базовых примеров дабы вы поняли зачем это нужно, как выглядит и как реализуется. Использовать мы будем шрифт Font Awesome хотя подобных бесплатных шрифтов с иконками есть несколько.

Оцените статью:

(голосов - 9, средний балл: 5,56 из 7)

Загрузка...

Категории: Возможности; Хаки и секреты;