Создание веб-сайта управления обучением (LMS) с Divi

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

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

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

1. Создайте страницу урока, используя элементы существующего макета.
2. Создайте меню курса, которое будет отображаться на каждой странице урока, в котором показаны все уроки курса.
3. Используйте плагин WP Complete, чтобы дать пользователям возможность отслеживать свой прогресс по каждому курсу.
4. Используйте плагин Restrict Content Pro, чтобы настроить как платный, так и бесплатный уровни членства.
5. Узнайте, как быстро создать страницы членства в соответствии с веб-сайтом, используя элементы существующего макета.
и более…

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

Но сначала давайте все настроим.

Создание веб-сайта управления обучением (LMS) с Divi

Подпишитесь на наш канал Youtube

Настройка всего

# 1 - Установите Divi

Убедитесь, что у вас установлена ​​самая последняя версия Divi. И всегда хорошо иметь активную дочернюю тему.

# 2 - Загрузите пакет макетов в свою библиотеку Divi

Мы будем использовать пакет макетов Divi Learning Management (LMS). Загрузите пакет макетов, распакуйте его и установите файл coding-school_All.json в свою библиотеку Divi. Затем создайте девять новых страниц, используя каждый из соответствующих макетов.

# 3 - Установите и активируйте плагин Restrict Content Pro

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

# 4 - Установите и активируйте плагин WP Complete Pro

Этот плагин будет использоваться для информирования участников (или студентов) об их прогрессе по мере завершения каждого урока каждого курса. Он имеет классные графические элементы в виде кружков и гистограмм, чтобы показать прогресс, а также удобную галочку рядом с каждым завершенным уроком в меню навигации.

Как только вы все настроите, вы готовы создать свой электронный курс.

Давайте начнем.

Переименовать страницу курса

Ваш пакет макетов поставляется с макетом страницы курсов.

Каждый из курсов, перечисленных в этом макете, должен (если вы планируете преподавать все эти курсы) должен ссылаться на конкретную страницу курса, которая использует макет страницы курса.

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

Как вы можете видеть, в этом примере макет страницы курса использует курс UX Design, поэтому продолжайте редактировать страницу и измените имя страницы курса с «Course» на «UX Design». И также обновите свою постоянную ссылку.

Создание страницы урока

Ваша новая страница курса, которая теперь называется «UX Design», разбита на главы (вы также можете рассматривать их как уроки) с кратким описанием каждой из них. Каждую из этих глав / уроков необходимо будет перенаправить на отдельную страницу урока. Чтобы создать эту страницу урока, мы собираемся использовать макет страницы курса и внести некоторые изменения.

Первая глава / урок, перечисленный на странице курса UX-дизайна, называется «Глава 1: Введение в основы». Давайте создадим нашу страницу урока для этого.

Добавьте новую страницу и введите в качестве заголовка «Глава 1: Введение в основы».

Поскольку этот урок является дочерней страницей страницы курса UX Design, щелкните родительский раскрывающийся список внутри поля «Атрибуты страницы» на правой боковой панели и выберите «UX Design» в качестве родительского.

Затем нажмите, чтобы использовать Divi Builder, нажмите «Добавить из библиотеки» и выберите макет курса.

Сохранить черновик

Отрегулируйте макет заголовка

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

Затем щелкните, чтобы изменить настройки верхнего текстового модуля в первом столбце, и измените текст заголовка h1 на «Глава 1: Введение в основы».

Затем измените структуру столбцов строки на один столбец вместо двух.

Теперь ваш заголовок должен выглядеть так.

Изменить содержимое рекламного объявления

В специальном разделе ниже отредактируйте настройки первого рекламного объявления в левом разделе содержимого и обновите следующее:

Вкладка Content

Название: Часть 1
Контент: [Это станет вашим контентом для курса; Я пока оставляю там фиктивный контент]
Значок использования: ДА
Значок: выберите значок стрелки вправо

