Обновление плагина Social Community Popup 0.6.5

Social Community PopupПриветствую! :-)

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

При динамическом формировании JavaScript-файла было огромное количество запросов к базе данных, теперь этот кусок кода отлажен и скрипт должен работать гораздо стабильнее и быстрее на ресурсах с высокой посещаемостью. Уф… Если это не так — напишите мне на почту support@gruz0.ru, разберёмся. :-)

А сейчас позвольте рассказать о новой версии Social Community Popup — 0.6.5.

 


1. Обновлены настройки виджета Facebook в связи с изменением их API

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

2. Виджет Facebook Like Box заменён на Page Plugin

С 23 июня 2015 года используемый и любимый многими виджет Like Box перестанет работать, вместо него предложили использовать новый виджет – Page Plugin, который работает исключительно со страницами, группы поддерживаться не будут.

В общем, это как раз та причина, по которой я на месяц откладывал выпуск версии своего плагина SCP. В новом виджете Page Plugin напрочь вырезана возможность какой-либо правки размеров виджета. Это касается высоты виджета, которая напрямую завязана на размер дочернего контейнера. В общем, если вы не технарь — тогда просто ждите, когда появится обновление и эту неприятность исправят. :-)

Выглядит новый виджет вот так:
Facebook Page Plugin

Для того, чтобы виджет корректно отображался на вашем сайте, рекомендую использовать опцию отображения новостей с ленты вашей страницы и снять две другие опции в разделе Facebook плагина SCP. Вы там всё сами увидите.

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

3. Исправлена проблема с работой виджета ВКонтакте в Mozilla Firefox

Mozilla Firefox тоже повеселил в этом месяце своим странным поведением с соц. сетью ВКонтакте. Скрипт соц. сети загружался, но не отрисовывал свой виджет в том случае, если сам виджет располагался не на первой, а на любой другой вкладке плагина SCP.

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

Перебробовал несколько разных вариантов и решено было использовать хитрый ход — подгружать виджет только при первом открытии вкладки с виджетом ВКонтакте. Именно такой способ позволил сделать загрузку по настоящему Lazy Load. На очереди другие соц. сети.

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

4. Добавлена поддержка персональных страниц соц. сети Google+

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

Виджет для личных профилей

Виджет Google+ для профилей

Виджет для страниц

Виджет Google+ для страниц

Теперь что касается получения новой версии плагина и всех будущих, в том числе.

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

Мне прекрасно понятна ситуация, когда приложение стоит 5-10 тысяч рублей, тут вопрос целесообразности стоит ребром. Но 490 рублей — не та сумма, которую стоит жалеть и пиратить этот простой и удобный в использовании плагин.

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

Скриншоты плагина

Главное окно приложения
Виджет Google+
Виджет Twitter

Как отключить или заблокировать пользователя в WordPress

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

Читать далее «Как отключить или заблокировать пользователя в WordPress»

Почему я не рекомендую плагин wppage

Долгое время люди мучались, терпели, но всё равно пользовались плагином wppage для создания подписных и продающих страниц на WordPress. Оно и понятно — аналогичного плагина на русском языке попросту нет, он простой и доступный для всех желающих, если бы не одно «но»…

У меня за длительное время обслуживания сайтов на WordPress сложилось ярко выраженное мнение, что многие авторы плагинов попросту забивают на своё творение спустя время. Код плагина обрастает кучей всякого говна, вместо того, чтобы исправлять старые ошибки или уязвимости. Этот плагин не исключение.

Почему я не рекомендую плагин wppage

Около двух месяцев назад были замечены проблемы с плагином на одном из клиентских сайтов — при заходе в раздел «wppage» — «Все страницы» отображался просто пустой белый лист на экране. Никаких значков, никаких описаний. Просто тупо белый лист.

После этого было обнаружено, что плагин некорректно работает с другим плагином — Traffic Bomb: не работали кнопки соц. сетей, после нажатия на «Лайк» от ВКонтакте ссылка не отображалась.

Аж 4 февраля 2014 года был получен ответ по почте от разработчика по нашей проблеме:

«Данная проблема не имеет быстрого решения, она будет исправлена в новой версии. Извините за неудобства».

