J’aime suivre des cours en ligne. Il y a quelque chose à propos de commencer un cours électronique bien conçu et bien organisé avec un excellent contenu. Si c’est bon, ces cours électroniques peuvent vous garder motivé avec un sentiment d’accomplissement. Mais apprendre d’un excellent cours en ligne et en créer un sont deux expériences totalement différentes. Et d’après mon expérience, la création d’un site de gestion de l’apprentissage ou d’un site de cours en ligne peut être un processus écrasant.

Dans cet article, j’espère éliminer le bord de l’intimidation pour créer votre propre cours de formation en ligne, vous montrant comment utiliser le package de gestion de l’apprentissage préliminaire Divi pour créer un site Web de formation en ligne complet.

Avant de commencer la construction, voici une ventilation de ce que nous accomplirons ensemble:

    1. Créez une page de leçon en utilisant des morceaux de la mise en page existante.
    2. Créez un menu de cours qui sera affiché sur chaque page de la leçon qui montre toutes les leçons du cours.
    3. Utilisez le plugin WP Complete pour donner aux utilisateurs la possibilité de suivre leurs progrès pour chaque cours.
    4. Utilisez le plug-in Restrict Content Pro pour configurer les niveaux d’abonnement gratuit et payant.
    5. Apprenez à concevoir rapidement les pages des membres pour les adapter à votre site Web en utilisant des éléments de votre mise en page existante.
    et d’autres…

Et, pour satisfaire votre curiosité, voici un haut de la page de cours que vous allez créer avec le bouton complet et la barre de progression au dessus du menu du cours dans la barre latérale …

page de leçon

Mais d’abord, mettons les choses au clair.

Création d’un site Web de gestion de l’apprentissage (LMS) avec Divi

Abonnez-vous à notre chaîne YouTube

Tout régler

# 1 – Installer Divi

Assurez-vous que la dernière version de Divi est installée. Et, il est toujours bon d’avoir un thème actif pour les enfants.

# 2 – Téléchargez le package de mise en page dans la bibliothèque Divi

Nous utiliserons le package Divi des aspects de la gestion de l’apprentissage (LMS). Téléchargez le package de mise en page, décompressez-le et installez le fichier coding-school_All.json dans la bibliothèque Divi. Créez ensuite neuf nouvelles pages en utilisant chacun de leurs aspects.

# 3 – Installez et activez le plugin Restrict Content Pro

Il s’agit du plugin que nous utiliserons pour la fonctionnalité d’adhésion du site e-learning. Nous l’utiliserons pour établir un abonnement gratuit et premium (payant) au cours.

# 4 – Installez et activez le plugin WP Complete Pro

Ce plugin sera utilisé pour tenir les membres (ou étudiants) informés de leurs progrès au fur et à mesure qu’ils terminent chaque leçon de chaque cours. Il a des graphiques en cercle et en barres sympas pour montrer la progression, ainsi qu’une note de validation à côté de chaque leçon terminée dans le menu de navigation.

Une fois que vous êtes prêt, vous êtes prêt à créer votre cours en ligne.

Commençons.

Renommer la page du cours

Votre package de mise en page est livré avec une page de cours

page du cours

Chacun des cours répertoriés sur ce sujet doit (si vous avez l’intention d’enseigner tous ces cours) un lien vers une page de cours spécifique qui utilise la mise en page de la page de cours.

page du cours

Remarque: Notez que j’ai remplacé le bouton sur l’en-tête de la page du cours ci-dessus par un module vidéo. De cette façon, je n’ai pas à rediriger vers une autre page pour afficher l’aperçu du cours. Juste une idée.

Comme vous pouvez le voir, par exemple, la mise en page de la page de cours utilise le cours de conception UX, alors allez-y et modifiez la page et changez le nom de la page de cours de « Cours » en « Conception UX ». Et mettez également à jour le lien permanent.

changer le nom de la page du cours

Création de la page de leçon

Votre nouvelle page de cours, maintenant appelée « UX Design », est divisée en chapitres (vous pouvez également les considérer comme des leçons) avec une brève description de chacun. Chacun de ces chapitres / leçons devra être redirigé vers leur propre page de leçons. Pour construire cette page de leçon, nous utiliserons la disposition de la page de cours et effectuerons quelques ajustements.

Le premier chapitre / leçon répertorié sur la page du cours de conception UX est appelé «Chapitre 1: Une introduction aux bases». Construisons notre page de leçon pour cela.

