Quick Start - OLD Komotion

[toggle title=”Access the Website Editor”]

[info_box]To edit the website, access the website’s editing “back-end” or dashboard by clicking the Login link in the top-right corner of your website pages. Enter the username and password that have been provided to you.[/info_box]

Once logged in, you will see the main Dashboard page for your website. To edit the website clicking on the left-side menu to access various tools and settings. The most important areas are:

Posts – Here is where you write/edit/manage your blog posts
Pages – Here is where you write/edit/manage your regular website pages
Appearance – Here is where you manage the widgets that appear in your website pages’ sidebars
Awake – Here is where you manage your website theme and various display properties and settings

Notice that when you view your website after you are logged in, a grey menu bar appears at the very top of your website pages, allowing one-click access to edit the website page that is displayed.

TIP: For increased productivity, keep your website editor in one browser window tab and your live site in another tab or a separate window. This will allow you to rapidly switch between the two or see them side-by-side.

[/toggle]
[toggle title=”Website Name and Logo”]

[info_box]The website name or logo is displayed in the upper-left corner of all the website pages.[/info_box]

Edit Main Website Title Text (which appears at top-left of all pages)

Click on Settings in the left menu
Edit the Site Title field
Click Save Changes

Replace Website Title Text with a Graphic Logo

Click on Awake at bottom in left menu (note: Awake is the name of the master theme used for your website)
Select Custom Image Logo
Click Upload to get the upload popup
Click Browse and select your graphic image file
Click Upload
Click Insert
Click Save All Changes

To view changes made to your website, click Visit Site in the dark grey menu bar at the very top of the page.

[/toggle]
[toggle title=”Show Website at Your Own Custom Domain”]

[info_box]If you have your own domain name and want your website to show there, you will need to take the 3 steps below. Please note that during this process your website may be temporarily unavailable.[/info_box]

1. Map your Custom Domain Name to Your New Website

Once you perform the steps these steps your website at http://yourname.komotion.com (including the website editing dashboard) will not be available until the whole process completes.

Click Tools in the left menu
Click Domain Mapping
Enter your own domain name (make sure you type it correctly, e.g. mydomain.com)
Check Primary domain for this blog
Click Add

2. Redirect your Custom Domain Name to the Komotion Servers

Once you perform these steps it can take 24 hours for the settings to propagate throughout the Internet and reliably points to your new website.

Go to your domain registrar’s website
Log into your account
Add a DNS “A” record pointing at the IP address of this server: 174.133.224.230 (if you do not know how to do that, ask for assistance from your registrar)

Use the IP address as identified here, ending in “230”. Ignore any note that mentions an IP address ending in “226”.

3. Park Your Custom Domain Name on the Komotion Server

Your custom domain name needs to be parked on the Komotion servers. Contact us and let us know the domain name we should park for you. Contact Komotion Support.

If you do not see your site live after 24 hours, please make sure you refresh the content in your browser, delete your browser cache and delete the cached DNS settings on your computer – for the latter type at the command line “ipconfig /flushdns”.)

[/toggle]
[toggle title=”Customize Website Skin – Colors, Fonts, etc.”]

[info_box]The master theme of your website provides stunning looks with pre-configured design styles and ease of use with pre-built shortcodes. The theme (named Awake) also provides flexibility to change its look by editing the theme’s skin. You can change or create skins to suit your needs.[/info_box]

[note_box]Note: To freely experiment with theme variations without overwriting existing themes, create your own skin first, as a copy of an existing skin -or- as a new skin.[/note_box]

Activate and Preview a Skin

Click Awake in far-left menu
Click Skins on left
Select Choose a Skin
Click the drop-down menu and select a skin
Click Activate Skin
Click Visit Site in the very top grey menu bar so you can see how the skin looks like

Create and Activate a Copy of an Existing Skin

Click Awake in far-left menu
Click Skins on left
Select Manage Skins
Click Edit button for the skin you want to copy
Enter a new name for that skin (the name entry field is at the bottom of the page)
Click Save As New Skin
Click Choose Skin
Click the drop-down menu and select the skin copy you just created
Click Activate Skin

Create and Activate a New Skin

Click Awake in far-left menu
Click Skins on left
Select Create a New Skin
Enter a new name for that skin (the name entry field is at the bottom of the page)
Click Save Skin
Click Choose Skin
Click the drop-down menu and select the new skin you just created
Click Activate Skin
Click Visit Site in the very top grey menu bar so you can see how the skin looks like

TIP: The default skin we have provided (default.css) has some additional tweaks and refinements done using the Advanced Editor. It is generally recommended for new users to start with a copy of this default theme. Advanced users with CSS skills and comfortable editing using the Advanced Editor may be best served by creating a new theme from scratch.