Да, на тот момент кое-как с горем пополам удалось решить проблему, откатившись на старую версию плагина wppage. Но это же не дело, господа.

Примерно 29 мая вышла новая версия плагина, которая должна была исправить многие из существующих ошибок, но вместо исправления у нас перестали проигрываться видео на страницах, был неработающий шорткод. Ладно б только это… Умудрились ещё каким-то образом сломать табулятор в комментариях.

Как можно писать плагин и не протестировать его? Включите WP_DEBUG, что ли…
[text]Notice: Undefined variable: css in /www/site/wp-content/plugins/wppage/inc/shortcodes.php on line 576[/text]

А если зайдём в раздел «wppage» — «Параметры»?
Почему я не рекомендую плагин wppage

И это в одном из самых важных разделов настроек!
Почему я не рекомендую плагин wppage

Или вот, пример ошибок на подписной странице:
Почему я не рекомендую плагин wPPage

Сегодня 1 июня, раздел «Все страницы» снова не работает.

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

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

Друзья, давайте что-то решать.

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

Предупреждаю — в видео присутствует огромное количество мата.

Мультиязычность сайта на WordPress

Приветствую, дорогие друзья!

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

Записано простым и понятным языком, надеюсь вам понравится. :-)

Если вы хотите поблагодарить меня за материал — можете сделать это здесь :-)

Social Media Popup — плагин социальных сетей для WordPress

Возникла идея реализовать плагин для сбора подписчиков в своих группах и сообществах в социальных сетях. Из всех существующих аналогов не нашёл того набора, который нужен мне, а именно: Facebook, ВКонтакте, Twitter, Google+, Одноклассники, Pinterest и Instagram. Для каждой социальной сети существует свой отдельный плагин для WordPress или же какой-то хитрый способ создать виджет, но единого комбайна с поддержкой всех социалочек фактически не существует. Именно по этой причине я и взялся за создание.

Плагин работает только на WordPress!
Плагин изначально разрабатывался под WordPress и нет планов по его дальшейшей доработке под другие CMS (Joomla, Drupal). Если вы разработчик под эти CMS – свяжитесь со мной, обсудим возможные варианты сотрудничества.

Как это работает?

 

Если окно плагина не отобразилось сразу, значит я выставил настройки показа на второй странице.
Обновите эту страницу и нажмите на кнопку ещё раз, тогда окно сработает.

Да-да, всех бесят всплывающие окна, но, тем не менее, они до сих пор остаются эффективным инструментом по привлечению подписчиков. При наступлении определённого события (просмотр N страниц сайта, прошествие M секунд, щелчок по указанному элементу на сайте, прокрутка страницы сайта или другие доступные события плагина) у посетителя откроется всплывающее окно с призывом вступить в группы подключенных социальных сетей.

Главное окно приложения
Виджет Google+
Виджет Twitter

В зависимости от подключенных социальных сетей будет то или иное количество закладок. Для каждой закладки — свой виджет социальной сети. При нажатии на кнопку закрытия окна в браузере посетителя сохраняется cookie с указанной в настройках датой. Как только этот интервал истечёт — окно появится вновь. Я думаю нет нужды подробно рассказывать, как работают подобные всплывающие окна, лучше сосредоточусь на реализованной функциональности. :-)

Поддерживаемые социальные сети

На сегодня поддерживаются 6 самых популярных социальных сетей:

  • Facebook, виджет Page Plugin
  • ВКонтакте, виджет Сообщества
  • Twitter, виджет Timeline и Follow Button
  • Google+, виджет Communities
  • Pinterest, вывод профиля пользователя
  • Одноклассники, виджет групп и сообществ

Скриншоты виджетов социальных сетей

Facebook

Используется виджет Page Plugin.

Пример 1Пример 2Пример 3
Вариант с отключенными публикациями и используемым заголовком.
Виджет Facebook Page Plugin
Вариант с отключенными публикациями и отключенным заголовком.
Виджет Facebook Page Plugin
Вариант со включенными публикациями и отключенным списком друзей.
Виджет Facebook Page Plugin

ВКонтакте

Используется виджет Сообщества.

