Содержание
- 01. Установите новую копию WordPress.
- 02. Удалите плагины по умолчанию.
- 03. Добавьте собственный тип сообщения.
- 04. Интерфейс добавления / редактирования произвольного типа сообщений.
- 05. Создайте настраиваемый ярлык перезаписи.
- 06. Добавьте поддержку настраиваемых полей.
- 07. Добавьте настраиваемые поля
- 08. Настройте поля.
- 09. Создайте файл шаблона WordPress.
- 10. Создайте полноразмерный макет одиночного сообщения.
- 11. Запустите цикл и создайте контент.
- 12. Используйте PHP для вызова динамических значений.
- 13. Сделайте тестового клиента с фиктивными данными.
- 14. Обработка ошибок при отсутствии данных.
- 15. Приведите в порядок интерфейс.
- 16. Исключить его из карты сайта.
Потребители ожидают наличия области, которая позволяет пользователям входить в систему и загружать или просматривать документы, от телефонных контрактов до коммунальных предприятий.
Однако, когда дизайнеры работают со своими клиентами, все может быстро превратиться в путаницу электронных писем, ссылок на макеты и вложения.
Это руководство по WordPress покажет, как расширить WordPress (доступны другие услуги веб-хостинга) до клиентского портала, способного хранить документы, видео и рисунки, чтобы клиент мог получить доступ ко всем ним в одном месте. Портал предоставит каждому клиенту уникальную ссылку, защищенную паролем, которая не отображается в обычной навигации.
Пользовательские типы сообщений и поля будут использоваться для хранения данных, и они будут добавляться через плагины, чтобы избежать потери данных в случае изменения темы. Тема будет немного изменена.
Наличие клиентского портала дает клиентам удобство доступа к своим файлам в одном месте, когда они им нужны, как при использовании облачного хранилища. Он имеет ряд преимуществ для бизнеса, включая отображение доступных дополнительных продаж, или может использоваться для обзора рабочего процесса с самого начала путем визуального обозначения результатов.
Скачайте файлы для этого учебника.
- Как превратить WordPress в визуальный конструктор
01. Установите новую копию WordPress.
На сервере разработки установлена новая копия WordPress, и была выбрана тема «understrap», чтобы дать шаблонную основу для быстрого начала работы. Будет использоваться плагин пользовательского интерфейса Custom Post Type, поэтому наши настраиваемые типы сообщений не зависят от темы.
02. Удалите плагины по умолчанию.
Если какие-либо плагины по умолчанию поставляются с копией WordPress, удалите их. Для этого урока необходимы плагины «Расширенные настраиваемые поля» и «Пользовательский интерфейс пользовательского типа сообщения». Также был установлен «Классический редактор».
03. Добавьте собственный тип сообщения.
Используя интерфейс пользовательского интерфейса пользовательского типа сообщения, добавьте новый тип сообщения под названием «клиент». При вводе «Заголовок типа сообщения» используйте подчеркивания вместо пробелов и пишите в единственном числе, так как это упростит создание шаблонов позже. Префикс tu_ был добавлен, чтобы уменьшить вероятность конфликта.
04. Интерфейс добавления / редактирования произвольного типа сообщений.
Добавьте множественное число с пометкой «клиенты» и единственное число «покупатель», так как это будет отображаться в меню администратора WordPress. В этих полях можно использовать заглавные буквы, что сделает меню WordPress более аккуратным.
05. Создайте настраиваемый ярлык перезаписи.
Использование префикса для ярлыка типа сообщения будет означать, что клиенты, добавленные на портал, будут созданы со ссылкой, которая выглядит как «/ tu_customer / example-company». Это не выглядит аккуратным, и для улучшения этого используется настраиваемый ярлык перезаписи. Установка заголовка перезаписи на «клиенты» позволяет настраиваемому типу сообщения отображаться как / customers / example-company.
06. Добавьте поддержку настраиваемых полей.
Последний параметр, который включен для настраиваемого типа сообщения, - это «Поддержка> Пользовательское поле», которое находится в нижней части страницы. Отметьте это, а затем «добавить тип сообщения» внизу страницы. Это отправляет изменения и регистрирует тип сообщения.
07. Добавьте настраиваемые поля
Теперь необходимо добавить настраиваемые поля и присвоить им только что созданный тип сообщения. Добавление группы полей с именем «портал для клиентов» - это первый шаг, за которым следует добавление в нее настраиваемых полей с помощью кнопки добавления поля. Первое поле «краткое» будет установлено как тип поля «файл», что позволяет администратору загружать файл в это место. Установите возвращаемое значение "URL-адрес файла".
08. Настройте поля.
Следующее поле, которое нужно добавить, - это «анкета бренда». Он будет состоять из ссылки на форму Google, которую должен заполнить клиент. Наиболее подходящий тип поля для этого - «URL». Этот же метод можно использовать для всех полей, которые будут ссылаться на внешнюю службу. Когда закончите, прокрутите вниз до поля «местоположение» и используйте логику «Показать, если тип сообщения» = «Клиент». Затем опубликуйте группу полей.
09. Создайте файл шаблона WordPress.
WordPress должен знать, как отображать панель инструментов клиента. Для этого используется иерархия шаблонов WordPress, чтобы создать файл шаблона для этого конкретного типа публикации. Создайте файл с именем single-tu_customer.php в корневом каталоге темы.
10. Создайте полноразмерный макет одиночного сообщения.
Откройте файл single-tu_customer.php и добавьте функции WordPress get_header и get_footer. Между этими функциями создайте макет во всю ширину, чтобы удерживать контент, который работает с вашей темой.
? php get_header ();?> div id = "single-wrapper"> div id = "content" tabindex = "- 1"> div> div id = "primary"> main id = "main"> -! Content -> / main> / div> / div>! - .row -> / div>! - #content -> / div>! - # одинарная оболочка ->? Php get_footer () ;?>
11. Запустите цикл и создайте контент.
Внутри основного элемента> вызовите the_post и создайте элементы контейнера для хранения информации. Используйте информацию о заполнителях, чтобы получить представление о макете и начать стилизовать элементы. Элементами карточки будут карточки начальной загрузки с заголовком, описанием и ссылкой.
main id = "main">? php while (have_posts ()): the_post (); ?> var13 -> div> div> div> Content / div> div> Content / div> div> Content / div> / div> / div>? php end while; // конец цикла. ?> var13 -> / main>! - #main ->
12. Используйте PHP для вызова динамических значений.
Используя функцию the_field, функцию, которая поставляется с расширенным плагином настраиваемых полей, динамический контент из настраиваемых полей вводится в шаблон клиента. 'Field_name' - это значение, которое было введено на шаге 3.
div> div> h5> Brief / h5> p> Это ваш исходный краткий документ / p> a href = "? php the_field ('rief ');?> var13 ->" target = "none"> Открыть / a > / div> / div>
13. Сделайте тестового клиента с фиктивными данными.
Получив доступ к панели управления WordPress, нового клиента можно добавить из левой панели. Клиенты> Добавить нового клиента. Вид публикации будет вам знаком, но при прокрутке вниз откроются все новые настраиваемые поля. Введите тестовые данные, чтобы убедиться, что все работает правильно.
14. Обработка ошибок при отсутствии данных.
Если документ забыт или его доступность находится на слишком ранней стадии процесса, покупателя может сбить с толку, когда кнопка не работает. Добавление проверки существования значения перед его отображением дает возможность показать вариант карты с «отсутствующим полем». Добавление класса «отключено» к карте, когда значение отсутствует, позволит нам стилизовать недоступные карты.
? php if (get_field ('field_name')):?> var13 -> отображается, когда field_name имеет значение? php else: // field_name возвращено false?> var13 -> отображается, когда поле не существует? php endif ; // конец логики if field_name?> var13 ->
15. Приведите в порядок интерфейс.
Теперь, когда структура интерфейса окончательно определена, ее можно правильно стилизовать. Используя CSS, можно улучшить внешний вид карточек и цветов на странице. Цвет навигации был изменен на светло-синий, а направление пользователя улучшено за счет добавления вводного текста.
16. Исключить его из карты сайта.
Пользовательские типы сообщений не должны отображаться в результатах поиска. Тип сообщения необходимо исключить из карты сайта веб-сайта либо с помощью плагина SEO, либо вручную с помощью метатега и robots.txt.
meta name = "robots" content = "noindex, nofollow" /> User-agent: * Disallow: / customers /
Хотите создать новый сайт? Используйте отличный конструктор веб-сайтов, чтобы упростить процесс.
