»  WooCommerce  »  Как изменить админку WooCommerce

Как изменить админку WooCommerce

Последнее обновление:

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

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

В этой статье вы узнаете 4 простых шага для кастомизации админки Вукоммерс.

Содержание:

  1. Отключите ненужные эндпоинты
  2. Измените текст на главной странице (dashboard.php)
  3. Отключите стандартное меню админки
  4. Создайте интерфейс с помощью пейдж-билдера
  5. Плагины

Внимание: Перед тем, как начнете, на всякий случай сделайте бэкап.

1. Отключите ненужные эндпоинты

После установки WooCommerce админка выглядит так:

Админка Вукоммерс
Стандартная админка WooCommerce

По умолчанию в админке Вукоммерс есть несколько эндпоинтов, которые находятся в WooCommerceНастройкиДополнительноЭндпоинты учётной записи:

Эндпоинты аккаунта WooCommerce
Эндпоинты админки WooCommerce

Чтобы отключить эндпоинт, нужно удалить его адрес.

Мембершипу не нужна доставка, поэтому вы можете отключить эндпоинт Адреса. Если вам не нужно давать доступ к файлам, вы можете отключить Загрузки.

После этого админка Вукоммерс будет выглядеть так:

Админка Вукоммерс с отключенными эндпоинтами
Из меню ушли ссылки Адреса и Загрузки

2. Измените текст на главной странице (dashboard.php)

Стандартный текст на главной странице выглядит так:

Добро пожаловать, {текущий_пользователь} (не {текущий_пользователь}? Выйти)

Из главной страницы аккаунта вы можете посмотреть ваши недавние заказы, настроить платежный адрес и адрес доставки, а также изменить пароль и основную информацию.

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

Чтобы изменить этот текст, нужно скопировать файл dashboard.php из папки WooCommerce в папку с дочерней темой и отредактировать несколько строк.

  1. Скопируйте файл из /wp-content/plugins/woocommerce/templates/my-account/dashboard.php (или скачайте с Github).
  2. Создайте папку /wp-content/themes/текущая_тема/woocommerce/myaccount.
  3. Вставьте файл dashboard.php в созданную папку.
  4. Отредактируйте скрипт, который выводит этот текст:

Теперь админка выглядит так:

Админка Вукоммерс после редактирования файла dashboard.php
Стандартная админка WooCommerce

Если такая админка вас уже устраивает, то вы можете оставить так, и сделать еще две вещи, — переименовать эндпоинты и / или изменить их порядок в меню.

а. Переименуйте эндпоинты

Чтобы переименовать эндпоинты, добавьте этот код в functions.php дочерней темы или с помощью специального плагина:

Удалите лишние эндпоинты и измените названия эндпоинтов в строках 4-9.

б. Измените порядок эндпоинтов

Чтобы изменить порядок эндпоинтов, поменяйте строки местами:

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

3. Отключите стандартное меню админки

Чтобы отключить стандартное меню админки, добавьте этот код во Внешний видНастроитьДополнительные стили или в style.css вашей дочерней темы:

Теперь консоль Вукоммерс должна выглядеть так:

Упрощенная админка Вордпресс

4. Создайте интерфейс с помощью пейдж-билдера

С помощью пейдж-билдера откройте страницу .../my-account/. Страницы эндпоинтов наследуют дизайн страницы Мой аккаунт.

Как изменить админку WooCommerce
Админка WooCommerce в редакторе Elementor

Динамический текст с именем пользователя я сделал с помощью Elementor Pro. Если у вас нет Pro, вы можете сделать это с помощью бесплатной версии ACF.

Добавьте текст с динамическим именем пользователя
Добавьте текст с динамическим именем пользователя

Я сделал меню с помощью 4-х виджетов Картинка с текстом и ссылками на эндпоинты. Вы можете сделать по-своему.

Создайте меню для админки WooCommerce
Создайте меню для админки WooCommerce

Сделайте отображение оплаченных товаров (мембершипов) на главной странице, и добавьте шорткоды мембершипа, чтобы оплатившие доступ видели только свои мембершипы.

Доступ к мембершипам в админке WooCommerce
Доступ к мембершипам в админке WooCommerce

Все добавленные элементы пейдж-билдера будут отображаться на всех эндпоинтах админки Вукоммерс. Чтобы отключить показ ненужных элементов на некоторых эндпоинтах, вы можете использовать бесплатный плагин Dynamic Visibility for Elementor или Visibility Logic for Elementor, или платный плагин PAFE Pro.

Зайдите как пользователь и пройдите по всем страницам админки. Не забудьте про эти страницы:

  • Страница логина,
  • Информация о заказах (/view-order/)
  • Выход (/customer-logout/)

5. Плагины