Примечание: цвет значка будет взят из параметра «Цвет акцента», установленного в настройщике темы, поэтому убедитесь, что вы обновили цвет там до цвета, соответствующего сайту.

Сохранить настройки

Теперь, когда у вас есть один модуль аннотации, мы можем использовать его как шаблон для разбивки каждой части урока на странице. Идите вперед и продублируйте модуль, который вы только что создали, два раза (или любое количество частей, которые вы хотите) и обновите каждый с другим заголовком (например, Часть 2, Часть 3 и т. Д.).

Затем удалите другие объявления, которые нам больше не понадобятся.

Теперь ваш макет должен выглядеть так.

Добавление виджета боковой панели

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

На вкладке содержимого добавьте белый фон к вашему модулю.

Чтобы модуль боковой панели соответствовал дизайну страницы, обновите настройки на вкладке «Дизайн» следующим образом:

Пользовательское поле: -80 пикселей сверху
Пользовательские отступы: 30 пикселей сверху, 40 пикселей справа, 30 пикселей снизу, 40 пикселей слева
Горизонтальное положение тени блока: 0 пикселей
Вертикальное положение коробки Shadwo: 0px
Сила размытия тени коробки: 60 пикселей
Сила распространения тени коробки: 0 пикселей
Цвет тени: rgba (71,74,182,0.12)

Стиль анимации: Zoom
Направление анимации: вверх
Интенсивность анимации: 20%
Начальная непрозрачность анимации: 100%

Сохранить настройки

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

Наконец, удалите модуль аннотации с инструктором и модуль кнопки «Полный профиль». Ваша страница должна выглядеть так:

Сохранить страницу

Теперь, когда у нас создана одна из страниц нашего урока, давайте сохраним ее в нашей библиотеке, чтобы мы могли использовать ее для других уроков. В визуальном конструкторе нажмите кнопку «Добавить в библиотеку» в нижнем меню, введите «Макет страницы урока» в качестве имени шаблона и затем сохраните его.

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

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

1. Глава 1. Введение в основы
2. Глава 2: Информационная архитектура
3. Глава 3. Адаптивный дизайн.

Создание меню курса

Теперь, когда у вас созданы уроки, мы можем создать меню курса. На панели управления WordPress перейдите в Внешний вид> Меню .

На странице меню выполните следующие действия:

1. Выберите «Создать новое меню».
2. Назовите его «UX-дизайн».
3. Выберите три страницы / главы уроков в только что созданном меню.
4. Нажмите "Добавить в меню".
5. Сохраните меню.

Создание настраиваемой области виджетов

Чтобы добавить меню на нашу страницу урока, нам сначала нужно создать для него настраиваемую область виджетов. На панели управления WordPress перейдите в Внешний вид> Виджеты . Под существующими областями виджетов найдите поле, используемое для создания новой области виджетов. Введите имя «UX Design» и нажмите «Создать». Теперь обновите страницу. Теперь вы должны увидеть новую область виджетов «UX Design». Перетащите виджет Custom Menu внутрь области виджетов «UX Design». В виджете Custom Menu выберите меню «UX Design». Затем нажмите «Сохранить».

Обновите модуль боковой панели страницы урока с помощью новой области виджетов

Теперь, когда у вас есть область виджетов, созданная вместе с меню курса, вернитесь к страницам курса, которые вы создали, и обновите модуль боковой панели, чтобы выбрать область виджетов «UX Design». Теперь ваше меню должно появиться на боковой панели.

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

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

Добавить отслеживание прогресса по курсу

Добавление отслеживания прогресса курса на ваш веб-сайт электронного курса - отличный способ повысить пользовательский опыт, заинтересованность и мотивацию при прохождении курса. Чтобы показать прогресс по каждому из наших курсов, я собираюсь использовать плагин WP Complete Pro. Если вы еще этого не сделали, убедитесь, что вы установили и активировали плагин.

После активации плагина на панели управления WordPress перейдите в « Настройки»> «WPComplete» . Это приведет вас к настройкам плагина.

Обновите следующие настройки:

