Documentation

Find articles, step-by-step instructions, and advice for getting the most out of ThemeXpert.com

Edumodo

Key Features

  • Fully Responsive
  • Fast Loading
  • Meaningful Trendy Layout
  • Huge Built-in Pages
  • SEO Optimized
  • Dynamic Navigation Menu
  • Smooth Collapsing Transaction
  • Quick Social Sharing
  • Multiple Social Commenting
  • Animation Slider
  • Redux Framework
  • CMB2
  • Contact Form 7
  • Instagram Feed
  • Elementor Pagebuilder
  • weForms
  • Sensie
  • WooCommerce Supported
  • Event Calendar
  • Notice Page
  • Single Teacher Page
  • Learnpress

Requirements

In order to run Edumodo smoothly on your server, you need to fulfill this requirement listed below:

  • Wordpress: 3.9+

Download

Head over to Edumodo download page on www.themeforest.net then download the EdumodoPackage.zip file. In this .zip file, you have everything you need.

Installation

Installing WordPress

To install this theme, you must have a working version of WordPress already installed on your server. If you need help installing WordPress, go through the link and follow the instructions: Installing WordPress

Installing Theme

There are a couple of simple steps to install Edumodo theme on your server. It's quite straightforward.

If you are starting from the scratch, we recommend you to follow the installation guide below to install with the pre-built existing demo data. This is the simplest way to get started.

On the other hand, if you already have an existing WordPress site and want to apply Edumodo theme, in that case, you just need to install the following package:

  • edumodo.zip

You can find this package inside the downloaded .zip file of Edumodo theme. So, before getting started with the installing process, Extract the .zip file and you'll find the desire edumodo.zip in the Theme folder after the extraction.

  • Log in to the WordPress Administration Panels.
  • Now, go to Appearance> Themes> Add New> Upload Theme then click on the Choose File button then select the edumodo.zip file and hit upload.
  • After installation being done, roll over to Appearance> Themes.
  • Find just uploaded theme on the Theme Thumbnail area.
  • Click the Activate button below to the theme's thumbnail, to set it as default.

Do not forget to Activate the theme as default after installation process successfully been done.

To know more, visit WordPress Codex

Active Required Plugins

There are four plugins, required for Edumodo theme to work properly. Those are listed below:

  1. Edumodo Core: theme core functionality (CPTs and shortcodes).
  2. Elementor Pagebuilder: Drag and Drop pagebuilder.
  3. Redux Framework: Used to build its backend admin panel.
  4. CMB2: For building meta boxes.
  5. weForms : For creating contact form.
  6. One Click Demo Import : One Click Demo data importer.
  7. LearnPress : Comprehensive LMS Plugin for WordPress (optional)
  8. The Events Calendar : For creating Events (optional)
  9. WooCommerce : For selling goods online (optional)
  10. Sensei : For adding activity, members, forms to courses (optional)
  11. Contact Form 7 : Creating Contact Form (optional)
  12. Instagram Widget : Showcasing Instagram Images (optional)

To activate those required plugins, simply go to Plugins

  • Select all those four required plugins.

You can use the search module to find the desired plugins. The search box can be found on the right-top side of the module.

  • Select Activate from the drop-down menu just above the list of plugins.
  • Click to the Apply button next to the drop-down box and you are done.

To know more about the installation process of plugins, visit here: WordPress Codex

If there is any problem with automatic plugin installation, install them manually. You can find plugin bundle in your theme's /lib/plugins subdirectory. WooCommerce and Contact Form 7 can be found in WordPress plugins repository, install them through Plugins Screen

Import Demo Data

Demo Data

  • Click on Import Demo Data button.

Demo Data

It will take some times to load all demo data on your server. Wait till it shows you a successful data importing message.

Theme Settings

You can differently customize theme according to your need using Easy Customization feature.

  • Click on Edumodo at left-bottom corner of the module screen to open up Theme Setting panel.

Global Settings

Global Settings

  • Enable Breadcrumb Header : Allows you the control over enabling or disabling breadcrumb header for your site.
  • Enable Breadcrumb : Allows you the control over enabling or disabling breadcrumb for your site.
  • Enable Preloader : Allows you to enable or disable Preloader.
  • Blog Social Share Enable/Disable : Allows you to enable or disable social sharing option.

Header Settings

Header Options

  • Text Size : Define the text size.
  • Text Transform : Define the text transform option- whether you want the text to transform into Uppercase letters or Lowercase letters.
  • Select Header : Select the header variation from the drop-down menu.
  • Header Position : Choose whether you want the header to be absolute in position or fixed position.
  • Logo : Upload your branding logo using the Upload button.
  • Background Color : Allows you to choose Background Color.
  • Menu Color : Allows you to choose menu color.

