Контент – король. Но, чтобы король не казался голым, стоит позаботиться о его красивом оформлении. Чтобы текст было удобно воспринимать на вашей странице должны быть визуальные акценты, картинки, видео и блоки внимания. Именно для оформления последних и предназначен плагин WPRemark.

Здесь мы подробно рассмотрим возможности плагина, покажем, как им пользоваться, и проанализируем все его преимущества и недостатки.

Для оформления текста в этом обзоре будут использованы исключительно возможности WPRemark.

Что такое WPRemark

WPRemark – плагин для оформления контента в виде блоков внимания. Он позволяет настроить десяток параметров этих блоков, включая заголовок, текст, иконку, рамки, тени, отступы, фон, скругления углов.

С помощью WPRemark на страницах сайта вы сможете:

  • красиво оформить контент;
  • увеличить конверсию страницы;
  • обозначить важные акценты в тексте;
  • повысить вовлеченность;
  • оформить блоки «Читайте также»;
  • разбавить сплошной текст;
  • выделить ключевые моменты;
  • стимулировать переходы на нужные страницы.

Достоинства WPRemark

Гибкость
В плагине вы найдете более 30+ настроек для разных параметров блоков.
Легкость
Не используются тяжелые стили и скрипты. Расширение не замедляет загрузку страницы.
Универсальность
Все работает в Gutenberg и в классическом редакторе. На любой теме WordPress!
Удобство настроек
Нужные параметры легко задать в меню блоков слева. Настройки разделены на вкладки.
Бесконечная вариативность
Соединяя разные варианты текста, рамок, фона, выравнивания элементов, иконок и теней, вы получаете тысячи способов оформления блоков внимания для сайта на WordPress.

Как вставить блок внимания WPRemark в тексте

Необходимое время: 2 минуты.

Здесь предлагаем пошаговую инструкцию для вставки блоков плагина WP Remark на странице вашего сайта. Инструкция для редактора Gutenberg. Сперва нужно купить плагин на сайте разработчика и скачать его.

  1. Установите и активируйте плагин для WordPress

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

  2. Добавьте блок WPRemark на страницу

    Нажмите на плюсик слева вверху и найдите блок wpremark через поискДобавить блок внимания WordPress

  3. Настройте внешний вид блока

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

Использование WPRemark в классическом редакторе

Если вы используете классический редактор, то после установки и активации плагина вы увидите на панели инструментов иконку плагина:

Иконка плагина в Classical Editor

После нажатия на иконку откроется форма, где есть все те же настройки, что и в Gutenberg.

Для добавления блока на страницу нужно задать нужные параметры и внизу нажать кнопку «ОК».

На странице блок будет размещен в виде шорткода с заданными характеристиками:

Настройка WPRemark

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

Стандартные пресеты

Пресеты – готовые блоки, которые можно использовать в один клик. Сейчас в настройках страницы редактирования выводится 8 стандартных пресетов по дефолту, но их можно заменить через меню «Пресеты» в админке плагина. Там их значительно больше. А вскоре разработчики обещают добавить множество новых.

Кто уже знаком с шаблонами WPShop, тот наверняка встречал эти блоки в качестве встроенных в них модулей.

Вот как выглядят стандартные примеры блоков (правда здесь добавлены заголовки).

Блок «Обратите внимание»
Важный факт или информация, которую нужно особо выделить
Ответ на вопрос
Справочные или исторические сведения, которые раскрывают тему
Частая ошибка
Сыграйте на опережение, и укажите читателям как избежать типичной ошибки
Полезный совет
Совет. Не используйте блоки внимания слишком часто, чтобы они не проелись
Важная информация
Подробная информация об одном из аспектов раскрываемой темы
Цитата
Мнение авторитетного эксперта или вырезка из первоисточника
Ошибка
Как и чего делать не стоит
Лайфхак
Совет, который помогает юзерам.

