Раньше среди разработчиков часто обсуждался вопрос правильного URL адреса страниц — со слешем в конце «/» или без. Насколько я помню, первый вариант указывает браузеру, на «раздел», и он будет пытаться подгрузить дополнительные ссылки, тогда как второй определяет статический документ. Собственно, окончание в виде расширения.html в URL также четко дает понять, что вы переходите на публикацию с определенным содержимым, а не открываете список записей. Возможно, именно поэтому во многих рекомендациях по призывают использовать соответствующую конструкцию. Сегодня покажу как легко и быстро подправить URL страниц в WordPress.

Кстати, кроме упомянутых выше причин, здесь есть еще и другие важные цели. Когда вы осуществляете из определенной CMS системы или статического HTML формата на WP, то неплохо бы сохранить прошлые адреса веб-страниц, оставив у них окончания html, php и т.п. Похожая ситуация возникает если решили . Разобраться с этой задачей без специальных плагинов будет сложно — рассмотрел их чуть ниже.

Структура URL записи в WordPress

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

Раньше практически всегда указывал параметр /%category%/%postname%/ но сейчас перешел на /%category%/%postname%.html — в обоих случаях выводится название категории + URL заметки, однако во втором добавляется еще и html окончание.

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

Добавляем URL в страницы WordPress

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

Теоретически, опцию можно настроить и через htaccess, но вариант со специальными плагинами изменения URL в WordPress мне кажется гораздо проще. За все время я попробовал и сменил несколько решений, т.к. иногда они, к сожалению, перестают обновляться. Представленные ниже модули — лишь часть из найденных, которые максимально заинтересовали.

.html on PAGES

.html on PAGES — определенно самый древний и популярный в данной нише. Последний релиз был выпущен аж 8 лет назад и, по словам разработчика, поддерживал версию до 2.8.4. Однако на многих сайтах с WP 3.x, 4.х. он до сих пор функционируют без проблем. Число загрузок (немыслимое для конкурентов) — 60 тысяч.

Установка стандартная — через загрузку по ФТП в директорию wp-content/plugins или в самой админке. После активации у всех страниц появится расширение html, а при редактировании указываете только их название.

Сохраняете и проверяете отображаемый URL.

Add HTML to Page

Данный модуль также частенько мне встречался ранее. По описанию Add HTML to Page чуть «свежее» (возраст последних правок всего 4 года), но, думаю, аналогично без проблем работает с любыми релизами WP. Практически во всех схожих разработках, по сути, используется один и тот же принцип.

Загрузок под тысячу, оценка нормальная, хотя голосовало только 2 человека:) Автоматически меняет все URL страниц в WordPress. Кстати, при внедрении нового формата ссылок в настройках сайта, плагин советуют повторно реактивировать.

Append extensions on Pages

В принципе, Append extensions on Pages — одно из самых оптимальных решений, сейчас частично перешел на него. Здесь: чуть больше функциональность, относительно недавно обновлялся (6 месяцев назад, поддержка до 4.8.5), а также хорошая оценка и отзывы.

В отличии от первых двух модулей текущий позволяет изменить URL WordPress страниц не только на html, но и на варианты: .php, .asp, .htm, .cfm, .jsp и.aspx. Это особенно актуально при переезде с другой CMS для сохранения прошлых адресов.

Чтобы задать нужное вам расширение, в списке всех плагинов находите Append extensions on Pages и кликаете по ссылке «Settings»:

После установки своего значения обязательно обновите страницу «Постоянных ссылок» в разделе настроек админки. Загрузок под 2 тысячи, тестировал лично — все ок.

Отличительная особенность этого плагина для URL WordPress страниц заключается в том, то он позволяет добавлять любое окончание. То есть в нет списка предустановленных значений или автоматического варианта с html. Он полезен для мультисайтовых установок. Обновление было 2 месяца назад, загрузок — более 2 тысячи, оценка максимальная.

Вас может немного смутить описание в репозитории, где автор почему-то рассматривает процесс установки расширения html в URL записи WordPress (я рассказывал про тему в начале статьи). Вероятно, это из-за того, что модуль работает автоматически и без каких-либо настроек. Сразу после активации у страниц появится окончание.html — будете видеть его при редактировании.