The above two options only can be found if the Button Switch option is enabled.

Custom Style

Custom Style

  • Primary Color : Set your preferred color to set as the theme primary color from the color picker. You can choose transparent instead.
  • Menu Hover & Active Color : Set your preferred color to set as the Menu hover & Active color. Alternately, you can choose transparent as well.

Background Image

Background Image

  • 404 Page Header Background Image : Select and upload image for 404 Page Header Background using the upload button.
  • 404 Image : Upload the 404 image using the upload button next to this option.
  • Search Page Header Background Image : Choose and upload image for search result background.
  • Category Page Header Background Image : Choose and upload image for category page header background.
  • Shop Page Header Background Image : Choose and upload image for shop page header background.
  • Sensei Page Header Background Image : Choose and upload image for sensei page header background.
  • LearnPress Active Page Header Background Image : Choose and upload image for learnpress active page header background.
  • Teacher Active Page Header Background Image : Choose and upload image for teacher active page header background.

Sidebar Settings

Sidebar Settings

  • List Sidebar : Choose the position of List SIdebar. Either you can disable- showing list sidebar, just to pick No Sidebar from the drop-down.
  • Detail Sidebar : Choose the position of Details SIdebar. Either you can disable- showing details sidebar, unlikely the List Sidebar, just to pick No Sidebar from the drop-down.

Custom Fonts

Custom Fonts

  • Body Typography : Choose your preferred font family, font-weight and styles, font subset, size, line height, color including define text align for body.
  • Heading Typography : Choose your preferred font family, font-weight and styles, font subset, size, line height, color including define text align for header.
  • Menu Typography : Choose your preferred font family, font-weight and styles, font subset, size, line height, color including define text align for menu.

Footer

Footer

  • Related Post Enable : Allows you to enable or disable showing related posts on the footer area.
  • Footer Columns : Define the number of columns to show the footer content.
  • Text Color : Pick a color for the footer text.
  • Background Color : Pick a color for the footer background.

Learnpress

Learnpress

  • LearnPress Single Template : Allows you select learnpress single template from the drop-down next to this option.

Copyright

Copyright

  • Copyright Text : Put your copyright text here.
  • Enable Credit : If you want to give us credit, enable this option and keep the credit text as it is.
  • Credit : Remove this credit text if you don’t want to give us a thumbs up.
  • Text Color : Choose a color for credit text.
  • Background Color : Pick a background color for this area.
  • Enable Social Icon : Allows you to enable or disable showing social icon. If its enabled- you can put their individual profile URL on the following corresponding boxes.
  • Facebook : Put your facebook profile link here.
  • Twitter : Put your twitter profile link here.
  • Instagram : Put your instagram profile link here.
  • Linkedin : Put your linkedin profile link here.
  • Email Address : Put your email address here.
  • Icon Color : Choose a color for the social icons.

Import / Export

Import / Export

  • Import : This button allows you to import your custom theme settings if you have preserved any.
  • Download Data File : This button allows you to download the theme options as a .json file for further use in any other wp-themes. You just have to import that .json file using the Import button then.

How To's

Setup Homepage

  • Go to Settings > Reading
  • Select A Static page on Front page displays option.
  • Choose your preferred home variation from the Front-page drop-down menu.
  • Select Blog from the Post page drop-down menu.(optional)

Homepage Setup

  • Use the left-bottom Save Changes button to save the settings.

Front-end appearance :

Homepage

Elements

You can simply add an element on a page. All you need to do, just drag the element you want to add and drop it in a page then customize its setting as your preferences. You will have plenty of default elements to add or you can add our developed elements those are only for Edumodo theme from the Edumodo Elements tab on the elementor.

Elements

Elementor

Elementor is the one of the best Drag and Drop visual editor for building pages, posts etc. in a WordPress site. If you are not familiar with Elementor, we recommend you to take a look at the following videos:

Under http://docs.elementor.com/ you can find see the complete documentation of elementor page builder.

IMPORTANT: You have to disable Disable Global Colors and Disable Global Fonts options from Elementor> General in order get your custom styles worked on any elements.

Our theme specific elements can be found in Edumodo tab under Elementor.

Slider

Slider

To add Slider element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Slider from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Slider

  • ADD ITEM : This button allows you to create new slider items. Having created an item, just by a single mouse click- there are a couple of options will appear below this.
  • Slider Title : Put the slider title here.
  • Title Animation : Choose an animation for the title text.
  • Upload Slider Image : This upload button lets you upload image for the current slider item.
  • Slider Description : Put the description text here.
  • Content Animation : Choose an animation effect for the content text.
  • Button Text : Put the button text here.
  • Button Link : Put the corresponding button URL here.
  • Button Animation : Choose an animation effect for the button.

