1. Start
  2. How do I install the Theme?
    1. How can I install the theme ?
  3. How do I configure my new theme?
  4. WordPress Menus
  5. How can I add more items on the homepage slider?
  6. How can I add more items to the portfolio?
  7. How do I configure the contact form?
  8. Permalink Issues
  9. Shortcodes

Side Mobile Retina | WordPress Version


How do I install the Theme?


 

How can I install the theme ?

 

Just like any other WordPress theme “Side” can be installed in a few minutes.

Follow the steps bellow to install “Side”:

1)      Install WordPress on your server, if you don’t know how to do that please go here - http://codex.wordpress.org/Installing_WordPress

2)      go to your WordPress admin panel, and then to “Appearance > Themes”

3)      click “Install themes” at the top, and then click “Upload”. Browse for “side.zip” and once you select it click “Install”

4)      Once the theme is successfully installed you will see the theme options page, click “Save All Settings” once before you visit your new website

How do I configure my new theme?


 

If you visit your new website now, you will notice it’s not exactly perfect. The first thing you need to do in order to speed things up is to import the demo content.

1)      Go to “Tools > Import” (click “WordPress” and install the plugin if you don’t have it), browse for the XML file in folder “demo_content” and then click “Upload file and Import”. Don’t forget to import the attached images by selecting the “Import Attachments” checkbox.

2)      Now you have all your demo content, so go to “Settings > Reading” and change your home page settings. Your “Front Page” needs to be a “static page”, so select that. Your “Front Page” will be  “Home” and your “Posts page” will be “Blog”. You can also change the number of posts that are displayed on your blog page here. Click “Save Changes” once done.

3)      This theme supports “WordPress Menus”, so go to “Appearance > Menus” and make sure the dropdown shows “Main Menu” (top left, in “Theme Locations”)

WordPress Menus


 

WordPress Menus:

As previously mentioned this theme supports custom “WordPress Menus”. You can add new links to your menu, or remove the existing ones.

To use the icons for your menu you have to give each menu item a certain class (a Css class). If you don’t see the “CSS Classes” go to your “Screen Options” (top left) and select it there.

You can use one of the following classes: homeMenu, aboutMenu, portfolioMenu, blogMenu, contactMenu

How can I add more items on the homepage slider?


 

How can I add more items to the home pageslider ?

After your theme has been activated you will see two new menus on your admin sidebar. One of those is called “Slider Items”, and if you click it you will be able to add new items (click “Add New” at the top).

Each slider item needs to have a title, a short description (Excerpt), and a featured image. The image will be resized by WordPress but for the best results you should use an image that’s 800px wide and 420px tall.

How can I add more items to the portfolio?


 

How can I add more items to the portfolio ?

Go to “Portfolio Items > Add New” and create a new item. Give it a title and a featured image. Publish your new item and that’s it.

How do I configure the contact form?


 

How to configure the contact form:

If you want to use the default contact form, all you need to do is set your email address. To do that go to  “Theme Options” and click “Contact Settings”, the first field is for your email address.

Shortcodes


 

Shortcodes:

This theme comes with 12 useful shortcodes.

1)      Columns 1/2:

-          onehalf – [onehalf]content goes here[/onehalf]

-          onehalflast – [onehalflast]content goes here[/onehalflast]

2)      Columns 1/3:

-          onethird – [onethird]content goes here[/onethird]

-          onethird – [onethird]content goes here[/onethird]

-          onethirdlast – [onethirdlast]content goes here[/onethirdlast]

3)      Images:

-          image – [image src=”” alt=”” width=””] – the “src” attribute holds the path for your image, the other two attributes are optional

4)      Buttons:

-          button - [button style=”” to=””]button text goes here[/button]

The “style” attribute can take one of the following values: yellow, grey, black, red, blue, gblue, purple.

The “to” attribute holds the link for the button (a page or a website url)

5)      Icons:

-          icon – [icon style=”” to=””]

This theme comes with over 90 icons, to see all of them please check out the demo content XML.

The “to” attribute holds the link for the icon.

6)      Lists:

-          ulist – [ulist style=””][/ulist]

The style attribute can take the value “icon-lists”

-          olist – [olist style=””][/olist]

-          listitem – [listitem style=””]list item text goes here[/listitem]

The “style” attribute for the listitem can have one of the following values: add, chart, chartflip, close, down, error, heart, info, left, page, right, rss, search, staroff, staron, twitter, facebook

7)      Alert boxes:

-          alertbox – [alertbox style=”” ]alertbox text goes here[/alertbox]

Values for the style attribute: notification-box-green, notification-box-yellow, notification-box-blue, notification-box-red

8)      Toggles:

-          toggle – [toggle style=”” title=””]toggle content goes here[/toggle]

The “style” attribute can take the following values: toggle-arrow, toggle-plus

The “title” attribute holds the text that’s displayed to the right of the icon.

9)      Highlighted texts:

-          highlight – [highlight style=””]highlighted text goes here[/highlight]

The style attribute can have one of the following values: highlight-orange, highlight-yellow, highlight-green, highlight-gray

10)   Titles:

-          title – [title type=”” style=””]title text goes here[/title]

The “type” attribute determines what kind of heading will be used (h1, h2, h3, h4, h5, h6), while the “style” attribute holds the class value, if there is one.

11)   Page breaks:

-          pagebreak–[pagebreak style=””]

The “style” attribute can take the value “decoration”.

12)   Service:

-          service – [service]content goes here[/service]

The service shortcode is a simple wrapper used on the front page.