Тип роли учащегося: подписчик
Тип содержания урока: Типы страниц (поскольку мы строим наши уроки со страницами, а не сообщениями)
Снимите флажок «Автоматически добавлять кнопку завершения для включенных сообщений и страниц для меня». (мы собираемся вручную добавить эти кнопки с помощью шорткода.)
Цвет кнопки "Отметить как завершенную": # 7377fc
Основной цвет настроек графика: # 7377fc

Затем нажмите «Сохранить изменения».

Включение полных кнопок на страницах уроков

Теперь, когда у нас есть полная настройка WP. Давайте добавим наши кнопки «Завершить» на наши страницы уроков.

Перейдите на первую созданную нами страницу урока под названием «Глава 1: Введение в основы» и щелкните, чтобы отредактировать страницу. В редакторе страниц по умолчанию найдите поле WPComplete внизу страницы. Внутри поля щелкните параметр «Включить кнопку завершения». Это сообщит плагину, что вы хотите отслеживать эту страницу для пользователя. Затем в поле ввода сразу после надписи «Это часть:» введите «UX Design» - название курса, который вы хотите отслеживать. Вот как вы группируете уроки по каждому курсу. Например, если у вас есть три урока, и на каждой из этих страниц уроков вы выбираете «UX Design» в качестве курса, когда пользователь завершает страницу, нажимая кнопку «Завершить», плагин может записать, что пользователь выполнил 33% (1 из 3 уроков) этого курса. Если у вас несколько курсов, вы можете просто ввести новое название курса в поле, и это запустит новую группу курсов.

Добавить готовые кнопки на страницы уроков

Чтобы добавить кнопку «Завершить» на страницу урока, разверните визуальный конструктор на той же странице урока, которую вы только что редактировали.

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

