Для сайтов на движке WordPress часто нужно создать привлекательные блоки внимания – небольшие фрагменты информации, которые отличаются от основного стиля оформления. Их цель — обратить на себя внимание посетителей, отсюда и название.
Что это дает и каким образом это реализовать на ВордПресс, читайте дальше.
Для чего можно использовать
Качественно оформленные блоки внимания можно использовать в самых разных целях, например:
- для рекламы товара или услуги;
- в качестве ярких навигационных элементов, призванных помочь посетителю сориентироваться на сайте;
- для выделения контактов (телефона, e-mail) вместо классической формы обратной связи;
- в качестве стильного и бросающегося в глаза блока перелинковки с картинкой и встроенной ссылкой.
Делаем блок внимания плагином
WordPress — одна из самых популярных CMS, в том числе благодаря большому выбору доступных плагинов, способных решить практически любую задачу. Если стоит цель не просто ознакомиться с потенциалом улучшения визуальной составляющей сайта, а сделать качественное оформление, воспользуйтесь этой возможностью.
Одним из наиболее интересных программных расширений для WP можно назвать плагин WPRemark. Именно его рассмотрю в качестве основного примера.
WPRemark
Этот инструмент от команды WPShop подойдёт для всех.
Новичку на ниве сайтостроения понравится простота использования плагина, за счёт чего он сможет за короткое время сделать несколько аккуратно оформленных на свое усмотрение страниц.
Продвинутого пользователя обрадует большое количество возможностей, интуитивно понятный кастомайзер, внушительный выбор пресетов и иконок.
Предустановленные иконки простые, но стильные и качественно оптимизированные, поэтому не нагружают веб-страницу.
Более того, все они прорисованы по сетке, из-за чего выглядят хорошо на любом пользовательском устройстве (ПК, планшеты, смартфоны и даже ТВ).
Разработчики также позаботились о том, чтобы при использовании не было проблем с авторскими правами. Иначе говоря, их можно применять в коммерческих целях.
Если кому-то из пользователей WPRemark потребуются какие-либо еще иконки, он всегда может обратиться в техподдержку WPShop с просьбой нарисовать нужный вариант. Создатели рассматривают все предложения и постепенно реализуют.
Пожалуй, главный недостаток — плагин платный. Но стоит он недорого. К тому же лицензия приобретается на все время, а не на строго ограниченный период, как принято за рубежом. Сейчас действуют официальные скидки, поэтому поторопитесь.
Дарю промокод: Скидка -15% на WPRemark
Существует также несколько бесплатных WP-плагинов, которые выполняют аналогичные задачи, но не являются столь многофункциональными. Кроме того, сделанные с их помощью блоки сегодня выглядят устаревшими, так как большинство из них создатели забросили.
Все блоки внимания в этой статье оформлены именно с помощью этого плагина.
Special Text Boxes
Начну с плагина Special Text Boxes.
Simple Alert Boxes
Как и другие бесплатные плагины, Simple Alert Boxes предоставляет минимум вариантов оформления блоков внимания.
Drop Shadow Boxes
С Drop Shadow Boxes дела обстоят несколько лучше, согласно высокой оценке пользователей (97 %).
Как и предыдущие бесплатные WordPress-утилиты по созданию блоков внимания, не поддерживает русский язык, а также требует работы с программным кодом.
Stellissimo Text Box
Недостатки у Stellissimo Text Box общие для всей группы подобных плагинов, за исключением WPRemark.
Плагин не тестировался с 3 последними версиями WordPress. Это плохой знак, который говорит о том, что, возможно, разработчики перестали его поддерживать и развивать. Официальный сайт данного модуля также недоступен.
Simple Note
Простенький плагин Simple Note позволяет выводить на сайте блоки внимания без необходимости вмешиваться в код напрямую.
Помимо минимального числа настроек, есть еще одна серьезная недоработка: красиво оформить можно только текст.
Shortcodes Ultimate
Этот мультифункциональный плагин, Shortcodes Ultimate, требует рассмотрения в отдельной статье, так как его возможности не ограничиваются только блоками цитирования.
Предлагает много других способов визуального оформления информации (колонки, таблицы и пр.). Но конкретно по блокам внимания в бесплатной версии практически не дает ничего настроить под себя.
В данном WordPress-модуле радуют регулярные обновления. Однако новичку он может не подойти из-за большого количества настроек, некоторые из которых не слишком очевидны.
WP-Note
WP-Note от alado удобен и прост в использовании. Но массовую популярность не приобрел: в репозитории WordPress значится всего 400+ активных установок. Это и понятно: в плагине крайне мало возможностей по сравнению с другими подобными плагинами.
Периодически возникают новые решения для WordPress, а уже существующие исчезают. Закрылись плагины WP-VFC Blocks и WP Special Textboxes. Официальный сайт первого недоступен, а вместо второго поиск предлагает другое решение со схожим названием, которое я упоминала выше, — Special Text Boxes.
Возможности премиум-шаблонов
У платных продуктов выше шансы «удержаться на плаву». Важно понимать, что зачастую программное обеспечение класса premium имеет преимущества перед бесплатными по части качества исполнения, длительной поддержки и качественного справочного раздела.
У WPShop, помимо WPRemark, также есть несколько высококачественных WordPress-шаблонов, содержащих встроенные блоки внимания. Для большинства информационных сайтов их более чем достаточно, и при разумном использовании они действительно украшают сайт.
Yelly
Основная задача данного шаблона — помощь в распространении информации через социальные сети.
На промо-сайте Yelly можно ознакомиться с примерами некоторых элементов, а также посмотреть на специальную демонстрационную веб-страницу. Эта WP-тема уже активно используется на более чем 4500 сайтах.
Помимо блоков внимания, Yelly содержит следующие интересные элементы:
- Кнопки «Поделиться» уже встроены в тему. Нет необходимости в подключении дополнительных библиотек, скриптов и т. п. Можно легко менять положение кнопок и акцентировать внимание на главном элементе. Также есть возможность встраивания в картинки или фотографии на сайте.
- Заметная полоса при прокрутке страницы. Довольно распространённый и эффективный метод привлечения внимания, который сегодня можно увидеть на многих сайтах.
- Интегрированная социальная плашка для YouTube-роликов для наращивания пользовательских репостов.
Взять Yelly выгодно
Cook It
Тема Cook It для заядлых кулинаров может помочь поместить рекламу или созданный самостоятельно пользовательский баннер в любой части контента: в начале, в конце, после любого абзаца.
Причем отображение можно настроить отдельно на мобильных устройствах и стационарных компьютерах.
Cook It по лучшей цене
Читайте подробный обзор топовой кулинарной темы WordPress на русском языке.
Root
В Root имеется достаточно вариантов по созданию блоков внимания.
В редакторе WordPress есть выбор среди нескольких типов оформления: вопросительных, предупреждающих, справочных и т. д.
Также контент-менеджер вашего проекта может создавать и выводить в тексте спойлеры (небольшие элементы, при нажатии на которые открывается дополнительная информация), цветные панели с текстом, стилизовать таблицы и списки (нумерованные либо маркированные).
Активировать промокод на знаменитый шаблон
Инструкцию по настройкам шаблона Root с полным разбором всего функционала найдете по ссылке.
JournalX
Шаблон JournalX может похвастать гибкими настройками рекламного содержимого, а также уже ставшими традиционными для продуктов WPShop блоками, цепляющими внимание пользователей.
Среди кусочков основного контента статьи или новости можно разместить стороннюю публикацию, афишу или нечто другое, что будет выделяться на общем фоне и даже специально «выезжать» за боковую границу на территорию сайдбара.
Приобрести JournalX по акции
Reboot
При помощи SEO шаблона Reboot с отличными возможностями по комплексному оформлению статей предоставляет пользователю возможность использовать 3 разных способа привлечения внимания: выделенный цветом текст, цветные панели с иконками в 8 вариантах исполнения, панель «Поделиться» с несколькими ссылками на социальные сети.
Если еще не знакомы с этой замечательной и быстрой темой:
скорее берите Reboot со скидкой
Bono
Отличное решение с поддержкой WooCommerce, если вам необходимо создать онлайн-магазин. В теме Bono есть всё, что нужно для запуска интернет-бизнеса.
Сюда хорошо впишется как контекстная реклама, так и полоска-баннер. А еще можно вывести стильные блоки внимания с градиентом в блоговом разделе сайта.
Шаблон Bono для интернет-магазина по акционной цене
Создание блоков кодом
При создании кода для блоков внимания самостоятельно вам потребуются знания html, php и css. Рекомендую усвоить несколько правил, которые помогут любому кодеру:
- всегда старайтесь структурировать код, чтобы он не был сплошным;
- оставляйте комментарии в тех местах, которые являются неочевидными или неэлементарными для понимания.
Если нет желания обучаться азам программирования, поищите исполнителя на биржах фриланса. Они сделают вам блоки внимания с индивидуальным оформлением за небольшую плату. Но учтите: как правило, иконки такие разработчики берут из интернета, а не рисуют самостоятельно. С дизайнерской отрисовкой выйдет уже совсем другой ценник.
Также советую почитать статью: “Популярный плагин My Popup для создания всплывающих окон для Word Press”