Allez-y et ajoutez une nouvelle page et entrez « Chapitre 1: Mise en route » avec le titre.

Dans la mesure où cette leçon est une page latérale de la page du cours Conception UX, cliquez sur le menu déroulant parent dans la zone Attributs de page dans la barre latérale droite et sélectionnez Conception UX comme parent.

Cliquez ensuite pour utiliser Divi Builder, cliquez sur Ajouter à partir de la bibliothèque et sélectionnez Mise en page du cours.

ajouter une nouvelle page de cours

Enregistrez l’esquisse

Ajustez l’apparence de l’en-tête

Cliquez maintenant pour utiliser Visual Builder pour effectuer certains ajustements à la mise en page de la page. Tout d’abord, changeons l’apparence de notre en-tête dans la section supérieure. Dans le générateur visuel, supprimez le module d’image de la colonne de droite et le bouton vert en bas de la première colonne.

supprimer l'image et le bouton

Cliquez pour modifier les paramètres du module de texte dans la première colonne et remplacez le texte de l’en-tête h1 par «Chapitre 1: Mise en route».

mettre à jour le titre

Modifiez ensuite la structure des colonnes de la ligne en une colonne au lieu de deux.

changez votre tour

Maintenant, votre en-tête devrait ressembler à ceci.

en-tête changé

Changer le contenu de Blurb

Dans la section spécialisée ci-dessous, modifiez les paramètres du premier texte de présentation dans la section de contenu de gauche et mettez à jour les éléments suivants:

Onglet Contenu

Titre: Part 1
contenu: [This will become your content for the course; I’m leaving the mock content in there for now]Utilisez l’icône: OUI
Icône: sélectionnez l’icône représentant une flèche vers la droite

mettre à jour le contenu du texte de présentation

Remarque: La couleur de l’icône sera tirée du jeu de couleurs du thème Accent dans le personnalisateur de thème, alors assurez-vous de mettre à jour la couleur là-bas avec une couleur qui correspond au site.

Enregistrez les paramètres

Maintenant que vous avez créé un module de présentation, nous pouvons l’utiliser comme modèle pour diviser chaque partie de la leçon sur la page. Continuez et dupliquez le module que vous venez de créer deux fois (ou autant de parties que vous le souhaitez) et mettez à jour chacun avec un titre différent (c’est-à-dire partie 2, partie 3, ect …).

Effacez ensuite les autres ambiguïtés dont nous n’aurons plus besoin.

Maintenant, votre look devrait ressembler à ceci.

look mis à jour

Ajout du widget de la barre latérale

Ajoutez un module de barre latérale sous le module de boutons dans la barre latérale droite de la section spécialisée. Et pour l’instant, laissez simplement les paramètres de contenu par défaut qui dessinent le contenu de la zone de widget de la barre latérale. Enfin, nous allons changer cela dès que nous créerons une zone de widget personnalisée qui comprend le menu du cours.

Sous l’onglet de contenu, ajoutez un fond blanc à votre module.

Pour que votre module de barre latérale corresponde à la mise en page, mettez à jour les paramètres de l’onglet de conception comme suit:

Marge personnalisée: -80px Top
Rembourrage personnalisé: 30 pixels en haut, 40 pixels à droite, 30 pixels en bas, 40 pixels à gauche
Position horizontale de l’ombre de la boîte: 0px
Boîte Shadwo Position verticale: 0px
Boîte Shadow Box: 60px
Force de propagation de l’ombre de la boîte: 0px
Couleur de l’ombre: rgba (71.74.182,0.12)

Style d’animation: Zoom
Direction de l’animation: vers le haut
Intensité de l’animation: 20%
Opacité de démarrage de l’animation: 100%

Enregistrez les paramètres

Remarque: C’est une bonne idée d’aller de l’avant et d’en faire un module global, donc vous n’avez que des ajustements à un module pour les futures mises à jour. Pour ce faire, sélectionnez ajouter à la bibliothèque, nommez-le « mode de barre latérale du menu de leçon », sélectionnez-le comme module global, puis cliquez sur Enregistrer.

Enfin, supprimez le module de présentation avec l’instructeur et le module avec le bouton « Profil complet ». Votre page devrait ressembler à ceci:

conception du module de la barre latérale

Enregistrez la page