Пример 1Пример 2
Классический вариант виджета Сообщества
Виджет ВКонтакте Сообщество
Виджет Сообщества без списка пользователей, но с изменённым оформлением
Виджет ВКонтакте Сообщество

Остальные социальные сети (Instagram, LinkedIn, YouTube и другие) либо не имеют удобной функциональности для встраивания, либо я пока не разобрался и не добрался до них. Если потребуется кому-то из пользователей плагина — добавлю.

Реализованная функциональность

  • Выбор порядка отображения закладок социальных сетей в панели навигации
  • Возможность закрытия окна при клике на любую область экрана и/или нажатием на кнопку Escape
  • Возможность выбрать место размещения кнопки закрытия — внутри виджета или на затемнённой области
  • Опциональная установка единого заголовка окна виджета
  • Возможность скрывать панель вкладок при активной только одной социальной сети
  • Опциональное выравнивание надписей на панели вкладок по центру
  • Дополнительная кнопка закрытия окна под виджетом с выбором оформления и надписи на ней
  • Возможность задания размеров (ширины и высоты) главного окна виджета
  • Возможность задать радиус скругления углов виджета, либо оставить его прямоугольным
  • Возможность выбрать цвет фоновой заливки полупрозрачной области под виджетом
  • Возможность задать изображение для фона основного окна виджета
  • Меню быстрого доступа для очистки куков плагина для удобной отладки и тестирования
  • Мобильная версия плагина
  • Поддержка иконок социальных сетей для табов и мобильной версии плагинов
  • После удаления виджет не оставляет никаких следов на вашем сайте и в базе данных
  • Имеется режим отладки для администратора сайта
  • Плагин оптимизирован для работы на высоконагруженных сайтах и порталах
  • Плагин не имеет проблем при работе с установленными кеширующими плагинами
  • Возможность автоматического закрытия окна после подписки на группу в Facebook или ВКонтакте
  • Плагин полностью русифицирован!

Работа с событиями

  • Отображение виджета после просмотра сайта N секунд
  • Отображение виджета при клике на указанный CSS селектор (ID элемента или имя класса)
  • Отображение виджета при прокрутке страницы больше N процентов
  • Отображение виджета при попытке уйти со страницы (другая вкладку, перемещение мыши за границы окна)
  • Выбор времени повторного показа виджета после закрытия (в днях)
  • Отображение виджета после просмотра нескольких страниц на сайте
  • Отображение виджета авторизованным пользователям на сайте в зависимости от их роли

Совместимость с другими плагинами

Плагин корректно работает со следующими кеширующими плагинами:

  • WP Super Cache
  • W3 Total Cache
  • Hyper Cache
  • WP Rocket

У меня есть план работ на ближайшие два месяца, так что с каждой новой версией плагин обрастает новой функциональностью и возможностями. В некоторых случаях я беру в разработку пожелания клиентов плагина, если вижу прямую необходимость и пользу от внедрения новой функции. :-)

Скриншоты плагина

Несколько примеров оформления плагина.

Пример 1Пример 2Пример 3Пример 4Пример 5Пример 6Пример 7Пример 8
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна
Social Media Popup — пример окна

Скриншоты настроек плагина

Общий интерфейс настроек главного окна и поведения плагина изображены на этих скриншотах:

ОбщиеВнешний видВнешний видМобильные настройкиСобытияСобытия
Общие настройки плагина Social Media Popup
Настройка внешнего вида Social Media Popup
Настройка внешнего вида Social Media Popup
Настройка мобильной версии Social Media Popup
Настройка событий Social Media Popup
Настройка событий Social Media Popup

Для каждой социальной сети существует свой персональный набор настроек. Практически для каждой социальной сети вам предварительно придётся получить так называемый Application ID, либо API для установки виджета. Но это не будет проблемой — есть подробные инструкции, как этот плагин настраивать и использовать.

Инструкции по настройке виджетов социальных сетей

Внимание!
Внешний вид, локализация и прочие настройки однозначно будут претерпевать изменения от версии к версии, что-то добавляется, что-то убирается. Так что не пугайтесь, если после покупки плагина внешний вид настроек будет отличаться от тех, что представлены выше на скриншотах. :-)

Обзорное видео по версии 0.7.5 от 30 июня 2016 г.

