“Neema Business Coach” Documentation by “Kroxie UI Kits” v1.0

Neema Brand Coach

Created: August 1, 2020

Last Updated: August 10, 2020

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

A) Website Branding, Elementor Settings, and Menu Settings – top

This template kit requires use of both the Elementor and Elementor Pro WordPress plugins, along with the Hello Theme by Elementor. The template kit does need some base settings in order to display the colors and fonts correctly.

Add Logo

First, upload your logo if you havent already:

  1. Login to your WordPress site and navigate to “Appearance > Customize”.
  2. Click on the “Site Identity” tab.
  3. Upload the logo, and add in any other information.
  4. Once that is complete, click “Publish”.

Set Up Menus

Next, You’ll have to set up two menus for this theme, a primary menu and a footer menu. Here are the steps to create a menu:

  1. Navigate to “Appearance > Menus” in the dashboard menu.
  2. If you don’t already have a menu created, click on “Create a new menu”.
  3. Name the menu and click the “Create Menu” button.
  4. Add / Arrange your links to the menu and save the menu.
  5. For the main navigation check the box next to “Display location: Primary” and save.
  6. Repeat steps 1-4 for the footer menu.

Change Font and Color Settings

Then, change the settings for Elementor Plugin to ensure it inherits the fonts and colors from the template:

  1. Navigate to “Elementor > Settings”.
  2. Check the “Disable Default Colors” and “Disable Default Fonts” boxes.
  3. Click save.

Change Font Awesome Settings

Lastly, change the settings for Elementor Plugin to ensure it loads all the Fontawesome icons:

  1. While still on the Elementor settings page, click on the “Advanced” tab.
  2. Find the “Load Font Awesome 4 Support” and select “Yes”.
  3. Click save.

B) Import Kit and Add Theme Styles – top

Import the template kit to get started with styling your website. The fonts and colors for the template kit are controlled through the Elementor Theme Builder. The theme builder can be accessed when the you are using the Elementor page editor. The “Style Guide” page template lists out all of the details for the elements used in this theme. Below are the instructions to set this up.

Initial Page View

Expanded Styles Menu

Import the Template Kit:
  1. Navigate to “Templates > Import”.
  2. Click browser, find your zipped folder, and import.
  3. The page templates will be loaded into your site.

 

Create a new page to add your template:
  1. Navigate to “Pages > Add New” in the dashboard menu and name your page “Style Guide”.
  2. Under Page Attributes on the righthand side and select “Elementor Full Width”.
  3. Click on “Edit with Elementor”.
  4. When the editor loads, click on the template folder icon.
  5. When the screen loads, select the “My Templates” tab and insert the “Style Guide” page template.
  6. To save you can either Publish the page or Save it as a draft.

 

Add in the theme styles:
  1. While still on your style guide page, click on the menu icon on the lefthand side of the editor.
  2. Click on “Theme Style” in the menu.
  3. A new blue menu will appear. When that loads click on the “Typography” dropdown.
  4. Go through and add in all of the font styles.
  5. Repeat the process for the “Buttons” and “Forms” tabs.
  6. Click on “Update” to save the theme styles.
  7. You can close out this menu and update the page.

 

You do not need to keep the style guide page after this.

C) Header and Footer – top

First, set up the header and footer and apply them sitewide. The header and footer for the template can be accessed in the Elementor Theme builder.

Then, exit to the the dashboard and make your way to the footer template to make changes there.

Header

Update the navigation in header:
  1. Navigate to “Templates > Theme Builder” in the dashboard menu.
  2. Click on the “Header” tab.
  3. Hover over the “Header” template and click on “Edit with Elementor”.
  4. When the editor loads, click on the menu in the visual editor on the righthand side.
  5. On the left hand side, in the details panel, assign the primary menu from the dropdown.
  6. Click on the “Update” button to save.
  7. Add the condition “Add to the enire site” and save again.
 
Update the button in the header:
  1. When the editor loads, click on the button in the visual editor on the righthand side.
  2. On the left hand side, in the details panel, you can update the button text and link.
  3. Click on the “Update” button to save.

Footer

Update the navigation in footer:
  1. Navigate to “Templates > Theme Builder” in the dashboard menu.
  2. Click on the “Footer” tab.
  3. Hover over the “Footer” template and click on “Edit with Elementor”.
  4. When the editor loads, click on the menu in the visual editor on the righthand side.
  5. On the left hand side, in the details panel, assign the primary menu from the dropdown.
  6. Click on the “Update” button to save.
  7. Add the condition “Add to the enire site” and save again.

 

Update the text in the footer:
  1. When the editor loads, click on the textbox in the visual editor on the righthand side.
  2. On the left hand side, in the details panel, update the information to what you’d like to say.
  3. Click on the “Update” button to save.

 