Maintenant que nous avons construit une de nos pages de cours, enregistrons-la dans notre bibliothèque afin de pouvoir l’utiliser pour d’autres leçons. Dans le générateur visuel, cliquez sur le bouton « Ajouter à la bibliothèque » dans le menu des boutons, entrez « Leçon de mise en page » pour le nom du modèle, puis enregistrez-le.

ajouter à la bibliothèque

Continuez et répétez les étapes ci-dessus pour ajouter deux autres pages de leçons. Seulement cette fois, au lieu d’utiliser la mise en page des pages de cours, utilisez la nouvelle mise en page que vous avez créée, appelée « mise en page de la leçon ».

Lorsque vous avez terminé, vous devez créer trois pages de cours avec les titres suivants:

1. Chapitre 1: Introduction aux bases
2. Chapitre 2: Architecture de l’information
3. Chapitre 3: Conception réceptive

trois leçons

Création du menu du cours

Maintenant que vous avez créé les leçons, nous pouvons construire notre menu de cours. Depuis le tableau de bord WordPress, connectez-vous Apparence> Menus.

À partir de la page Menus, procédez comme suit:

1. Sélectionnez « Créer un nouveau menu »
2. Appelez-le « UX Design »
3. Sélectionnez les trois pages / chapitres de leçon dans le menu que vous venez de créer.
4. Cliquez sur Ajouter au menu
5. Enregistrez le menu

le menu du cours créé

Créer la zone du widget personnalisé

Pour ajouter le menu à notre page de cours, nous devons d’abord créer une zone de widget personnalisée. Depuis le tableau de bord WordPress, connectez-vous Apparence> Widgets. Dans les zones de widget existantes, recherchez la case utilisée pour créer une nouvelle zone de widget. Entrez le nom « UX Design » et cliquez sur « Créer ». Actualisez maintenant la page. Vous devriez maintenant voir la nouvelle zone de widget personnalisé « UX Design ». Faites glisser le widget Menu personnalisé dans la zone de widget « UX Design ». Dans le widget Menu personnalisé, sélectionnez le menu « UX Design ». Cliquez ensuite sur Enregistrer.

créer le menu du cours

Mettre à jour le module de barre latérale de la leçon avec la nouvelle zone de widget

Maintenant que vous avez créé la zone de widget avec le menu du cours, revenez aux pages de cours que vous avez créées et mettez à jour le module de la barre latérale pour sélectionner la zone de widget « UX Design ». Votre menu devrait maintenant apparaître dans la barre latérale.

mettre à jour le widget de la barre latérale

Remarque: Si vous avez créé le module global de la barre latérale, vous devrez effectuer ce réglage une fois pour ce module, les deux autres seront mis à jour automatiquement.

Pour le moment, nous avons une assez bonne base pour créer nos cours et leçons, alors améliorons notre UX en intégrant le suivi de la progression du cours.

Ajouter un suivi de cours

L’ajout d’un suivi des progrès du cours à votre site de cours en ligne est un excellent moyen de stimuler l’expérience utilisateur, l’implication et la motivation pendant que vous suivez le cours. Pour montrer la progression de chacun de nos cours, j’utiliserai le plugin WP Complete Pro. Si vous ne vous assurez pas déjà d’installer et d’activer le plugin.

Une fois le plugin activé, à partir du tableau de bord WordPress, accédez à Paramètres> WPCcomplete. Cela vous amènera aux paramètres du plugin.

Mettez à jour les paramètres suivants:

Type de rôle étudiant: abonné
Type de contenu de la leçon: types de pages (car nous construisons nos leçons avec des pages au lieu de publications)
Décochez l’option « Ajouter automatiquement le bouton complet aux publications et aux pages activées pour moi ». (Nous ajouterons ces boutons de shortcode manuellement.)
Marquage des boutons en couleur: # 7377fc
Paramètres du nuancier principal: # 7377fc

Cliquez ensuite sur Enregistrer les modifications.

paramètres wpcomplete

Activez les boutons complets sur les pages de cours

Maintenant que nous avons la configuration complète de WP. Ajoutons nos boutons « complets » à nos pages de cours.