Что будет, если плагин на моём сайте не заработает?

Если по каким-то причинам плагин не заработает — я приму активное участие в поиске неисправности. Чаще всего проблема в других установленных плагинах, которые используют кривой код JavaScript. Бывали случаи, когда используемая тема на сайте клиента не использовала библиотеку jQuery, это проблема разработчика темы. Но я при любой ситуации готов протянуть вам руку помощи и настроить-таки плагин.

Пока не было ни одного случая, чтобы мне не удалось настроить плагин на сайте клиентов. Всё работает именно так, как ожидали пользователи. Можете быть уверены в том, что не останетесь наедине с новым для вас плагином. Ручаюсь своей репутацией! :-)

Как получить плагин?

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

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

Оплата ручным переводом средств на мои кошельки

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

  • Webmoney Rub: R231261297679 (BL 83)
  • Webmoney USD: Z134746590187 (конвертация по курсу на день оплаты)
  • Яндекс.Деньги: 41001600396009
  • PayPal: gruz0.mail@gmail.com

Оплата на карту Тинькофф

Если вы хотите оплатить на карту Тинькофф — свяжитесь со мной, я вышлю номер карты для перевода средств.

После ручной проверки оплаты на ваш электронный адрес придёт письмо с подтверждением, ссылкой на скачивание плагина и вся необходимая информацию по его использованию. Если вдруг письмо не пришло в короткое время — напишите мне на support@gruz0.ru, возможно не пришло уведомление от платёжной системы или я просто не увидел ваш платёж.

Если мне не подошёл плагин — могу я вернуть деньги?

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

Остались вопросы? Задайте их!

Свяжитесь со мной любым удобным вам способом, я практически круглосуточно в сети:

Как настроить сбор контактов из плагина Contact Form 7

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

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

Либо же вы забудете своевременно почистить почтовый ящик и сообщения застрянут по пути. Такое бывает довольно часто.

В общем, к чему я веду, для того, чтобы сохранять все данные об отправителе сообщения, существует специальный плагин Flamingo. Устанавливается и активируется как и все плагины в WordPress.

Каких-то особенных настроек в нём нет, плагин автоматически настраивается на сбор адресов из формы Contact Form 7 и подключать что-либо дополнительное нет необходимости.

После установки плагина в главном меню появляется пункт Flamingo:
Как настроить сбор контактов из плагина Contact Form 7

В разделе Address Book находятся все собранные электронные адреса:
Как настроить сбор контактов из плагина Contact Form 7

Выбрав электронный адрес из списка и нажав по нему мышкой вы попадёте в карточку этой записи, где можно изменить имеющиеся поля и сохранить изменения:
Как настроить сбор контактов из плагина Contact Form 7

Так же в разделе Address Book возможно экспортировать собранные адреса в текстовый файл формата CSV для дальнейшей загрузки в сервисы автореспондеров. Но как по мне, чтобы пользоваться этой возможностью вы должны получить согласие клиента на обработку его персональных данных, иначе получится что данные вы собираете незаконно. Но это уже не ко мне за подробностями… :-)

В меню Inbound Messages главного меню можно увидеть входящие сообщения, которые отправлялись через форму на ваших страницах. Именно здесь хранится вся информация и текст сообщения.
Как настроить сбор контактов из плагина Contact Form 7

И останется лишь убедиться, что все заданные нами поля в форме отправки сообщения успешно сохраняются в плагине Flamingo:
Как настроить сбор контактов из плагина Contact Form 7

Форма обратной связи с помощью плагина Contact Form 7

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

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

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

Форма обратной связи с помощью плагина Contact Form 7

Описание плагина

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

Кроме этого, вы можете подключить к нему плагин Akismet для защиты от спама, реализовать сбор и хранение данных в базе вашего сайта, а так же использовать мультиязычность. Это, на мой взгляд, круто! :-)

Установка плагина Contact Form 7

Плагин устанавливается стандартным способом в WordPress. Заходим в раздел «Плагины» — «Добавить новый», вводим название Contact Form 7 и устанавливаем его из репозитория. Не забываем активировать сразу после установки.

Настройка Contact Form 7