Из плюсов: оценка 5 баллов, 5 тысяч скачиваний, заявлена поддержка до 4.8.5, обновление 4 месяца назад. По сравнению с первыми двумя плагинами этот вариант достаточно актуален и относительно популярен.

Дополнительные фишки

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

• Скрипты внедрения красивых — полезно, если хотите привести магазин к такому же виду как и все остальные адреса на сайте. Там найдете 2 кода: модифицирующие категории продукции и конкретные товары.
• . — когда-то отдельно рассказывал о добавлении расширения php в конец URL страниц. В статье есть еще один вариант, хоть и устаревший. Это автоматические простые модули.
• Также в сети находил плагин .html in category and page url который призван решить одну из основных оставшихся задач — изменить URL адреса WordPress категорий, но ручаться за него не могу. Не смотря на 3 тысячи скачиваний, в закладке поддержки (Support) есть замечания о проблемах с разбиением на страницы + он обновлялся более 3-х лет назад. Когда будете использовать данную разработку, дополнительно все проверьте и потестируйте.

Итого

Из личного опыта больше всего сталкивался с .html on PAGES , несколько раз пробовал Add HTML to Page . Не смотря на то, что они все древние, вполне нормально себя ведут на последних версиях WP. В нескольких сайтах недавно ставил Append extensions on Pages — хорошо, когда имеется возможность задавать некоторые другие расширения страницам. Нет подходящего значения в предустановленных? — ставьте универсальный . Да, и последний модуль весьма неплох.

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

Если знаете еще каике-то интересные модули, позволяющие изменить URL W ordpress записей и страниц, присылайте названия ниже.

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

Текст, видимый пользователю, может отличаться от текста, указанного в атрибуте value . Вот, как можно создать выпадающий список:

Green Yellow Black

• Выпадающий список создается с помощью тега ;
  Внутри тега
  определяются варианты для выбора с помощью тега ;
• В теге можно использовать атрибут value , чтобы получить доступ к выбранному варианту с помощью PHP , JS , Jquery и т.д.

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

В следующем разделе я покажу примеры использования выпадающего списка HTML в JavaScript / JQuery . В примерах также будет показано, как задавать стили с помощью CSS / CSS3 и фреймворка Bootstrap .

Пример создания простого выпадающего списка

В этом примере HTML select option используется для создания выпадающего списка с тремя вариантами на выбор:

В приведенном выше примере для создания выпадающего списка используется следующая разметка:

5 10 15 20 25

Использование атрибута value

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

В следующем примере мы создадим выпадающий список с атрибутом value :

Для тега используется следующий код:

Maroon Green Yellow Blue Red

Пример получения доступа к выбранному варианту в JavaScript

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

Для option value HTML используется следующий код:

Maroon Green Yellow Blue Red Other

Следующая строка кода используется в JavaScript , чтобы получить доступ к значению атрибута value варианта :

var seltheme = document.getElementById(“selcolor”).value;

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

Получение доступа к видимому тексту в JQuery

На этот раз я буду использовать JQuery , чтобы получить доступ к значению выбранного варианта: как к тексту, так и к value . В этой демо-версии я буду получать доступ к видимому тексту в теге option в HTML :

Посмотреть онлайн демо-версию и код

В коде для каждого варианта в теге

значение отличается от текста. После того, как вы выберете цвет, jQuery отображает видимый текст в предупреждении. Код тега следующий:

Maroon Green Yellow Blue Red

Вот как обеспечивается доступ к этому значению в HTML select option selected JavaScript :

var selectedcolor = $("#jqueryselect option:selected").text();

Также можно получить доступ к значению с помощью JQuery-метода $.val() :

var selectedcolor = $("#jqueryselect").val();

Замените эту строку в приведенном выше примере, и код будет отображать шорткод / значение цвета в атрибуте value , а не видимый текст.

Пример получения значения в скрипте PHP

В этом примере получения значения выбранного из выпадающего списка варианта форма создается с помощью тега в разделе разметки. После выбора цвета из выпадающего списка нажмите на кнопку “Submit ”. Данные формы будут передаваться в тот же PHP-файл , после чего отобразится выбранный цвет:

Посмотреть онлайн демо-версию и код

Метод формы, используемый в примере — POST , поэтому можно получить значения формы с помощью массива PHP $_POST[“”] . Это код формы, используемый в примере:

Select A Color:

Maroon Green Yellow Blue Red