Source: Alexa_Fotos; Pixabay https://goo.gl/jyiz8N |
What is Edwiser Bridge?
Edwiser Bridge is a plugin by Edwiser that integrates Moodle Learning Management System with WordPress. It allows you to import and sell Moodle courses using WordPress. Software requirements of the lugin: WordPress 4.0 or higher. Compatible up to WordPress 4.5.3.
Today's post is the first in a series of five posts where I will illustrate how I used the Edwiser Bridge plugins and its extensions to create an E-Commerce WordPress website to sell Moodle courses.
Most of the information provided by me on the Edwiser Bridge installation can be obtained from Edwiser's website, specifically the company's Documentation Page. What is different in my blog are detailed screenshots of the installation and test process, and some explanation in my own words.
Learning Outcome
At the end of this post, you will know how to import and synchronise your Moodle courses with WordPress by using the free Edwiser Bridge plugin.
Disclaimer: Edwiser.org is not responsible for any mishaps or accidents to your website arising out of these blog postings of mine. You attempt these steps and instructions of mine at your own risk.
Section I. Overview
I would like to start by giving you an overview of the Edwiser Bridge plugin. It allows WordPress to integrate with Moodle, a popular learning management system. With this setup, you can achieve a basic platform for selling your Moodle courses online. Edwiser Bridge also comes with four commercial extensions. The extensions add important functionality to your basic E-commerce system.
For example, the "Single-Sign On" and "Bulk purchase with multiple enrollments" extensions make it very convenient for the user; The "WooCommerce Integration" extension allows you to use WooCommerce's powerful E-commerce features; and the "Selective Course Synchronisation" extension saves the Moodle admin time and white hair, when importing Moodle courses into WordPress, from a Moodle site that has a large number of courses.
Image 1. The Edwiser Bridge universe. Diagram by Frankie Kam |
This post is the first part in a rather ambitious 5-part series of posts. Each post focussing on a specific plugin in turn:
Week 1: Edwiser Bridge - import Moodle courses and enrolled user data into WordPress;
Week 2: Single Sign On For Edwiser Bridge - log into both Moodle and WordPress via a single login;
Week 3: WooCommerce Integration Extension - sell Moodle courses on the WooCommerce platform;
Week 4: Selective Synchronization - select one or more Moodle courses to be synchonized with WordPress;
Week 5: Bulk Purchase - multi-course purchase and multi-student enrollment for operational convenience.
What you will need to finish this tutorial:
- the Edwiser Bridge plugin
- a working WordPress site (e.g., WordPress 4.5.3)
- a working Moodle site (e.g., Moodle 3.1)
- a PayPal account (for testing and as the payment gateway)
I am assuming that you already have a WordPress site and Moodle site installed. If you do NOT have either of these sites ready, I would recommend that you read this other blog post of mine. It is a Dummies' Guide with individual screenshots of the entire procedure for BOTH Moodle and WordPress. It contains an insane number of screenshot images so please be patient if the webpage there loads slowly on your web browser!
Image 2. he Installation process starts in your WordPress site (Steps 1 to 3) |
Section II. Install Edwiser Bridge in WordPress
Step 1. Download the Edwiser Bridge plugin from here or by using WordPress' built-in "Add Plugin" option:
Image 3. The Edwiser Bridge is a free plugin available on WordPress. |
Step 2. Install the plugin in your WordPress site and activate the plugin.
Step 3. You will now see the 'Edwiser Bridge' menu option.
Image 4. How you know you have installed Edwiser Bridge. |
If you see the menu option, then congratulations so far! Next you will need to login as admin in your Moodle site.
Image 5. Steps 4 to 21 are done in your Moodle site. |
Section III. Create an external service in Moodle
What is a web service?
W3C defines a web service as "a software system designed to support interoperable machine-to-machine interaction over a network." [1]
Image 6. Illustration of a web service. Source: Wikipedia. |
A web service is a "function that can be accessed by other programs over the web (Http) ... A web service is not targeted at humans but rather at other programs." [2]
So we need to get Moodle and WordPress to communicate. This will allow WordPress to automatically create a user Moodle account and to enrol the user in a Moodle course, all from outside Moodle. Enter web services.
Step 4. Login to your Moodle site.
Step 5. Access the External Services via Site Administration | Plugins | Web Services | External Services.
Image 7. |
Step 7. Give a name to your External service. "MyExternalService" is my choice.
Step 8. Tick the "Enabled" checkbox.
Image 8. |
Image 9. Screen shows an external service named "MyExternalService" setup by the author. |
Step 10. Click the "Functions" link.
Image 10. The Add Functions button. |
Step 11. Search for a function. Click inside the text box. Type a partial name and click a row to highlight a function.
Image 11. The "Add functions" interface. |
You can also select multiple rows by holding down the Control key and clicking with your mouse. Click the "Add Functions" button to add the function.
What you should end up with, is an external service that has these functions attached to it:
- core_user_create_users
- core_user_get_users_by_field
- core_user_update_users
- core_course_get_courses
- core_course_get_categories
- enrol_manual_enrol_users
- enrol_manual_unenrol_users
- core_enrol_get_users_courses
Image 12. Your external service has these functions added to it. |
Section IV. Enable the REST protocol
What is this REST protocol thingy? I mean we all need a break now and then, but this protocol has nothing to do with taking a break. There are two major classes of Web services: REST-compliant Web services and Arbitrary Web services. REST is a Web API which uses simpler REpresentational State Transfer based communications. REST does not require XML-based Web service protocols (SOAP and WSDL) to support its interfaces. [3]
A Web API is a development in Web services where emphasis has been moving to simpler representational state transfer (REST) based communications.[4] RESTful APIs do not require XML-based Web service protocols (SOAP and WSDL) to support their interfaces.
Step 12. Go to Site Administration|Plugins|Web Services|Manage Protocols
Step 13. Click the 'blind eye' so that it shows an 'open eye'.
Step 14. Click the "Save changes"button.
Image 13. Managing Protocols. |
Section V. Generate a Moodle web service token
What on earth is a web service token? Let's start with "token". A token is a piece of data which only Server X could possibly have created, and which contains enough data to identify a particular user. You might present your login information and ask Server X for a token; and then you might present your token and ask Server X to perform some user-specific action. [5]
So my Moodle site creates a secret code which is unique in this entire universe. If a WordPress site knows and stores this secret code, then it can present that code to my Moodle site. My Moodle site will say, "Yeah, that's the right code. Walk through my doors, look through my stuff and take what you need".
With this web service token that my Moodle site creates, my WordPress site has the permission to, and will send over a WordPress user's username and password to Moodle. My Moodle site then creates a Moodle user account with the exact same username and exact same password. Not only that, WordPress will trigger Moodle to enrol that user into a Moodle course. Sweet!
Step 15. Go to Site Administration|Plugins|Web Services|Manage Tokens
Step 16. Click the "Add link.
Image 14. |
Step 17. Select the Admin User from the User list.
Step 18. Select the Service "MyExternalService".
Step 19. Click the "Save changes" button to generate the Moodle Web Service token.
Image 15. Creating a web service token in Moodle. |
You will see your token appear. For example:
Image 16. Add caption |
Section VI. Enable Web Services in Moodle
Step 20. Go to Site Administration|Advance features and tick the "Enable Web Services" checkbox.
Image 17. Enabling web services. |
Section VII. Disable the Password Policy
This step is necessary because the user will register an account on WordPress. The same account name and password will be created in Moodle. Hence it is necessary to remove the password policy so that Moodle will not face any problems duplicating the user's WordPress password.
Step 21. Go to Site Administration|Security|Site Policies and UNtick the "Password Policy" checkbox.
Image 18. Disabling the Moodle site's password policy. |
This concludes the Moodle side configurations for the WordPress-Moodle integration to work. The same Moodle site that I have created contains one course named MyNewCourse.
Image 19. Clicking on a Moodle course. |
It is this course that will be imported into and synchronised with my WordPress site. Now you need to log out from Moodle, and log into your WordPress site.
Image 20. Back at the WordPress ranch.... Steps 22 to 44 are in WordPress. |
Section VIII. Configure the General settings
Step 22. Go to Edwiser Bridge | Settings | General tab.
Image 21. |
Step 24. From the User Account Page's drop-down list, select "User Account".
Step 25. Choose "en" for the Moodle Language Code if you want the site to be in English.
Section IX. Add the Moodle access token
With that done, next you will add the Moodle token that was generated at Step 19. This token is common to both your Moodle and WordPress sites, and it allows both sites to communicate to each other.
Step 26. Go to Edwiser Bridge | Settings | Connections Settings tab.
Image 22. |
Step 27. Enter the Moodle URL inside the "Moodle URL" text box. Be sure to have the "http://" or "https://" prefix.
Step 28. Copy and paste the token value of Step 19, in the "Moodle Access Token" text box.
Step 29. Test the connection by clicking the "Test Connection" button. If it connects, you should see a "Connection successful. Please save your connection details." message appear.
Step 30. Click the "Save changes" button.
Image 23. |
Section X. Configure your payment gateway - PayPal
In order to collect online payments, you will need to configure your payment gateway settings. In this post I will use PayPal. For local Malaysian and Asian online banking, I would recommend iPay88 and its Wordpress plugin. Your choice may differ depending on your location and target market. That's material for another blog post for another day.
Here's my PayPal settings. Please use your own.
Image 24. |
Time for a checkpoint to pause and to catch your breath! At this point of the setup, you have completed the Edwiser Bridge plugin setup. What remains is to synchronise your Moodle courses with Wordpress.
Section XI. Synchronize WordPress with Moodle
Step 31. Go to Edwiser Bridge | Settings | Synchronisation tab.
Image 25. |
Step 32. Leaving the check boxes unticked, click the "Start Synchronization" button.
The MyNewCourse course, that was introduced at Step 21, will be synchronised can be accessed via Edwiser Bridge | Courses.
Image 26. |
To test this imported course, log out of your Moodle site.
Section XII. Link a WordPress user to the Moodle site
In order to enrol the WordPress user to the imported Moodle course, which would indirectly link the WordPress user to the actual Moodle course, you need to first tell WordPress to link the user to Moodle.
Step 33. Go to User | All Users
Image 26. |
In the screen example above, I have already manually added a new WordPress user named John Doe.
At this point in time, let us pause and look at the sample Moodle site shown below. Please note that it contains only one user - the admin.
Image 27. |
With that settled, let's return to WordPress (Image 26) and continue.
Step 34. Tick the checkbox next to johndoe's avatar image.
Step 35. From the Bulk Actions dropdown list, select "Link Moodle Account".
Step 36. Click the Apply button to save the settings!
Image 28. |
What is the effect of this (Step 36)? Well, if you take a peek at the Moodle site, it now contains a new user - JohnDoe with username: johndoe !
Image 29. |
Here's proof that a new Moodle user account, with the exact same username as the WordPress account (johndoe) has been created.
Image 30. |
Step 37. Now, let's come back to WordPress and let's see the further effects of steps 33 to 36.
Click on the username johndoe like so....
Image 31. |
Image 32. |
You will see the "Enroll a Course / Unenroll a Course" section. If you do not execute steps 32 to 35 (Link a WordPress user to the Moodle site), this "Enroll a Course / Unenroll a Course" section would not exist!
Step 38. Click the"Enroll a Course" drop-down list and select the course listed which is MyNewCourse.
Image 33. |
If you were to check the Moodle site, you would see that johndoe has automatically been enrolled in the course MyNewCourse. Sweet! See the screenshot below.
Image 34. |
Back to WordPress.
Step 40. To unenroll the student from within WordPress, click the complimentary "Unenroll a Course" drop-down list and select the course listed which is MyNewCourse.
Then click the "Update User" button. Like so.
Image 35. |
The effect of this that johndoe is IMMEDIATELY UNENROLLED from the MyNewCourse (Moodle) course! If you were to refresh the Moodle's Enrolled users page, you would see that there are NO enrolled users.
Image 36. |
So this is the almost magical effect of controlling the enrollment and unenrollment of a user, right from within WordPress itself!
Section XIII. Synchronise and create categories in WordPress
You can use Edwiser Bridge's to import Moodle course categories and place the imported courses under those categories.
Let's rewind to Step 32. We went to Edwiser Bridge | Synchronization tab and clicked the "Start Synchronization" button.
Image 37. |
If I were to go to Edwiser Bridge | Course Categories , I would see the course category named "Miscellaneous" which was imported from Moodle.
Image 38. |
The Category will be available in the category widget on a single course page.
Section XV. Assign a price to a course
Step 41. To assign a price to a course, go to Go to Edwiser Bridge | Courses. Single-click a course to open it.
Image 39. |
Step 42. In the Course Options section, enter the Course Price Type (Free, Paid or Closed), the price of the course if you selected 'Paid' type, and a short description (optional).
Image 40. |
Step 43. Finally, click the button to save your Course Options.
Image 41. |
Section XVI. View a purchase order
Step 44. To see all purchase of courses, go to Edwiser Bridge | Orders.
Image 42. |
Section XIV. Recap and User Interaction with the setup so far
So at this point, allow me to recap what we have achieved.
- Moodle and WordPress can now talk to each other. Great!
- We can import a Moodle site's courses into a WordPress site.
- We can select a WordPress user and automatically create a Moodle account for the user/
- We can automatically enroll that WordPress user into a specific Moodle course
Well, assuming that I had earlier set the featured image for the course...
Image 43. |
...and that I had copied the URL of the new course, http://www.tornado2.com/ecomm/courses/mynewcourse/ and that we are NOW logged out of WordPress....
Image 44. |
Image 45. |
If the user clicks the "TAKE THIS COURSE" link, the login screen will appear. The user, being new, will naturally click the "Don't have an account" link.
Image 46. |
In the example below, I have entered the E-mail as Email address. Wordpress will take the "kamboonseng" portion of the E-mail address as the username. What about the WordPress password? The WordPress site would have sent an E-mail containing the login details to the user. Thus, the user can only know the password by checking his E-mail for the message.
Image 47. |
At the screen refresh, the user is presented with same screen, but this time, notice that the user is logged in with the E-mail address given earlier. You can see the user's name at the right-hand corner of the screen.
The user clicks the "TAKE THIS COURSE" button.
Image 48. |
As the course is currently free (no price has been attached to it), the button changes immediately to "ACCESS COURSE". If the user then clicks on the button, he/she will be brought to the Moodle login screen.
Image 49. |
What is the Moodle username and password?
Image 50. |
To find out the Moodle login's username and password, the user has to check his or her inbox for an E-mail message from wordpress@tornado2.com.
Image 51. |
With this knowledge in hand, the user then logs into Moodle by entering the Username and Password.
Image 52. |
The user is brought directly to the Moodle course that he 'bought' for free.
Image 53. |
Buying Edwiser Bridge Extensions
So there you have it! Edwiser Bridge by Edwiser.org does the job very well. And that's just the free plugin which I highly recommend you try out and use on your WordPress website.
You can increase the functionality of your WordPress site if you buy and install Edwiser Bridge's other four sibling extensions.
For cost-effectiveness and savings, you can purchase the Edwiser bundle, where you get Edwiser Bridge extensions (WooCommerce Integration, Single Sign On, and Selective Synchronization) at a discounted bundled price.
This is the end of part I.
APPENDIX
References
[1] https://www.w3.org/TR/2004/NOTE-ws-gloss-20040211/#webservice
[2] http://stackoverflow.com/questions/226108/what-is-a-web-service-in-plain-english
[3] http://ieeexplore.ieee.org/xpl/articleDetails.jsp?arnumber=4620089
Operation and design-wise improvements to the website (at the end of Step 44)
#1. The Edwiser course links are not directly accessible from the WordPress' frontend;
#2. The WordPress site is still very vanilla and standard out-of-the-box look and feel;
#3. The Edwiser Bridge colors and format may not match your site's theme;
#4. The user has to manually enter his or her Moodle login credentials in order to access the Moodle course. The user has to first check his or her E-mail inbox for the login details from the site's WordPress;
#5. After Moodle end (when the user logs out from the course), the flow does not return to the Website course.
Addressing the deficiencies
Deficiencies #1 and #2 can be tackled by installing a WordPress theme and by spending time to adjusting the WordPress settings.
Deficiency #3 can solved by reading Edwiser.org's documentation on how to make Edwiser Bridge compatible with your theme;
Deficiency #4 can be solved head-on by an Edwiser Bridge's "Single-Sign On" commerical extension.
Deficiency #5 can be solved by installing and using the Moodle "Login/Logout user redirection" addon.
Further Help and Services by Edwiser
You can go here if you require Edwiser's expertise in theme customisation and installation or setup. In addition, Edwiser, bring open source developers also cater to requests for custom features of their bridge plugin.
No comments:
Post a Comment