Edit and View Changes to the Active Skin

Click Awake in far-left menu
Click Skins on left
Make a note of the active skin name (as it displays in the theme selector)
Select Manage Skins
Click the Edit button for the active skin
Edit the settings as you wish
Click Save Skin
Click Visit Site in the very top grey menu bar so you can see your changes applied

TIP: For a more productive workflow keep your site editor and the live site view in separate browser window tabs or even separate browser windows so you can more readily switch between them.

[/toggle]
[toggle title=”Menus in Header or Footer”]

[info_box]Your website can display custom links lists of pages – or navigation menus – in the top (main or primary) menu bar, the header and the footer of all pages as well as in a page sidebar.[/info_box]

Change order of menu items

Click on Appearance in the left menu
Click on Menus
Select the tab for the menu you want to edit (e.g. Footer, Header, Main… from the top of the right column)
Drag up/down the grey bars (representing each menu item) to change the display order
Click Save Menu

Change a Menu Item Display Label

************** UNDER CONSTRUCTION ****************

Create Sub-menu Items

The Main (primary) menu supports nested menus, or sub-menus. Sub-menus of a menu item display when the website visitor hovers the mouse pointer over that menu item. To create sub-menus, follow instructions above but drag the menu item bar to the right. This will nest the menu item inside the one above it.

Remove menu items

Click on Appearance in the left menu
Click on Menus
Select the tab for the menu you want to edit (e.g. Footer, Header, Main… from the top of the right column)
Click triangle arrow at the right of the menu item grey to expand the respective menu item
Click Remove
Click Save Menu

Add menu items

Menu items can link to other pages, link to any URL or link to nothing…

1. Create new menu item linking to a page from your website:

Click on Appearance in the left menu
Click on Menus
Select the tab for the menu you want to edit (e.g. Footer, Header, Main… from the top of the right column)
Go to the Pages box in the left column
Click the page name of the page you want to link to
Click Add to Menu – the new menu item will appear as a grey bar on the right side
Drag menu item to the position you want
Click Save Menu

2. Create new menu item linking to any given URL (webpage address):

Click on Appearance in the left menu
Click on Menus
Select the tab for the menu you want to edit (e.g. Footer, Header, Main… from the top of the right column)
Go to the Custom Links box in the left column
Enter the URL you want for the menu item
Enter the menu Label you want for the menu item
Click Add to Menu – the new menu item will appear as a grey bar on the right side
Drag menu item to the position you want
Click Save Menu

3. Create a new menu item NOT linking to anything (sometimes used for menu items with sub-menus):

Follow directions above and for the URL simply enter the pound sign: #

[note_box]Display menu in sidebar

************** UNDER CONSTRUCTION ****************[/note_box]
[/toggle]
[toggle title=”Page Sidebars”]

[note_box]Sidebars are special page displaying bits of information through widgets. Sidebars are created and managed separately from pages. Once a sidebar is created, you can manage the content (widgets) that displays inside that sidebar. For each page or blog post you can choose which sidebar to display on that page. The same sidebar can display on several pages.[/note_box]

Create a Sidebar

Click Awake (the name of the master theme used in your website) in the left menu
Click on the Sidebar tab
Enter a name for your sidebar
Click Add Sidebar
Click Save All Changes

Manage Content Inside a Sidebar

Click Appearance in the left menu
Click Widgets
Identify in the right column the sidebar you want to manage
Click on the sidebar grey bar to expand it
To add new content, drag widget from left column into the content area of the sidebar
To order content inside the sidebar, drag the widget bar up/down
To change properties of a widget inside the sidebar, click on it to expand it and adjust properties as neededTo remove content from the sidebar, drag it out from the sidebar
To remove content but keep it for later use, drag the widget into the Inactive Widgets area at the bottom of the left column

[fancy_box title=”Special Sidebar Types”]
Primary Widget Area sidebar is the default sidebar. This sidebar will be displayed on pages that have a layout with a sidebar but that do not have any specific other sidebar assigned.

Footer Widget Area sidebars are displayed in the footer. The theme supports 1 to 6 widget areas in the footer.
[/fancy_box]

Assign a Sidebar to a Page

The default page template provides the options for three different layouts:

Full width (no sidebar)
Left Sidebar
Right Sidebar

Select the layout you want for the page under the main content editing area, under Awake General Option. Then choose which sidebar to display on that page. If you do not assign a sidebar, the Primary Widget Area sidebar will be displayed on the page.

[/toggle]

[toggle title=”Top-right Header Area”]