Все восемь пресетов выше можно выбрать в один клик выбрать в меню настроек плагина слева.

А раздел «Пресеты» WPRemark в админпанели WordPress содержит множество готовых решений. Разработчики постоянно загружают новые шаблоны. Чтобы добавить их в список доступных в редакторе Gutenberg, нужно нажать кнопку «Импортировать». Если же стандартные решения для вас лишние, их можно удалить там же.

Импорт и удаление пресетов

Блоки удаляются не на всегда, а только пропадают из области вывода. Их потом можно вернуть, снова использовав импорт.

Иконка

Иконки для текста в плагине являются уникальными. Специально под WP Remark команда нарисовала 239 иконок. Все они имеют очень маленькие размеры (менее 500 байт) и хорошо смотрятся на экране любого размера.

Вы сможете настроить:

  • Отображение / скрытие иконки в блоке;
  • Использование изображения вместо символа;
  • Цвет;
  • Размеры (ширину, высоту);
  • Целых 12 положений внутри блока и отступы.

Огонь! Иконки в настройках ищутся за русскоязычными названиями.

Фон

Выберите цвет фона или отключите его. Также плагин позволяет использовать в качестве фона картинку, изменить его положение, повторение и размер.

Рамка

Рамки WordPress для текста смотрятся очень круто и позволяют выделить самое важное.

Вы можете задать для рамок такие настройки:

  • Расположение (снизу, сверху, справа, слева)
  • Толщина границ
  • Стиль границы (точки, сплошная, двойная, пунктир)
  • Цвет.
Горизонт
Угловая
Боковая
Сплошная
Пунктирная
Двойная

Тень

Хотите придать блоку объема?! Без проблем. Используйте тени. Задайте им параметры растяжения, сдвига по осям, размытия и непрозрачности. Все это просто перетягивая ползунок мышкой. Тень лучше не сочетать с толстыми рамками, а в остальном нужно экспериментировать.

«Не бойся теней, они означают, что рядом горит свет».

Пример блока с тенями

Заголовок

Заголовок для блока придется вписывать в настройках. Но он и далеко не всегда нужен! Для отображения заголовка отметьте соответствующий пункт галочкой.

Параметры и включение заголовка WPRemark
Настройки заголовка 1
Стили для заголовка
Настройки заголовка 2

Также в подменю задаются:

  • Выравнивание;
  • Цвет;
  • Стили оформления: жирный, курсив, перечеркнутый, верхний регистр;
  • Высота шрифта и строки.
Ваш заголовок
А вот как выглядит блок с тайтлом

При этом, заголовок не обернут в какой-то из тегов H1-H6. По сути это обычный текст з заданными стилями.

Текст

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

Выравнивание, цвет текста и ссылок
Цвет текста и ссылок
Стили шрифта, размер текста и высота строки WPRemark
Стили и размеры шрифтов
Лайфхак. Изменять жирность шрифта отдельных слов внутри блоков нельзя, но если вы скопируете стилизованный текст из другой области, то он и останется болдом.

Расширенные настройки

В этом пункте задаются различные внутренние и внешние отступы. Сверху, снизу, справа и слева.

Но куда востребованнее настройка скругления границ блока.

Также здесь задается тег, в который оборачиваются блоки: blockquote или div.

Настройка отступов WPRemark
Дополнительные параметры, отступы
Настройка скругления углов ВП Ремарк
Скругление углов и тег

Дополнительно

А если кому-то нужны специфические стили, то в этом подменю можно добавить свои CSS-классы.

Дополнительные настройки

Почему стоит купить WPRemark

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

Эти ребята умеют делать быстрые и функциональные решения для WordPress с адекватным ценником. Вполне вероятно вы уже слышали об их других разработках (плагины – Cleary Pro, WpStories, ExpertReview; темы – Bono, Root, JournalX, CookIT, Yelly). Все эти шаблоны и плагины быстрые, функциональные и недорогие.

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

