Янв
17
10

Перестановка полей в форме комментариев WordPress

Комментарии в WordPressНедавно совершенно случайно узнал, что начиная с новой версии WordPress 4.4 разработчики переместили поле комментариев в начало формы. Теперь там в самом верху находится большой блок (textarea) для размещения коммента пользователя, а уже после него идут «Имя автора», «E-mail» и «Ссылка на сайт».

Изменения будут заметны для веб-проектов, где соответствующая форма реализована через стандартную функцию системы comment_form. Если данный элемент страницы выводится с помощью HTML кода в файле comments.php, то ничего нового вы не увидите. Как бы там ни было, сегодня рассмотрим хаки позволяющие изменить порядок полей в форме комментариев WordPress.

Первым делом хочу сказать пару слов о том зачем разработчиками была сделана данная модификация. Все дело в небольшом «косяке» при использовании древовидных комментариев, когда люди могут отвечать на записи друг друга. После нажатия кнопки «Ответить» пользователь перенаправляется в начало поля для ввода текста комментария. Если он посещает сайт на стационарном компьютере, то наверняка выше увидит наличие обязательных полей «Имя» / «E-mail», но на смартфоне их можно не заметить.

Форма комментариев WordPress

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

Размещаем поле комментариев внизу формы

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

Код добавляете в файл функций functions.php либо через модуль Code Snippets или свой плагин.

function bottom_commentfield( $fields ) {
	$comment_field = $fields['comment'];
	unset( $fields['comment'] );
	$fields['comment'] = $comment_field;
	return $fields;
}
 
add_filter( 'comment_form_fields', 'bottom_commentfield' );

После использования сниппета варианты «до» и «после» для формы комментариев на скриншоте выше поменяются местами. Что же касается самого кода, то здесь логика работы простая:

  1. сначала сохраняем в переменную $comment_field содержимое поля комментариев;
  2. затем удаляем поле с помощью функции unset;
  3. присваиваем новому полю комментариев значение переменной из первого шага.
  4. фильтр comment_form_fields выполняет нашу функцию перед выводом формы.

Перестановка любых полей в форме

Рассмотренный выше прием вы можете применить для изменения порядка вообще всех полей в форме комментариев WordPress. Алгоритм аналогичный — сначала записываем значения полей в переменные, потом удаляем их и заново в нужном порядке добавляем в форму.

Сниппет вставляете в functions.php или через модуль.

function all_commentfields( $fields ) {
	//var_dump($fields); // просмотр всех полей в переменной $fields
 
	// сохраняем значение всех полей формы
	$mycomment_field = $fields['comment'];
	$myauthor_field = $fields['author'];
	$myemail_field = $fields['email'];
	$myurl_field = $fields['url'];
 
	unset( $fields['comment'], $fields['author'], $fields['email'], $fields['url'] );
 
	// заново добавляем поля в форму в нужном порядке
	$fields['url'] = $myurl_field;
	$fields['comment'] = $mycomment_field;
	$fields['author'] = $myauthor_field;
	$fields['email'] = $myemail_field;
 
	return $fields;
}
 
add_filter( 'comment_form_fields', 'all_commentfields' );

Сохраняете и проверяете вывод / работу формы на сайте. В принципе, ничего сложного нет. Если будут какие-то замечания или дополнения по теме перестановки полей, пишите в комментариях.

P.S. Дополнительные WP модули позволяют расширить функциональность вашего веб-проекта. Магазин WordPress плагинов содержит парочку интересных решений для: внедрения разных калькуляторов на сайте, управления рекламой и ссылками.

рейтинг Оцените статью:
Ужасная статьяНичего интересногоТак себеНормальноХорошоКлассный постВ закладки!
(голосов - 3, средний балл: 6,33 из 7)
Загрузка...

категория Категории: Хаки и секреты;
теги Теги: , , , , , .

комментариев 10 к статье “Перестановка полей в форме комментариев WordPress”

  • Дмитрий   17.01.2017

    Действительно Вы правы… а я заметил что что-то изменилось, но только сейчас заметил разницу. Можно поинтересоваться как у Вас реализовано красивая вставка кода на страницу. С помощью плагина или кодом? Я пробовал несколько плагинов, но как-то коряво работают.

  • Tod   17.01.2017

    Дмитрий, это плагин WP-Syntax, тоже пробовал несколько подсветок кода, с этим уже лет 5 работаю.

  • Дмитрий   17.01.2017

    у меня тоже стоит WP-Syntax, но замечен глюк, если после вставки кода (не сохраняюсь) переходите в визуальный редактор, то появляются лишние символы. Это хорошо когда статья готова и всего один кусок кода надо вставить, а если много частей кода в разных местах текста то засада какая-то…

  • Tod   20.01.2017

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

  • Puloin   13.02.2017

    Вообще не замечал, что поля в форме поменялись местами) Однако логика разработчиков вполне понятна. Надо будет глянуть как вообще выглядит мобильная версия моего блога)

  • Альберт   27.02.2017

    Спасибо за статью. Очень помогло.

  • Алексей   30.08.2017

    Привет, за статью спасибо. Я даже не заметил данных изменений.

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

    При скроле получается просто какая абракадабра + какие-то артефакты ))

    https://image.prntscr.com/image/7USvG36bSb_lnveBsdSdaQ.png – Ссылка на скриншот с вашего сайта, как у меня отображается код на вашем сайте.

    Для сведения:
    Браузер: Google Chrome Версия 60.0.3112.113 (Официальная сборка), (64 бит)
    OC: Mac OS High Sierra

  • Tod   31.08.2017

    Алексей, спасибо за замечание, там по нормальному вместо темных полос должны быть светло серые (типа для удобства читания кода). У вас в браузере случайно не установлены модули переорпеделения стилей?

  • Алексей   02.09.2017

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

  • Tod   02.09.2017

    Алексей, может это какой-то локальный глюк только с этой версией хрома. Ну, там вместо темный полос должны быть просто светло серые, косяк в стилях. Как автор модуля обновит его, переустановлю.

Оставить комментарий


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

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

Последние посты
Лучшее в категории
Облако тегов
Скажи свое мнение!

В чем основные плюсы Wordpress?

Посмотреть результаты

Загрузка ... Загрузка ...
Друзья проекта
Последние новости