После активации плагина в главном меню WordPress появится новый пункт «Контакты (CF7)», это основное место настроек ваших форм обратной связи. Количество форм ничем не ограничено.
Форма обратной связи с помощью плагина Contact Form 7

Список существующих форм доступен в разделе «Contact Forms»:
Форма обратной связи с помощью плагина Contact Form 7

Тут же можно скопировать нужный шорткод для вставки на страницу или в запись:
Форма обратной связи с помощью плагина Contact Form 7

Добавление новой формы обратной связи

Как видите, каких-то особых дополнительных пунктов в меню нет, поэтому перейдём к созданию самой формы обратной связи. Для этого выбираем пункт «Добавить новую» в главном меню.

Первым делом нам предлагается выбрать язык интерфейса формы, которая будет создаваться. WordPress определяет установленную версию на вашем сайте и предлагает выбрать её по умолчанию:
Форма обратной связи с помощью плагина Contact Form 7

Но вы можете выбрать из списка любой доступный язык:
Форма обратной связи с помощью плагина Contact Form 7

После нажатия на кнопку «Добавить новую» появится конструктор формы.

Изменяем название формы

Первым делом нужно ввести название нашей формы, чтобы не потеряться в списке форм, когда их будет слишком много. Для этого достаточно нажать мышкой на слово «Заголовок» в верхней области экрана:
Форма обратной связи с помощью плагина Contact Form 7

После этого появится текстовое поле, в котором введём название с описанием:
Форма обратной связи с помощью плагина Contact Form 7

И нажмём кнопку «Сохранить».

Как только страница обновится, вы увидите следующее сообщение:
Форма обратной связи с помощью плагина Contact Form 7

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

Изменяем шаблон формы

Шаблон формы — это обычный HTML-код, который формирует внешний вид вашей формы. По умолчанию он содержит 4 поля (имя, электронный адрес, тему и сообщение) и кнопку отправки формы. Выглядит это следующим образом:
Форма обратной связи с помощью плагина Contact Form 7

Вы можете менять блоки местами, просто вырезая и вставляя их код в любое место.
Например, мы можем поменять местами поле электронного адреса и имя клиента:
Форма обратной связи с помощью плагина Contact Form 7

Или же можем удалить поле «Тема», чтобы оно не высвечивалось в нашей форме. Для этого достаточно удалить соответствующий блок текста в нашем шаблоне:
Форма обратной связи с помощью плагина Contact Form 7

«Звёздочка» возле кода элемента означает что это поле обязательное и пока клиент не введёт какое-то значение, форма не будет отправлена:
Форма обратной связи с помощью плагина Contact Form 7

[subscribe_form button=»Я хочу получать материалы рассылки!»]

Как добавить новое поле в форму

Представьте, что вам необходимо в стандартную форму добавить поле с адресом сайта. Конструктор формы этого плагина позволяет безо всяких проблем реализовать задуманное. Достаточно воспользоваться кнопкой «Сгенерировать тэг»:
Форма обратной связи с помощью плагина Contact Form 7

При нажатии вывалится огромный список возможных дополнительных полей:
Форма обратной связи с помощью плагина Contact Form 7

Вам останется лишь выбрать тип нужного поля и выполнять ещё ряд простых действий.
Форма обратной связи с помощью плагина Contact Form 7

Не пугайтесь. Настройки хоть и выглядят устрашающе, но на деле очень простые :-)

Признак «Обязательное поле» позволяет установить дополнительную проверку и пока это поле будет оставаться пустым или иметь некорректное значение, форма не будет отправлена. Эта настройка есть практически у всех типов полей:
Форма обратной связи с помощью плагина Contact Form 7

Кроме этого, многие поля нашей формы имеют одинаковые настройки имени, указания ID элемента и класса CSS, через которые можно изменять внешний вид этих полей. Они присутствуют практически во всех полях:
Форма обратной связи с помощью плагина Contact Form 7

Поле «Имя» самое важное, именно оно используется и в шаблоне формы, и в шаблоне письма.

Но за время пользования этим плагином мне ни разу не приходилось менять или устанавливать значения этих атрибутов. Скорее всего и вам не понадобится. Но рассказать и познакомить с ними я обязан :-)