Accédez à la première page de la leçon que j’ai créée, intitulée «Chapitre 1: Premiers pas avec les bases», et cliquez pour modifier la page. Dans l’éditeur de page par défaut, recherchez la zone WPComplete au bas de la page. Dans la boîte, cliquez sur l’option « Activer le bouton complet ». Cela indiquera au plugin que vous souhaitez suivre cette page pour l’utilisateur. Ensuite, dans la zone de saisie immédiatement après avoir tapé « Cela fait partie de: » entrez « UX Design » qui est le nom du cours que vous souhaitez suivre. Ainsi, vous regroupez les leçons dans chaque cours. Par exemple, si vous avez trois leçons et sur chacune de ces pages de leçon, sélectionnez «UX Design» comme cours, lorsqu’un utilisateur termine une page en cliquant sur le bouton complet, le plugin est en mesure d’enregistrer que l’utilisateur a terminé 33% (1 de 3 leçons) de ce cours. Si vous avez plusieurs cours, vous pouvez simplement entrer un nom de cours dans la case et un nouveau groupe de cours commencera.

bouton d'activation

Ajouter des boutons complets aux pages de cours

Pour ajouter le bouton « Terminer » à la page de la leçon, déployez le générateur visuel sur la même page de la leçon que vous venez de modifier.

Ajoutez un module de texte sous le dernier module de texte de présentation en bas de la page. Dans les paramètres de texte, entrez le shortcode suivant dans la zone de contenu:

[wpc_button text=”Click me to complete!” completed_text=”YAY! Completed”]

Remarque: Vous pouvez modifier le texte et le texte terminé affichés sur le bouton en changeant le texte en shortcode.

Enregistrez les paramètres

bouton ajouter

Ce code court crée un bouton qui permet à l’utilisateur de cliquer dessus et d’enregistrer la leçon comme terminée.

bouton complet

Notez que lorsque vous cliquez sur le bouton pour terminer la leçon, l’élément de menu dans la barre latérale de la leçon correspondante s’estompe légèrement et affiche une coche à sa droite.

bouton gif

Allez-y et enregistrez le module de texte que vous venez de créer dans votre bibliothèque en tant que « bouton complet ». Vous pouvez maintenant utiliser cet élément de bibliothèque pour entrer dans le même mode sur toutes vos pages selon vos besoins.

Remarque: Vous souhaiterez peut-être aller plus loin et enregistrer une nouvelle version de la disposition des pages de leçon dans la bibliothèque, avec le bouton complet inclus, de sorte que vous n’avez pas besoin de l’ajouter comme élément secondaire lors de la construction des futures pages de leçon.

Ajouter le graphique à barres de progression à la barre latérale

Le plugin WPComplete vous permet également d’afficher des graphiques qui montrent à l’utilisateur sa progression pour un cours particulier. Nous ajouterons un graphique à barres pour montrer la progression du cours UX Design dans la barre latérale de nos leçons.

Rappelez-vous comment nous avons créé une zone de widget personnalisée pour notre cours de conception UX pour afficher un menu de cours dans la barre latérale de la page de leçon? Eh bien, maintenant, nous allons ajouter un graphique à barres de progression juste au-dessus de notre menu de cours. De cette façon, l’utilisateur peut voir sa progression dans un écran visuel sympa.

Pour ajouter le graphique à barres, accédez au tableau de bord WordPress et accédez à Apparence> Widgets. Ouvrez ensuite le widget personnalisé « UX Design » que vous avez créé précédemment et faites glisser un widget HTML vers la zone du widget en haut du widget de menu personnalisé existant. Dans la zone de contenu HTML, entrez le code de fonction suivant:

[wpc_progress_bar course=”UX Design”]

ajouter le graphique à barres

Ce code court affichera le graphique à barres de progression pour le cours spécifique « UX Design ». Ce nom de cours correspond à ce que vous avez entré dans la case WPComplete à côté de « Cela fait partie de: ». Si vous avez un autre cours à l’avenir, entrez le nouveau nom du cours au lieu de « UX Design » lorsque vous ajoutez le code court pour ce cours.

Remarque: Pour une liste complète des shortcodes disponibles pour ce plugin, accédez à la fiche de test des shortcodes.

Allez maintenant au « Chapitre 1: Mise en route » pour voir à quoi il ressemble.

Cliquez sur le bouton Remplir au bas de la page. Vérifiez maintenant la barre latérale pour voir ce qui a changé. Le graphique à barres montre maintenant que vous avez terminé 33% du cours. Et l’élément de menu pour la page de la leçon semble maintenant décoloré avec une marque sur la droite pour montrer que la leçon est terminée.