[wpc_button text = "Щелкните меня, чтобы завершить!" Complete_text = ”УРА! Завершенный"]

Примечание. Вы можете изменить текст и заполненный текст, отображаемый на кнопке, изменив текст в шорткоде.

Сохранить настройки

Этот шорткод создает кнопку, которая позволяет пользователю щелкнуть по ней и записать урок как завершенный.

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

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

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

Добавить индикатор выполнения на боковую панель

Плагин WPComplete также позволяет отображать графики, которые показывают пользователю их прогресс по определенному курсу. Мы собираемся добавить гистограмму, чтобы показать прогресс курса UX Design на боковой панели наших уроков.

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

Чтобы добавить гистограмму, перейдите на панель управления WordPress и выберите « Внешний вид»> «Виджеты» . Затем переключите открытие настраиваемого виджета «UX Design», который вы создали ранее, и перетащите виджет HTML в область виджетов поверх виджета настраиваемого меню, который находится там в данный момент. В поле содержимого HTML введите следующий шорткод:

[wpc_progress_bar course = ”UX Design”]

Этот шорткод будет отображать индикатор выполнения для конкретного курса «UX Design». Это название курса соответствует тому, что вы указали в поле WPComplete рядом с «Это часть:». Если у вас есть еще один курс в будущем, просто введите новое название курса вместо «UX Design» при добавлении шорткода для этого курса.

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

Теперь перейдите к «Главе 1: Введение в основы», чтобы увидеть, как это выглядит.

Нажмите кнопку «Завершить» внизу страницы. Теперь посмотрите на боковую панель, чтобы увидеть, что изменилось. Гистограмма теперь показывает, что вы прошли 33% курса. И пункт меню для страницы урока теперь отображается как блеклый с галочкой справа, чтобы показать, что этот урок был завершен.

Довольно круто, да?

Давайте рассмотрим, что у нас есть на данный момент:

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

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

Создание страниц членства

Если вы еще этого не сделали, установите и активируйте плагин Restrict Content Pro. После установки плагин автоматически создаст 5 страниц для обработки процесса членства.

Если вы посмотрите на каждую страницу в редакторе страниц по умолчанию, вы увидите, что единственное, что добавляется к содержимому каждой страницы, - это шорткод. Например, если вы перейдете на страницу регистрации, вы увидите, что единственное, что есть в редакторе контента, - это короткий код «[register_form]», который будет отображать форму регистрации.

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

Затем щелкните одно из рекламных объявлений, в которых показан курс, и сохраните этот модуль в своей библиотеке под названием «Блок содержимого аннотации электронного курса» (или что-то в этом роде).

Теперь перейдите на страницу регистрации, скопируйте шорткод в буфер обмена (выделите шорткод и нажмите ctrl + c). Затем разверните Divi Builder, затем визуальный конструктор. Добавьте новый сохраненный раздел под названием «Заголовок страницы электронного курса» из своей библиотеки.

Обновите текстовый модуль, содержащий заголовок, чтобы он сказал «Зарегистрироваться» вместо «Курсы».

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

Затем обновите настройки следующим образом:

На вкладке содержания…

Стереть заголовок
Содержимое: введите шорткод [register_form], который вы сохранили в буфер обмена, нажав ctrl + v.
Удалите URL-адрес изображения

Сохранить настройки

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

Теперь посмотрите на свою страницу регистрации в браузере в режиме инкогнито.

Вам все еще нужно настроить дизайн формы (в этом руководстве мы этого делать не будем), но это легко сделать с помощью некоторой проверки и пользовательского CSS.

Вы можете выполнить тот же процесс, чтобы обновить все 5 страниц членства, созданных плагином. Чтобы просмотреть, какие страницы используются для обработки членства, перейдите на панель управления WordPress и перейдите в раздел « Ограничить»> «Настройки», и вы увидите список всех страниц, которые используются на вкладке «Общие».

Добавление уровня БЕСПЛАТНОЙ подписки

Добавление уровня БЕСПЛАТНОЙ подписки к вашему электронному курсу - отличный способ привлечь потенциальных клиентов, добавить их в маркетинговую кампанию по электронной почте и продать их на премиум-членстве. Чтобы добавить уровень БЕСПЛАТНОЙ подписки, перейдите на панель управления WordPress и выберите « Ограничить»> «Уровни подписки» . Затем заполните настройки, чтобы создать БЕСПЛАТНОЕ членство. Вот пример того, что нужно ввести для бесплатного уровня подписки:

Имя: БЕСПЛАТНО
Описание: Это БЕСПЛАТНАЯ подписка на школу кодирования.
Роль пользователя: подписчик

Оставьте для остальных параметров значения по умолчанию.

Затем нажмите Добавить уровень членства.

Добавление уровня подписки Premium

Премиум-членство обычно означает, что вы можете взимать деньги за доступ к контенту более высокого уровня, к которому нельзя получить доступ при бесплатном членстве. Как и в случае с БЕСПЛАТНЫМ членством, пользователю необходимо зарегистрироваться в регистрационной форме. Единственное отличие состоит в том, что они будут направлены на платежную форму для покупки подписки. Если пользователь уже является БЕСПЛАТНЫМ участником, он может перейти на Премиум-подписку, используя свою текущую регистрационную информацию, а затем оплатить обновление.

Чтобы добавить уровень подписки Premiumn, перейдите на панель управления WordPress и выберите «Ограничить»> «Уровни подписки». Затем заполните настройки, чтобы создать подписку Premium. Вот пример того, что нужно ввести для уровня подписки Premium:

Имя: Премиум
Описание: это премиальная подписка на Coding School.
Продолжительность: 1 год
Стоимость: 29
Роль пользователя: подписчик

Ограничение уроков в зависимости от уровня подписки

Теперь, когда у нас созданы уровни бесплатной и премиальной подписки. Мы можем ограничить количество страниц / сообщений или даже конкретный контент в зависимости от уровня подписки пользователей. Плагин упрощает этот процесс. Давайте возьмемся за голову и ограничим доступ к первому уроку, который мы создали, БЕСПЛАТНОЙ подпиской. Для этого перейдите к редактированию страницы урока под названием «Глава 1: Введение в основы». Обратите внимание на поле «Ограничить это содержимое» вверху редактора страницы. В поле у ​​вас есть раскрывающееся поле ввода, которое позволяет вам выбрать, кто должен иметь доступ к контенту. Вы собираетесь выбрать участников уровня (-ов) подписки . После выбора вы увидите больше вариантов. Выберите первый вариант с надписью «Участники любого уровня (-ов) подписки». Это потому, что мы хотим, чтобы участники, у которых будет премиум-подписка, также имели доступ к этому контенту.

Примечание. Этот параметр скроет всю страницу от неподписанных пользователей. Если вы хотите скрыть определенные фрагменты контента на странице и сделать их доступными только для подписчиков Free или Premium, вы можете использовать шорткоды, чтобы обернуть контент, который вы хотите скрыть. Поскольку мы используем конструктор divi, использование шорткодов для обертывания контента может быть сложной задачей, но вы могли бы подумать о том, чтобы обернуть только контент в блоки фактического контента в рекламных объявлениях с шорткодами и оставить заголовки видимыми.

В следующем уроке под названием «Глава 2: Информационная архитектура» мы собираемся ограничить страницу только для подписчиков Premium. Для этого перейдите к редактированию страницы и в поле «Ограничить это содержимое» в верхней части редактора страницы выберите « Члены уровня (ов) подписки» . Затем выберите опцию «Участники определенных уровней подписки. Затем выберите «Премиум». Теперь только люди с подпиской Premium смогут получить доступ к этой странице.

Сохраните изменения, обновив страницу.

Измените страницу переадресации на запрещенный контент

Когда пользователь пытается получить доступ к ограниченному контенту, вы можете перенаправить пользователя на определенную страницу. Поскольку мы хотим, чтобы пользователь зарегистрировался, чтобы получить доступ к курсу, имеет смысл перенаправить пользователя на страницу регистрации. Для этого перейдите в панель управления WordPress, перейдите в раздел «Ограничить»> «Настройки» и нажмите вкладку «Разное». Найдите параметр «Страница перенаправления» и выберите страницу «Регистрация» из раскрывающегося поля ввода.

Параметры сохранения

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

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

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

Добавление платежного шлюза

На этом этапе вам нужно убедиться, что ваш платежный шлюз интегрирован с Restrict Content Pro. Вы можете сделать это, перейдя в раздел « Ограничить»> «Настройки» и щелкнув вкладку «Платежи» . Здесь вы можете выбрать, какие шлюзы вы хотите включить, а также ввести информацию, необходимую для интеграции шлюза. У вас есть девять вариантов на выбор, включая Stripe и Paypal.

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

Настройка уведомлений по электронной почте

Restrict Content Pro позволяет настроить уведомление по электронной почте как для нового участника, так и для администратора всякий раз, когда новый участник регистрируется. Воспользуйтесь этой возможностью, включив в тело письма хороший призыв к действию, побуждающий пользователя начать курс со ссылки на первый урок. Вы можете найти настройки электронной почты, перейдя в Ограничить> Настройки и перейдите на вкладку сообщения электронной почты.

Дополнительная интеграция электронного маркетинга

У вас может быть учетная запись Mailchimp или Aweber, в которую вы хотите добавить участников при регистрации. Вы можете сделать это с помощью одного из множества надстроек, доступных с помощью подключаемого модуля Restrict Content Pro. Просто перейдите в раздел «Ограничить»> «Надстройки» и найдите нужную платформу электронной почты.

Что теперь?

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

Последние мысли

Можно утверждать, что со всеми замечательными инструментами в мире WordPress вы можете довольно легко запустить онлайн-курс. Но есть еще проблема дизайна. Нелегко заставить эти сайты выглядеть достойно, если дизайн не является вашей сильной стороной. К счастью, готовые макеты Divi, такие как «Learning Management Layout Pack», предлагают отличное решение проблемы дизайна. Компоновка функциональна и красива прямо из коробки.

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

Я с нетерпением жду вашего ответа в комментариях

Ваше здоровье!