Все текстовые поля в нашем конструкторе формы имеют дополнительные поля с размером самого поля и максимальной длиной значения, вот они:
Форма обратной связи с помощью плагина Contact Form 7

Так же специфические поля, типа URL или каких-то других, отличных от обычных текстовых, имеют свои особенные настройки. Например, наше поле URL имеет дополнительную настройку:
Форма обратной связи с помощью плагина Contact Form 7

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

Теперь нам нужно добавить код этого поля в форму шаблона формы.
Для этого необходимо скопировать предложенный код и вставить его в форму слева:
Форма обратной связи с помощью плагина Contact Form 7

Например, я хочу разместить поле с адресом сайта после имени клиента. Мне необходимо будет ввести код по аналогии с другими полями, то есть добавить абзац, перенос строки и вставить шорткод этого нового поля:
Форма обратной связи с помощью плагина Contact Form 7

Ну и для того, чтобы значение этого поля пришло нам на электронный адрес, вот это значение нужно скопировать:
Форма обратной связи с помощью плагина Contact Form 7

И вставить в текстовое поле ниже в «Шаблон письма»:
Форма обратной связи с помощью плагина Contact Form 7

По аналогии добавляются и другие поля. Всё просто и понятно :-)

Адресат и шаблон письма

Теперь давайте рассмотрим настройки, которые учитываются при отправке сообщения. В нашем случае это получатель (практически всегда это вы и есть) и шаблон письма, которое будет приходить на указанный электронный адрес после отправки сообщения.

В первую очередь необходимо указать адресата, на чью электронную почту будут приходить сообщения с нашей формы. По умолчанию сюда подставляется электронный адрес из настроек WordPress.
Форма обратной связи с помощью плагина Contact Form 7

Я думаю вы уже обратили внимание что в этих формах используются непонятные коды, типа [your-name], [your-email]. Так вот, это то самое поле «Имя» из генератора поля, которое я рассматривал выше:
Форма обратной связи с помощью плагина Contact Form 7

Напоследок я бы рекомендовал вам установить опцию «Использовать HTML-формат письма», так вы можете сделать ваши сообщения с сайта более информативными, используя HTML при вёрстке шаблона.
Форма обратной связи с помощью плагина Contact Form 7

Ну и дальше вам останется лишь привести в порядок шаблон самого письма:
Форма обратной связи с помощью плагина Contact Form 7

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

P.S. В настройках этого плагина есть довольно интересная возможность — указать второго адресата сообщения. Честно говоря я сходу не могу придумать зачем это может понадобиться, но раз возможность есть, то кто-то её в любом случае воспользуется.
Форма обратной связи с помощью плагина Contact Form 7

Настройка сообщений

Ну и какой же это плагин отправки сообщений, если он не позволяет изменить текст уведомлений или надписей? И плагин Contact Form 7 не исключение. Он позволяет перевести любую надпись или сообщение об ошибке:
Форма обратной связи с помощью плагина Contact Form 7

Не забудьте сохранить все изменения нажатием на кнопку «Сохранить», она в самом верху страницы :-)

Известные проблемы

Бывает так, что при использовании нестандартных контролов, типа email или url, внешний вид отдельных элементов на странице будет отличаться. Например, обратите внимание на поле «Адрес вашего сайта» в самой форме:
Форма обратной связи с помощью плагина Contact Form 7

Не увидели? А я покажу поближе:
Форма обратной связи с помощью плагина Contact Form 7

В общем, проблема в том, что внешний вид подобных полей визуально отличается от стандартных текстовых полей. Сравните с полем «Ваше имя», сразу всё поймёте.

Тут есть два варианта решения. Первое — добавить соответствующие стили в файл style.css вашей темы, либо изменить в шаблоне формы тип url на text, тогда всё будет нормально:
Форма обратной связи с помощью плагина Contact Form 7

Заключение

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

Конечно, обязательно появится кто-то, у кого либо что-то не получится, либо захочется предложить к рассмотрению какой-то другой, аналогичный плагин. Я всегда рад вопросам и предложениям! Не стесняйтесь задавать их в комментариях :-)

Если вы хотите поблагодарить меня за материал — можете сделать это здесь :-)

Согласие на обработку персональных данных © 2024 Alexander Kadyrov
Яндекс.Метрика