Все это можно сделать не вручную, а с помощью платного плагина JetEngine, который встраивается в Вордпресс и Elementor.

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

Если вы не хотите использовать пейдж-билдер, вы можете попробовать бесплатный плагин Custom My Account for Woocommerce.

Довольно простой плагин с довольно простыми возможностями редактирования админки.

В платной версии Custom My Account for Woocommerce вы можете добавлять шорткоды на нужные страницы админки.

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

Еще один более продвинутый вариант — платный плагин YITH WooCommerce Customize My Account page.

Заключение

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

  • Оставьте нужные эндпоинты,
  • Отредактируйте текст из файла dashboard.php,
  • Отключите стандартное меню админки Вукоммерс,
  • Создайте интерфейс админки с помощью пейдж-билдера и настройте видимость элементов на всех эндпоинтах.

Здесь вы можете посмотреть, как выглядит админка на этом сайте.

Читайте также:

  1. Как сделать мембершип на WooCommerce с лайф-тайм лицензией
  2. Кнопка Войти / Выйти для авторизованных и неавторизованных посетителей в меню Вордпресс
  3. Как показывать разные меню для авторизованных и неавторизованных пользователей Вордпресс
  4. Как отключить админ-бар WordPress для всех пользователей, кроме администратора

Надеюсь, статья была полезна. Оставляйте комментарии.

Комментарии:

  1. Дмитрий, во-первых спасибо за отличный материал, который вы разместили на страницах вашего блога. А во-вторых вопрос по плагину Яндекс денег для WooCommerce: при оплате в будущем будет доступ к обновлениям (вообще плагин как часто обновляется)? И не очень понял, в настройках не увидел, после успешной оплаты заказ переходит в статус Выполнено, или где-то это тоже настроить можно?

    Ответить
    • Спасибо за отзыв!
      Плагин приема оплаты официальный от разработчика, текущая версия 1.3.
      Если не ошибаюсь, последний раз плагин обновлялся в конце 2018 года.
      По мере необходимости (изменения в Вукоммерс или у Яндекса), плагин будет обновляться.

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

      Ответить
  2. Хочется, чтобы в момент оплаты, юзеру не нужно было логиниться и регистрироваться, так как это предлагает сделать woocommerce, на странице /checkout.
    —————————————————
    Так я продаю цифровой товар, мне нужен только емайл юзера. Все остальные поля отключены.
    Независимо от того юзер logged-in или logged-out, мы спрашиваем у него только email, а после того как оплата произведена, система проверяет наличие указанного email в базе и если такой email существует, то ему присваивается соответствующий Мембершип, а если юзера с таким email нет, то создает юзера и ему на почту отправляет авто-сгенерированный пароль. (Задача, убрать лишние ненужные отвлекающие телодвижения, чтобы юзера ничего не отвлекало во время покупки.)
    —————————————————
    Вопрос #7: Как это реализовать?

    Ответить
    • Вариантов 2:
      1. Наиболее близкий к тому, что ты хочешь, и который ты можешь реализовать сам.
      2. Сделать в точности как ты хочешь, но для этого понадобится редактировать / добавлять php.

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

      Ответить
  3. Дмитрий, еще 1 вопрос.
    У вас в этой статье использован плагин Яндекс Денег. Где вы его взяли? Мне бы прям вот такой же как у вас получить. Можете ли вы как-то мне его на почту прислать? А то у меня плагин, но он добавляет дополнительную страницу, где ты выбираешь, оплатить картой или с кошелька, а у вас сразу на странице чекаут можно выбрать, с карты или с кошелька… Буду безмерно благодарен, если сможете мне его прислать:)

    Ответить
  4. Дмитрий, подскажите как отредактировать формы логин/регистрация/восстановление пароля/создание нового пароля?

    Ответить
    • Внешний вид можно отредактировать с помощью css,
      Вывод и расположение полей с помощью php,
      Или с помощью плагина форм, например, JetBlocks.

      Ответить
      • Понял спасибо! Ещё вопрос…

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

        Ответить
          • А как бы сделать так, чтобы во время оплаты не предлагалось залогиниться.

            Пример. У меня уже есть аккаунт. Но во время оплаты я не залогинен. И во время оплаты у меня есть поле емайл которое я заполняю и сразу плачу. А когда оплата произошла… происходит проверка есть ли такой емайл в базе и если есть ему доступ к курсу раскрывается

            Возможно ли такое реализовать?

            Ответить
            • Нет, Вукоммерс предлагает либо залогиниться, либо создать новый аккаунт.
              Либо вообще без регистрации, но этот вариант не подходит для организации доступа к материалу.

    • Если это стандартный эндпоинт, то так же, как другие,
      Если нестандартный, то какой-то плагин его добавляет, посмотрите настройки плагина.

      Ответить

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

Do NOT follow this link or you will be banned from the site!