This article will walk you through how to get started with a nine10 website. Instructions for basic editing, understanding modules, adding/removing documents, are all included in this walkthrough. This should give you a basic understanding how your site works and to be able to build off of.

Note: This guide only applies to modern Nine10 & Image Design Websites that use the Elementor editor. 

Getting Started

Login

• Log in to the back end of your website by going to the admin URL: www.yourwebsite.com/admin
• Enter the login credentials provided by nine10 during training.
• If you don’t remember your login credentials please email support@nine10.ca or click “Lost your password?”. We will send you your account details and a link to reset the password
• Once logged in you will be brought to the WordPress dashboard.

Dashboard

The Dashboard is your entry point into the administration area of your site. This panel includes a menu system on the left allowing you access to every part of your website.

On the left side of the screen there are a few links: Dashboard, Site Settings, Pages, Media, Forms and Profile. When you hover your mouse curser over them, some will show a sideways pointing arrow that reveals a submenu. Click any of the submenu links to go directly to that page. Clicking the menu title will take you to the first submenu option. You can use the Collapse menu button to hide the menu text and show just the icons for a larger working area.

The Dashboard itself contains Statistics, Website Support Form (your request will be emailed to our support team), and a link to our Digital Marketing Bootcamp. The Analytics / Statistic Dashboard will show you recent visitor activity on your website.

Pages

After clicking “Pages” in the Admin panel. This page shows you a list of all of your created pages and allows you to see your sub-pages by clicking the drop-down arrow, expanding the parent menu item.

• From this panel, you can also edit or delete any of your existing PAGES.
• To add a Page, simply click the “Add New” Button just above the page listings and set your Page Title.
• To Edit a Page, simply click on “Edit with Elementor” next to the title. This will open your existing page and present you with the Drag and Drop editor System.
• To Delete a Page, hover over it and click the Trash button.
• Hovering over your page title will reveal links to Quick Edit (make simple changes quickly), View (view the public view of the page) and a Trash button (deletes the page)

Understanding Modules

Modules are custom elements created to make editing your website easy. A Module can be in the form of a Job posting under the Careers Item. It can also be a Testimonial or Team member. If you have any of these modules on your site, they will appear in the WordPress Left Side Menu or Admin Panel. By adding content to your module, you will prompted with Questions pertaining to that Module. For Example; a Testimonials Module will have the following Fields:

Testimonials

Watch Video Tutorial

(depending on your company these might reflect differently)

• Add title
• Basic word editor for Descriptions
• Testimonial Author
• Location / Job title / Company
• Testimonial Category

By filling out these fields, it will allow for quicker implementation. Modules will allow you to fill out these fields and by publishing the post, it will automatically insert this info into the correct spot on your website, already styled!

Testimonials Specifically (And possibly other modules) can be submitted by your clients via online form. After a client has submitted a testimonial on your website they will appear in “Testimonials” in the Admin panel. Next to new submissions the word “pending” will appear next to it. They will need to be reviewed and Published manually by the website Admin/editor before displaying on the site.

Standard Modules Available

• PDF Display / Download
• Team Members
• Testimonial & Online Reviews
• Equipment Listing
• Career Listings
• Logo Grid
• Events Calendar
• Service Area Map
• Blog / News
• Projects / Case Studies
• Knowledge Base
• Other Third party and Custom Modules can be created upon request

User profile

By clicking “Profile” in the admin panel you will be presented with your account associated with your website. Here you can update your password, change your admin colour theme, set a profile picture, and more.

---

Editing Pages

Editing a Page

If using a Nine10 website, your site styles, Modules, and other brand elements will have already been setup. This will save some time as you can re-use colour and elements throughout to keep consistency.

Most sites have a framework that usually consists of Rows and Columns. If starting a brand new layout, you’ll notice a section that can be clicked to introduce a new Section or Drag a Widget into this section to start it off. If starting a new section, it will ask you how many columns you want. Once you click your column count, you will then be tasked to drag a widget into each column to create your layout.

⚡Expert Tip: If using a Boxed or contained width, avoid using more than five columns. They could appear squished together when viewing. A good rule of thumb is a max of 4 columns in a section.

Once in the Page editor, you will notice the Elementor Widget Panel on the left. Here you can select many page elements that suits your site and goals. The most common being the “Heading”, “Button”, “image”, and “Text Editor” widgets. You can simply drag elements onto the page where ever is best for your layout. On the Right will be the Navigator. This panel will show you your page sections and you can click through each section to edit there. This is a nice way to navigate to a specific section, especially on content heavy pages. You can also drag sections in the Navigator to re-organize your page.

Example: Column 1 has a “Heading” widget on top with “Text Editor” on the bottom. Column 2 has “Image” widget on the right. They will stack automatically once scaled down on a mobile screen.

Another quick way to add to your page is by Duplicating your content and re-using layouts. This will also ensure consistency and styles are used throughout. To duplicate a section or element, simply right click on that element in the Navigator and select “Duplicate”.

By using Sections and Columns during your editing, this will ensure a proper layout is formed and give you less problems in the future. Now that you’ve learned the basics of adding sections and widgets, once you feel comfortable editing there are plenty of other advanced features included in the editor. If you have any further questions on editing further, be sure to contact support@nine10.ca for more information.