graphique à barres

Assez cool?

Passons en revue ce que nous avons jusqu’à présent:

1. Nous avons un nouveau modèle de page pour les leçons pour nous aider dans le modèle pour les prochaines leçons
2. Nous avons un système pour créer un menu personnalisé pour chaque cours.
3. Nous avons un système pour configurer des zones de widgets personnalisés pour chaque cours afin d’afficher le menu personnalisé pour ce cours spécifique sur la page de la leçon.
4. Nous avons la possibilité d’ajouter un bouton complet à nos pages de cours qui, lorsque vous cliquez dessus, représente la progression dans un graphique à barres et le lien de menu correspondant.

La dernière étape de la transformation de notre site en un cours en ligne fonctionnel consiste à intégrer les niveaux d’adhésion pour limiter notre contenu aux clients payants.

Création de pages d’adhésion

Si ce n’est pas déjà fait, installez et activez le plugin Restrict Content Pro. Une fois installé, le plugin créera automatiquement 5 pages pour gérer le processus d’adhésion.

5 pages

Si vous regardez chaque page dans l’éditeur de page par défaut, vous verrez que la seule chose ajoutée au contenu de chaque page est un code court. Par exemple, si vous accédez à la page d’inscription, vous verrez que la seule chose dans l’éditeur de contenu est le code court. « [register_form] »Qui affichera le formulaire d’inscription.

shortcode

Parce que tout ce dont vous avez besoin pour afficher le contenu de chacune de ces pages générées automatiquement est des codes courts, vous pouvez facilement créer une mise en page pour ces pages à l’aide de Divi Builder. Par exemple, si vous souhaitez personnaliser rapidement et facilement votre page d’inscription, accédez à votre page de cours et implémentez le générateur visuel. Enregistrez la section supérieure de la mise en page dans votre bibliothèque en tant qu’en-tête de page de cours en ligne (ou quelque chose comme ça).

enregistrer l'en-tête du cours

Cliquez ensuite sur l’un des aspects qui affiche le cours et enregistrez le module dans votre bibliothèque en tant que « zone de contenu flou du cours » (ou quelque chose comme ça).

ajouter un mode de contenu de présentation

Accédez maintenant à votre page d’inscription, copiez le shortcode dans le presse-papiers (mettez le shortcode en surbrillance et cliquez sur ctrl + c). Ensuite, implémentez Divi Builder, puis le constructeur visuel. Ajoutez la nouvelle section enregistrée appelée « en-tête de page de cours en ligne » à partir de votre bibliothèque.

ajouter la section

Mettez à jour le module de texte qui contient le titre pour écrire « S’inscrire » au lieu de « Cours ».

renommer le registre

Cliquez ensuite pour ajouter un module à votre bibliothèque sous les modules actuels de la section. Sélectionnez le module « e-course blur content box » que vous venez d’enregistrer dans votre bibliothèque.

ajouter un texte de présentation

Mettez ensuite à jour les paramètres comme suit:

Sous l’onglet de contenu …

Supprimer le titre
Contenu: entrez le code court [register_form] que vous avez enregistré dans le presse-papiers en appuyant sur ctrl + v.
Supprimer l’URL de l’image

Enregistrez les paramètres

flou personnalisé

Remarque: ce fut le moyen rapide et facile. J’ai utilisé un module Blurb car c’était le moyen le plus rapide de rendre le style du module. Vous voudrez probablement utiliser un module de texte à la place.

Regardez maintenant votre page d’inscription dans un navigateur incognito.

page d'inscription finale

Vous devez toujours personnaliser la conception du formulaire (cela ne sera pas le cas dans ce didacticiel), mais cela peut être facilement effectué avec une inspection et un CSS personnalisé.

Vous pouvez suivre le même processus pour mettre à jour les 5 pages membres générées par le plugin. Pour voir quelles pages sont utilisées pour gérer votre adhésion, accédez au tableau de bord et accédez à WordPress Restreindre> Paramètres et vous verrez une liste de toutes les pages utilisées sous l’onglet Général.

Ajouter un niveau d’abonnement GRATUIT

L’ajout d’un niveau d’abonnement GRATUIT à votre cours en ligne est un excellent moyen de saisir des opportunités, de les ajouter à une campagne de marketing par e-mail et de les développer avec un abonnement premium. Pour ajouter un niveau d’abonnement GRATUIT, accédez au tableau de bord WordPress et accédez à Restreint> Niveaux d’abonnement. Ensuite, complétez les paramètres pour créer votre abonnement GRATUIT. Voici un exemple de quoi saisir pour un niveau d’abonnement gratuit:

Nom: GRATUIT
Description: Ceci est un abonnement GRATUIT à Coding School.
Rôle utilisateur: abonné

Laissez les autres options à leurs paramètres par défaut.

Cliquez ensuite sur Ajouter un niveau de membre

ajouter gratuitement

Ajouter un niveau d’abonnement premium

Un membre Premium est généralement l’endroit où vous pouvez facturer de l’argent pour accéder à du contenu de premier niveau auquel vous ne pouvez pas accéder avec un membre gratuit. En tant que membre GRATUIT, l’utilisateur devra s’inscrire sur le formulaire d’inscription. La seule différence est qu’ils seront dirigés vers un formulaire de paiement pour acheter l’abonnement. Si l’utilisateur est déjà un membre GRATUIT, il peut passer à un abonnement Premium en utilisant ses informations d’enregistrement actuelles, puis payer pour la mise à niveau.

Pour ajouter un niveau d’abonnement Primumn, accédez au tableau de bord WordPress et accédez à Restrictions> Niveaux d’abonnement. Remplissez ensuite les paramètres pour créer votre abonnement Premium. Voici un exemple de quoi saisir pour un niveau d’abonnement Premium:

Nom: Premium
Description: Ceci est un abonnement premium à Coding School
Durée: 1 an
Prix: 29
Rôle utilisateur: abonné

ajouter de la prime

Limiter les leçons en fonction du niveau d’abonnement

Maintenant que nos niveaux d’abonnement gratuit et premium ont été créés. Nous pouvons choisir de restreindre les pages / publications ou même un contenu spécifique en fonction du niveau d’abonnement des utilisateurs. Le plugin rend ce processus vraiment simple. Allons tête à tête et restreignons l’accès à la première leçon que nous avons créée pour un abonnement GRATUIT. Pour ce faire, accédez à la page de la leçon intitulée «Chapitre 1: Premiers pas avec les bases». Remarquez la case « Limiter ce contenu » en haut de l’éditeur de page. Dans la zone, vous avez une zone de saisie déroulante qui vous permet de sélectionner qui doit avoir accès au contenu. Vous sélectionnerez Membres du niveau d’abonnement (abonnés). Une fois sélectionné, vous verrez que plusieurs options apparaissent. Sélectionnez la première option qui dit «Membres de tous les niveaux d’abonnement. C’est parce que nous voulons que les membres qui auront un abonnement premium aient accès à ce contenu.

ajouter un abonnement gratuit

Remarque: ce paramètre masquera la page entière aux utilisateurs non abonnés. Si vous souhaitez masquer certains éléments de contenu sur la page et les rendre disponibles uniquement aux abonnés Free ou Premium, vous pouvez utiliser des codes courts pour encapsuler le contenu que vous souhaitez masquer. Puisque nous utilisons divi builder, l’utilisation de shortcodes pour envelopper le contenu peut être difficile, mais une chose que vous pourriez envisager est d’envelopper le contenu court dans le contenu des flous à code court et de laisser les titres visibles.

Pour la prochaine leçon intitulée « Chapitre 2: Architecture de l’information », nous limiterons la page aux abonnés Premium uniquement. Pour ce faire, accédez à la page pour modifier la page et dans la zone « Réduire ce contenu » en haut de l’éditeur de page, sélectionnez Membres du niveau d’abonnement (abonnés). Sélectionnez ensuite l’option « Membres de niveaux d’abonnement spécifiques. Sélectionnez ensuite « Premium ». Désormais, seules les personnes abonnées Premium pourront accéder à cette page.

Enregistrez vos modifications en actualisant la page.

ajouter un abonnement premium

Modifier votre page de redirection de contenu restreint

Lorsqu’un utilisateur essaie d’accéder à du contenu restreint, vous pouvez le rediriger vers une page spécifique. Puisque nous voulons que l’utilisateur s’inscrive pour accéder au cours, il est logique de le rediriger vers la page d’inscription. Pour ce faire, accédez au tableau de bord WordPress et accédez à Restrictions> Paramètres et cliquez sur l’onglet Divers. Recherchez l’option de page Transférer et sélectionnez la page d’inscription dans la zone de saisie déroulante.