Style

Slider

  • Content Options : Customize the content options according to your need. You can customize typography, spacing, margin and so on.
  • Button Options : Customize the button options as you want. This includes Button text, color, border, text size and so on.
  • Control Options : This includes slider speed, background repetition, size and so on.

Advanced

Slider

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Course

Course

To add Course element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Course from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Course

  • Item to Show : Define how manu item you want to show.
  • Column : Define in how many columns you want to show the items into.
  • Title Typography : Create your own preferred typography for title text by changing different options according to your wish.
  • Meta Typography : Create your own preferred typography for meta text by changing different options according to your wish.
  • Show Categories : Enable or disable showing categories.
  • Show Comment : Enable or disable showing comments in each item.
  • Description Typography : Create your own preferred typography for description text by changing different options according to your wish.

Style

Course

  • Title Color : Pick a color for title text.
  • Meta Color : Pick a color for meta text. (posting date, views)
  • Meta Color : Pick a color for meta description text.

Advanced

Course

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Teacher1

Teacher1

To add Teacher1 element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Teacher1 from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Teacher1

  • Item to Show : Define how manu item you want to show.
  • Column : Define in how many columns you want to show the items into.
  • Title Typography : Create your own preferred typography for title text by changing different options according to your wish.
  • Title Spacing : Allows you to control the spacing between title and meta information for each item.
  • Description Typography : Create your own preferred typography for description text by changing different options according to your wish.

Social :

  • Size : Define the social icon size.
  • Title Spacing : Allows you to control the space between title and social icons.

Style

Teacher1

  • Icon Color : Choose a color for the social icons.
  • Overlay Color : Choose overlay color.

Advanced

Teacher1

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Teacher2

Teacher2

To add Teacher2 element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Teacher2 from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Teacher2

  • Item to Show : Define how manu item you want to show.
  • Column : Define in how many columns you want to show the items into.
  • Title Typography : Create your own preferred typography for title text by changing different options according to your wish.
  • Title Spacing : Allows you to control the spacing between title and meta information for each item.
  • Designation Typography : Create your own preferred typography for description text by changing different options according to your wish.

Social :

  • Size : Define the social icon size.
  • Width : Define the social icon width.
  • Height : Define the social icon height.
  • Title Spacing : Allows you to control the space between title and social icons.

Style

Teacher2

  • Icon Color : Choose a color for the icons.
  • Background Color : Choose a background color.

Advanced

Teacher2

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Notice

Notice

To add Notice element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Notice from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Notice

  • Item to Show : Define how manu item you want to show.
  • Column : Define in how many columns you want to show the items into.
  • Title Typography : Create your own preferred typography for title text by changing different options according to your wish.
  • Meta Typography : Create your own preferred typography for meta text by changing different options according to your wish.
  • Show Categories : Enable or disable showing categories.
  • Show Comment : Enable or disable showing comments in each item.
  • Description Typography : Create your own preferred typography for description text by changing different options according to your wish.

Style

Notice

  • Title Color : Pick a color for title text.
  • Meta Color : Pick a color for meta text. (posting date, views)
  • Meta Color : Pick a color for meta description text.

Advanced

Notice

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Event

Event

To add Event element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Event from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Event

  • Query Type : Allows to pick either Latest Events in ascending order or Specific Events.
  • Item To Show : Number of items to show.
  • Title Word : Define the maximum number of word a title can contain.
  • Show Thumbnail : Hide or Show thumbnail.
  • Excerpt Word : Define the number of excerpt words.

Style

Event

  • Title Color : Choose a color for the title text.
  • Content Color : Choose a color for the content text.

Advanced

Event

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.

Woo Latest Product

Woo Latest Product

To add Woo Latest Product element on a page, first-

  • Go to Pages
  • Click on Edit With Elementor
  • Drag the Woo Latest Product from the left EDUMODO ELEMENTS area and drop on your page.
  • Customize the settings how you prefer and click on Save button to save the pages.

Content

Woo Latest Product

  • Item To Show : Number of items to show.
  • Title Word : Define the maximum number of word a title can contain.

Style

Woo Latest Product

  • Title Color : Choose a color for the title text.
  • Author Color : Choose a color for the Author name.

Advanced

Woo Latest Product

  • Element Style : Control margin, padding, z-index, entrance animation and add additional id or class to apply your custom design to an element.
  • Background : Control element background color, hover style and more.
  • Border : Apply your custom border style configuring different options from this tab.
  • Responsive : Control making this element to appear on various devices.