Update the social media links in the footer:
  1. When the editor loads, click on the social media icons in the visual editor on the righthand side.
  2. On the left hand side, in the details panel, click on a social media profile.
  3. Update your links for each profile.
  4. Click on the “Update” button to save.

 

Update the gallery in the footer:
  1. When the editor loads, click on the gallery in the visual editor on the righthand side.
  2. On the left hand side, in the details panel, upload the images you’d like to display.
  3. Click on the “Update” button to save.

D) Page Templates – top

This template kits has 10 page templates. You can access the page templates from the dashboard “Templates > Saved Templates”. Many of the page templates use the same sections and those sections can be copied and added to new pages. Below is the lists of the page templates and how to edit each section on the page.

Add the template to your pages:
  1. Navigate to “Pages > Add New” in the dashboard menu and name your page.
  2. Under Page Attributes on the the righthand side and select “Elementor Full Width”*.
  3. Click on “Edit with Elementor”.
  4. When the editor loads, click on the template folder icon.
  5. When the screen loads, select the “My Templates” tab and insert your desired page template.
  6. To save you can either Publish the page or Save it as a draft.

 

* A thing to note on page settings: Make sure all pages are set to “Elementor Full Width” except the Coming Soon Template. That page should be set “Elementor Canvas”.

 

Below is the lists of the page templates and how to edit each section on the page.

E) Reusable Sections – top

Below is the lists of the page templates and how to edit each section on the page.

 

E.1) Hero – page templates / reusable sections / top

Option A
Home, Blog, Contact, 404, Coming Soon
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 300px x 375px (front image) or 350px x 350px (back image).
  4. To edit the text, click on the textbox in the visual editor on the righthand side.
  5. Update the text on the lefthand side, in the details panel.
  6. To edit the button, click on the button in the visual editor on the righthand side.
  7. Update the button text and link on the lefthand side, in the details panel.
  8. Click on the “Update” button to save.
Option B
About, Courses
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 475px x 475px (left image) or 605px x 450px (right image).
  4. The text is a dynamic field, pulling in the page title.
  5. Click on the “Update” button to save.
Option C
Business Coaching, Podcast
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 375px x 450px (every image).
  4. The text is a dynamic field, pulling in the page title.
  5. Click on the “Update” button to save.

E.2) Call to Action – page templates / reusable sections / top

Option A
Home, About, Business Coaching, Podcast, Contact
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 675px x 610px.
  4. To edit the text, click on the textbox in the visual editor on the righthand side.
  5. Update the text on the lefthand side, in the details panel.
  6. To edit the button, click on the button in the visual editor on the righthand side.
  7. Update the button text and link on the lefthand side, in the details panel.
  8. To edit the background, click on the section container in the visual editor on the righthand side.
  9. In the details panel on the lefthand side, click the style tab.
  10. Click on the background dropdown and select a new image (1440px × 800px).
  11. Click on the background overlay dropdown and select a new color.
  12. Click on the “Update” button to save.
Option B
Home, Business Coaching, Courses, Blog
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 440x x 565px (front image) or 305px x 380px (behind image).
  4. To edit the text, click on the textbox in the visual editor on the righthand side.
  5. Update the text on the lefthand side, in the details panel.
  6. To edit the button, click on the button in the visual editor on the righthand side.
  7. Update the button text and link on the lefthand side, in the details panel.
  8. Click on the “Update” button to save.
Option C
Business Coaching, Podcast
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. Click on the textbox in the visual editor on the righthand side.
  3. Update the text on the lefthand side, in the details panel.
  4. Repeat for all text fields.
  5. To edit the button, click on the button in the visual editor on the righthand side.
  6. Update the button text and link on the lefthand side, in the details panel.
  7. Click on the “Update” button to save.

E.3) Text Area – page templates / reusable sections / top

Option A
Home, Business Coaching, Podcast
  1. When the editor loads, click on the textbox in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, type in the text you want.
  3. Repeat these steps for all of the textboxes.
  4. Click on the “Update” button to save.
Option B
About, Courses
  1. When the editor loads, click on the textbox in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, type in the text you want.
  3. Repeat these steps for all of the textboxes.
  4. To edit the background, click on the section container in the visual editor on the righthand side.
  5. In the details panel on the lefthand side, click the style tab.
  6. Click on the background dropdown and select a new image (1440px × 800px).
  7. Click on the background overlay dropdown and select a new color.
  8. Click on the “Update” button to save.

E.4) Courses – page templates / reusable sections / top

Option A
Home
  1. When the editor loads, click on the heading box in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. To edit the call to action images, click on the image in the visual editor on the righthand side.
  4. On the lefthand side, in the details panel, click on the photo to swap it out.
  5. Update your photo with an image that is 270px x 425px (left and right side) or 375px x 425px (center image).
  6. To edit the text and links for these calls to action, update the info under the image, in the details panel.
  7. To edit the button, click on the button in the visual editor on the righthand side.
  8. Update the button text and link on the lefthand side, in the details panel. Please note this has to be edited twice with the same information for both buttons.*
  9. To edit the background, click on the section container in the visual editor on the righthand side.
  10. In the details panel on the lefthand side, click the style tab.
  11. Click on the background dropdown and select a new image (1440px × 1000px).
  12. Click on the background overlay dropdown and select a new color.
  13. Click on the “Update” button to save.
Option B
About
  1. When the editor loads, click on the heading box in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. To edit the call to action images, click on the image in the visual editor on the righthand side.
  4. On the lefthand side, in the details panel, click on the photo to swap it out.
  5. Update your photo with an image that is 270px x 425px (left and right side) or 375px x 425px (center image).
  6. To edit the text and links for these calls to action, update the info under the image, in the details panel.
  7. To edit the button, click on the button in the visual editor on the righthand side.
  8. Update the button text and link on the lefthand side, in the details panel. Please note this has to be edited twice with the same information for both buttons.*
  9. Click on the “Update” button to save.
Option C
Courses
  1. When the editor loads, click on the image in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on the photo to swap it out.
  3. Update your photo with an image that is 475x x 475px.
  4. To edit the text, click on the textbox in the visual editor on the righthand side.
  5. Update the text on the lefthand sside, in the details panel.
  6. Repeat these steps for all of the textboxes.
  7. To edit the button, click on the button in the visual editor on the righthand side.
  8. Update the button text and link on the lefthand side, in the details panel.
  9. Click on the “Update” button to save.

E.5) Testimonials – page templates / reusable sections / top

Option A
Home, Business Coaching
  1. When the editor loads, click on the heading box in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. To edit the testimonials, click on the testimonial slider in the visual editor on the righthand side.
  4. Update the text on the lefthand side, in the details panel, by clicking on each tab.
  5. Click on the “Update” button to save.
Option B
About, Courses
  1. When the editor loads, click on the heading box in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. To edit the testimonials, click on the testimonial slider in the visual editor on the righthand side.
  4. Update the text on the lefthand side, in the details panel, by clicking on each tab.
  5. To edit the background, click on the section container in the visual editor on the righthand side.
  6. In the details panel on the lefthand side, click the style tab.
  7. Click on the background dropdown and select a new image (1440px × 800px).
  8. Click on the background overlay dropdown and select a new color.
  9. Click on the “Update” button to save.

E.6) Dynamic Content – page templates / reusable sections / top

Podcast Episodes
Podcast
  1. When the editor loads, click on the text field in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. The podcasts are dynamic, pulled in from blog posts. To change the category click on the posts in the visual editor on the righthand side.
  4. On the lefthand side, in the details panel, scroll down to the query dropdown.
  5. Use the filters to define which categories should be pulled in for this page.
  6. To edit the button, click on the button in the visual editor on the righthand side.
  7. Update the button text and link on the lefthand side, in the details panel.
  8. To edit the background, click on the section container in the visual editor on the righthand side.
  9. In the details panel on the lefthand side, click the style tab.
  10. Click on the background dropdown and select a new image (1440px × 800px).
  11. Click on the background overlay dropdown and select a new color.
  12. Click on the “Update” button to save.
Blog Archive
Blog
  1. When the editor loads, click on the blog grid in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, click on each tab to change out the settings.
  3. Repeat that on the other elements you would like to update.
  4. Click on the “Update” button to save.
Blog Post
Blog Post Single

The template uses all dynamic content related to the individual post, but can be styled different on the page by clicking on each

 

  1. When the editor loads, click on the element you would like to edit in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change any setting that you would like.
  3. Repeat that on the other elements you would like to update.
  4. Click on the “Update” button to save.

E.7) Forms – page templates / reusable sections / top

Newsletter Signup
Home, Business Coaching, Courses, Blog
  1. When the editor loads, click on the heading box in the visual editor on the righthand side.
  2. On the lefthand side, in the details panel, change the headline to your desired text.
  3. To edit the form, click on the form in the visual editor on the righthand side.
  4. In the details panel, under the form fields tab, you can change the values of the field.
  5. The buttons tab is where you can update the text and icon for the button.
  6. The email tab is where you can update the settings and define where the form will be sent.
  7. Click on the “Update” button to save.
Contact Form
Contact
  1. When the editor loads, click on the form in the visual editor on the righthand side.
  2. In the details panel, under the form fields tab, you can change the values of the field.
  3. The buttons tab is where you can update the text and icon for the button.
  4. The email tab is where you can update the settings and define where the form will be sent.
  5. Click on the “Update” button to save.
Social Media Links
Contact, Coming Soon
  1. When the editor loads, click on the social media icons in the visual editor on the righthand side.
  2. On the left hand side, in the details panel, click on a social media profile.
  3. Update your links for each profile.
  4. Click on the “Update” button to save.