Edit Mode Topics

Edit Mode | Content Areas | Element Types | Adding Elements to Content Areas



The liveedit Toolbar

To edit and manage the content on your website, you will first need to login. (Login Guide). After you are logged into the website, you will see our liveedit toolbar. Our toolbar provides powerful tools to control your website's content and design. 



Toolbar Icons


Edit - Activates 'Edit Mode' on the page. Learn more about 'Edit Mode' below. 



Design - The 'Design' section allows you to adjust overall settings for your website's design. To learn more, please see our guide here.



Pages - All your website's pages are managed under this section. To learn more, please see our guides here.



 Help - This icon will bring you directly to our Help Portal to view help articles, submit a ticket, or book an appointment. 


 Dashboard - Brings you to the backend section of your website to access Apps (such as Recipe, IIN Forms, Stations, MyStats) and Services (such as Blog, Calendar, User & Groups, etc). 


 Home - Brings you back to the Home page of your website.



Help - Another quick link to access our Support Portal.

Account Settings - This section gives you access to adding an Custom URL Domain, looking at your account package and more.

Site Settings - To learn more, please see here for more information. 

Manage Profile - Manage your profile account here, such as changing your password.


Sign Out - Logout of the liveedit system. 




Note: Edit, Design and Pages buttons will not show up if you are using a pre-built system generated page (example: Recipe, Blog, or Mindbody Integrated pages.)


Edit Mode

To add or edit content on your website, you must first jump into Edit Mode. To activate Edit Mode, click on the Edit icon that is located on the very left hand side of the liveedit toolbar. After entering Edit Mode, you will see two different items appear. The 'Edit' toolbar and Content Areas. Please see below on a more about each. 






Content Areas

Content areas are the core framework of the overall layout to your website. We design our websites to included a wide variety of Content Areas for you to place in content through our various Elements. Content Areas can only be seen on the website while in 'Edit Mode'. If no Elements are placed into a content area, it will not display when a client views the website. 


Please Note: Content Areas can not be moved, added, or removed from the website through Edit Mode. 



Content Area Types:


Standard Content Areas  

A standard content area is indicated by the "notebook" icon to the left of the content area. These content areas are unique to the page you are on and will not appear on other pages. 

 

Global Areas
A global area is indicated by the "bullseye" icon to the left of the content area name. These content areas will appear on every page the area is placed on. These areas are commonly found in the 'Header' or 'Footer' section of the website.




Additional Content Area Features

Depending on your template/package, you may have these additional features with Content Areas.


Editing Content Areas Properties

To the left of the content area, there will be a blue edit icon. This will bring up the CSS Properties of this particular content area. For a more in-depth overview of this feature, please take a look at our guide here. 


Regions (or Sections) 

Some content areas are wrapped around what is called a region. In this region, you can set a background color/image and it will appear behind all the Content Areas within that region. This provides a great way to organization and created 'sections' on the page. 


For example, 'Section1' in my image below is a region containing  the following Content Areas: PageHeader, ContentLeft, ContentRight, ContentMid.







Element Types

To place content on the website, you will be placing different Elements into Content Areas. After entering 'Edit Mode' you will see the 'Edit Toolbar' on the left hand side that contains a wide variety of Elements. All our website include the Core Elements. The MINDBODY Integrated Elements are only available to clients utilizing our MINDBODY Integration. The IIN Elements are only available to IIN Health Coaches. For a more complete description on each element, please click on the title to bring you to our additional guides. 



Core Elements

MINDBODY Integrated Elements

IIN Elements




              


Using Edit Mode to add Elements to Content Areas

Adding Content

To add content to your page, click on the Element of your choice in the Edit Menu and drag it to the content area of your choice. When the content area is framed with a light grey border, release the mouse and the content type’s edit window will launch.




Moving Content

While in Edit mode, you can drag a placed element between Content Areas. Click on any existing Element, hold the mouse button down, and drag it to another Content Area. When the content area is framed with a light grey border, release the mouse button and the content will be placed in the new area. Changes to the location of your content will be immediately visible to your site's visitors.

 

Note: The appearance of some content may be affected by moving to a content area different in size from the original.




Deleting Content

To completely remove an Element from a Content Area, there will be a "Delete" button in the lower left hand corner while viewing the element. The system will prompt to make sure you want to delete the element. 


Note: This action CANNOT be undone. Please make sure you are certain you are ready to delete before proceeding.



 



Saving Content

Click the "Save Changes" button to save all your edits within the element. Once saved, changes are seen live right away on the website. If you do not wish to save your changes, click the "Close" button.