И вот он уже здесь. И теперь особые блоки можно использовать в любой теме!

Но как оказалось, в блоках внимания WPRemark куда больше возможностей, чем было в теме. Оформление на любой вкус. С разными цветами, иконками, рамками и даже тенями.

Вдобавок к этому вы получаете:

  • Год поддержки с возможностью решать трудности и задавать любые вопросы, связанные с работой ВПРемарк;
  • Бесплатные пожизненные обновления;
  • Возможность предлагать свои идеи по добавлению в плагин нового функционала. И судя по другим продуктам компании, самые интересные предложения могут быть реализованы.

И самое главное, адекватная цена. 970 рублей – на 1 сайт, а 2480 – на неограниченное количество сайтов. Можно купить на один, а потом просто доплатить разницу и получить безлимитку!

Что бы еще хотелось увидеть в плагине

Эти пожелания — исключительно субъективное мнение автора обзора.

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

Что еще бы хотелось:

  • Кнопки, их очень не хватает
  • Возможность сохранять свои шаблоны напрямую в список пресетов.

Плюсы и минусы WPRemark

Интуитивно-понятный
Легкий и быстрый
Универсальный
Своя сборка. Вы можете собрать для каждого сайта нужные наборы пресетов и использовать готовые решения в один клик.
Год поддержки
Lifetime обновления
Нет аналогов
Единственным минусом для некоторых может быть платность плагина. Но за такое качество и функционал стоит заплатить. Ведь за 2500 рублей вы получаете неограниченную лицензию, и можете использовать WPRemark на десятках и даже сотнях сайтов.

Видеообзоры плагина от разработчиков

Презентация плагина
Обзор возможностей и настроек

Вопросы о плагине

Какой плагин можно использовать для оформления контента на WordPress?

Один из оптимальных — WPRemark. Он позволяет выделить определенные блоки и органично добавить в них разные элементы.

Почему стоит купить WPRemark сейчас?

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

Какая цена плагина WPRemark?

970₽ — на 1 сайт, 1940₽ – на 3, 2480₽ — на любое количество сайтов.
Стоимость WPRemark

А на моей теме он будет работать?

Да, плагин универсален и работает с любой темой WordPress.

Можно ли сначала поставить лицензию на 1 сайт, а потом перенести ее на другой?

Да, можно. Это делается в личном кабинете пользователя на сайте wpshop.ru.

Какие есть альтернативы этому плагину?

Достойных практически нет. Бесплатные аналоги, которые есть в директории wordpress.org, либо давно не обновляются, либо содержат минимум настроек.

WPRemark работает в редакторе Gutenberg?

Да, он поддерживается как в новом, так и старом редакторе WordPress. Такое встречается довольно редко.

Что с этим плагином можно сделать такого, чего не позволяет Gutenberg?

Здесь все делается на автомате, тогда как в штатном редакторе на создание подобных блоков уйдет в несколько раз больше времени. Да и без работы с кодом вы не сможете добавить рамки и тени.

А что со скоростью сайта после добавления на страницу блоков от WPRemark?

Уже протестировал, все отлично. Иконки легковесные, скорость остается такой же, как и без блоков.

Что можно настроить в плагине?

Практически любые визуальные параметры, которые относятся к выделенным блокам в тексте.

Как сделать красивые выделения на страницах wordpress?

Используйте готовые пресеты плагина ВПРемарк или настройте каждый элемент оформления отдельно.

Работает ли WPRemark в классическом редакторе?

Да, вставлять блоки можно через шорткоды.

Еще примеры оформления блоков внимания для Вордпресс

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

Пример стандартного пресета
С фоном в виде картинки
С рамкой снизу и сверху
Блок со сплошной рамкой
Залоговок
Блок внимания с заголовком
Закругленные углы
Блок внимания с тенью
С измененным местом иконки
Без иконки, но со ссылкой
С акцентом на текст
С ПУНКТИРНОЙ РАМКОЙ