ajouter une redirection

Enregistrer les options

Désormais, chaque fois qu’un utilisateur non abonné essaie d’accéder à des pages restreintes, il sera automatiquement redirigé vers la page d’inscription.

Vous pouvez rapidement tester cela. Enregistrez la page et ouvrez-la dans un navigateur en mode navigation privée pour voir ce qu’un utilisateur voit lorsqu’il ne s’est pas encore inscrit.

Remarque: Si vous le souhaitez, vous pouvez créer une page d’inscription supplémentaire pour ce cas d’utilisation, afin de pouvoir inclure un appel à l’action plus spécifique, tel que « Désolé, vous n’avez actuellement pas accès à ce contenu, veuillez vous inscrire ci-dessous « . avec le formulaire d’inscription en dessous.

Ajouter une passerelle de paiement

À ce stade, vous voudrez vous assurer que votre passerelle de paiement est intégrée à Restrict Content Pro. Vous pouvez le faire en parcourant Restreindre> Paramètres et en cliquant sur le bouton Onglet Paiements. Là, vous pouvez choisir la passerelle que vous souhaitez activer, ainsi que saisir les informations nécessaires pour intégrer la passerelle. Vous avez le choix entre neuf options, dont Stripe et Paypal.

paiement

Je n’entrerai pas dans les détails impliqués dans leur configuration, mais mon conseil est de vous assurer et de tester facilement vos passerelles de paiement pour vous assurer qu’elles fonctionnent. Vous ne voulez pas perdre d’argent.

Personnalisez les notifications par e-mail

Restreindre Content Pro vous permet de personnaliser un e-mail de notification pour le nouveau membre et l’administrateur chaque fois qu’un nouveau membre s’inscrit. Profitez de cette option en incluant un bon appel à l’action dans le corps de l’e-mail qui encourage l’utilisateur à commencer le cours avec un lien vers la première leçon. Vous pouvez trouver le paramètre de messagerie en accédant Restreindre> Paramètres et cliquez sur le bouton Les e-mails onglet.

e-mails

Intégration de marketing par e-mail en option

Vous pouvez avoir un compte Mailchimp ou Aweber auquel vous souhaitez ajouter des membres lors de leur inscription. Vous pouvez le faire avec l’un des nombreux modules complémentaires disponibles avec le plugin Restrict Content Pro. Accédez simplement à Restreindre> Modules complémentaires et trouvez la plateforme de messagerie souhaitée.

ajouter vous-même

Et maintenant?

Une fois que vous avez configuré votre site de cours en ligne, vous devrez terminer la configuration de tout votre contenu pour chaque page en ajoutant l’URL aux boutons, ainsi que de nombreuses autres modifications. Mais les bases ont été jetées. Nous espérons que cela vous mettra en place avec une plate-forme sur laquelle vous pourrez facilement construire.

Réflexions finales

On pourrait dire qu’avec tous les excellents outils du monde WordPress, vous pouvez obtenir un cours en ligne et cela fonctionne assez facilement. Mais il y a aussi le défi du design. Faire en sorte que ces sites soient décents n’est pas facile si le design n’est pas votre point fort. Heureusement, les mises en page Divi prédéfinies, telles que le « Learning Management Layout Pack », offrent une excellente solution au problème de conception. Le look est fonctionnel et beau dès la sortie de la boîte.

Mais il y a aussi le problème de trouver les bons plugins pour transformer votre beau look en un cours en ligne fonctionnel. Il existe de nombreux excellents plugins d’adhésion et systèmes de gestion de l’apprentissage, avec des degrés de coût et de complexité variables. Le but de cet article était de vous fournir un excellent site pour rechercher des cours électroniques, avec une simple adhésion à faible coût. Pour ceux qui espèrent créer ceci en utilisant des plugins gratuits, je suis désolé de décevoir. Je ne suis que des plugins gratuits, mais j’ai pensé qu’il valait mieux utiliser les versions Pro pour ce tutoriel, car le résultat final vaut chaque centime à mon avis.

J’ai hâte de vous entendre dans les commentaires

Bonne chance!


Pourquoi choisir un apparat pour lancer son société sur la toile ?
C’est assez aisée de répondre à cette question !
VOUS FACILITER LA VIE ! FAIRE PASSER VOTRE BUSINESS AU NIVEAU SUPÉRIEUR !


0 commentaire

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *