Created: 29/03/2014
By: Tomas Toman
Web: www.tomastoman.cz
First of all, I would like to thank you for choosing StairWay! I firmly believe that you will be satisfied with this theme. In case of any problems or doubts, you can use the StairWay Official Support (in English, German or Czech).
Thanks so much!
StairWay is an easily customizable WordPress multipurpose theme. It is a fully responsive theme that allows for easy viewing on any device. Using Theme Options panel and Drag-and-drop Page Builder, you can customize this theme directly to your needs. StairWay is fully compatible with the popular WooCommerce plugin.
Compatible Browsers: Internet Explorer 8+, Google Chrome, Mozilla Firefox, Opera, Safari
Compatible WordPress Versions: 3.6+
For StairWay installation, you must follow these basic steps:
Alternatively, you can install this theme via your WordPress administration. Go to “Appearance > Themes” panel and using “Add New” tool upload the original ZIP file. After uploading, activate the theme.
Once you have purchased StairWay Premium Version, simply upload the extracted folder that you have got by purchasing StairWay Premium Version via FTP to "wp-content/themes" directory on your host web server.
Or, if the previous described procedure will not be comfortable for you, go to “Appearance > Themes” panel in your WordPress administration and using “Add New” tool upload the ZIP file which you got by purchasing StairWay Premium Version. Then activate the StairWay Premium theme.
The options framework is available via panel "Appearance > Theme Options".
This tab is used for choosing one of the basic color schemes and setting some parts of your website (right sidebar, breadcrumb navigation, favicon).
You can find here the option for selecting between Excerpt/Content displaying on your archive pages, too.
This tab is used for setting the Header Image size (Cover or Auto) and for uploading the Header Logo (which will be displayed instead of the default Site Title). You can set here the percentage ratio between Title Box/Main Menu Box, too.
If you want to display your custom Logo instead of the Site Title, simply upload or choose your logo image in "Theme Options > Header settings > Logo URL". For removing the Logo and setting the Site Title again, simply delete the URL address of your Logo in "Theme Options > Header settings > Logo URL".
Under this tab, you can set displaying of the related posts (only in Premium Version available), featured images and meta data on the individual single posts. You also can disable displaying of featured images on static pages.
There are 2 options for displaying your homepage. You can set them in "Settings > Reading" panel in your WordPress administration:
1. Your latest posts
2. A static page
By default, the latest posts from all the categories are displayed on your homepage. StairWay theme allows to display the latest posts from the specific categories. This is done by the StairWay Posts Widgets. You can choose from 6 different StairWay Posts Widgets:
1. StairWay Posts-Column
2. StairWay Posts-Default
3. StairWay Posts-Grid
4. StairWay Posts-List
5. StairWay Posts-Slider
6. StairWay Posts-Thumbnail
The individual widgets differ in the way how the latest posts are displayed. In the Free version is available only the StairWay Posts-Default widget.
For displaying boxes with the latest posts from a specific category, go to "Appearance > Widgets" settings. Insert as many StairWay Posts Widgets as you want into "Latest Posts Homepage widget area".
Note: If you does not want to display the default Latest Posts section on your homepage, simply hide it in "Theme Options > Homepage Settings > Latest Posts".
In "Theme Options > Homepage Settings", you also can fill the headline and link which will be displayed in the Homepage Header Image. You can set your own Header Image in "Appearance > Header" panel.
This tab is used for setting your own color scheme. You can choose here the colors of individual parts of layout, headlines and texts. Using color pickers, you can easily choose exactly that color you want. You can also directly enter the hexadecimal code of your favorite color.
Tip: If you want to use the same color for more items, simply copy and paste its hexadecimal code instead of setting it using color pickers on each item.
Color settings panel
This tab is used for selecting Google fonts for individual headlines and text areas. StairWay offers more than 200 fonts for choosing. The default fonts are specified in the main stylesheet file (style.css in the main theme folder).
In Premium version, you also can set the font-size of individual headlines and text areas.
On this tab, you can choose wheter to display or not the Facebook, Twitter and Google +1 sharing buttons which may appear below your single posts/pages content (only in Premium Version available).
There also are fields for URL addresses of your social networking profiles and RSS, which will display the icon-links in header.
Social networking panel
On this tab, you can fill your own cascading style sheet information (CSS) for modifying the layout. So you do not have to write your custom CSS straight into the file style.css in the main theme folder. The CSS information defined on this tab appears in the "head" section of source code.
Above the Custom CSS field, there are also links for editing widgets, header image, main background and menus.
For setting your own main background image or color, go to "Appearance > Background" panel. Upload your own photography and set here all the background-image settings (position, repeating, attachment). For setting one-color background, use the color picker at the bottom of this page. To make the selected color visible, there should not be set any background image.
For setting your custom header image, go to "Appearance > Header" panel and upload or select your own image. Suggested height of your image is 500 pixels. For properly displaying on wide-screen monitors, the width of your image should be about 2000 pixels.
Note: If you upload more images in "Appearance > Header" panel, you can use them for displaying on individual pages (you can set them when you are editing a page/post/category/author archive) (only in Premium Version available).
In "Theme Options > Homepage Settings", you can fill the headline and link which will be displayed in the centre of the Header Image on your homepage.
The option for Logo/Site Title displaying is located in "Theme Options > Header settings". If you want to display your custom Logo instead of the Site Title, simply upload or choose your logo image in "Theme Options > Header settings > Logo URL". For removing the Logo and setting the Site Title again, simply delete the URL address of your Logo in "Theme Options > Header settings > Logo URL".
In "Theme Options > Homepage Settings > Homepage Header Slideshow", you can set the Slideshow which will be displayed instead of the static Header Image. Here are the instructions how to set the Slideshow:
If you want to remove the Slideshow and display the static Header Image again, simply set the option "- not selected -" from the "Header Slider Posts Category" drop-down list.
Note: In StairWay Premium theme, there are 2 independent options for displaying slideshows. Beside the Homepage Header Slideshow (which displays the posts with featured images), you can insert the Image Slideshows into a content of pages/posts using Cyclone Slider.
There are several areas for displaying widgets in StairWay Theme:
The Widget panel is located in "Appearance > Widgets" panel. If you want to place a widget in some of that areas, simply drag its panel and drop it to the area where you want to display the widget.
Right Sidebar widget area displays in the right sidebar on all your pages and posts. Its name in "Appearance > Widgets" panel is "Right Sidebar". You can put here as many widgets as you want.
If you does not want to display the Right Sidebar, you can hide it in "Theme Options > General Settings > Display Sidebar".
Footer widget area displays in the footer as the 3 columns of widgets. In "Appearance > Widgets" panel, you can see 3 areas for individual columns: "Footer left widget area", "Footer middle widget area" and "Footer right widget area". This boxes represent those 3 columns. You can put as many widgets as you want into each column.
The widget area for copyright and other notices displays in the footer, below the main Footer widget area (described above). Its name in "Appearance > Widgets" panel is "Footer notices". Put here one "Text" widget. Into the content field of this widget fill the text (or HTML code) you want to display here. The "Title" field of this Text widget should stay empty.
Note: To display the Footer notices in the middle of the line, please check the option "Automatically add paragraphs" at the Text widget inserted into this area.
StairWay theme allows to display the latest posts from the specific categories. This is done by the StairWay Posts Widgets. You can choose from 6 different StairWay Posts Widgets to insert into "Latest Posts Homepage widget area". The individual widgets differ in the way how the latest posts are displayed (described in detail in Custom widgets paragraph).
StairWay theme offers 14 custom widgets altogether (only 1 in Free Version):
StairWay Posts Widgets allow to display the latest posts from the specific categories on your homepage (or on other pages using the Page Builder). You can choose from 6 different StairWay Posts Widgets (in Free Version is available only the StairWay Posts-Default widget):
For using these widgets, go to "Appearance > Widgets" settings. Insert as many StairWay Posts Widgets as you want into "Latest Posts Homepage widget area".
Note: StairWay Homepage Widgets are designed ONLY for putting into "Latest Posts Homepage widget area", not for the other widget areas. Alternatively, you can use all the StairWay custom widgets with the Drag-and-drop Page Builder for displaying on a static page.
This widget is ready to use for displaying icons with links to your profiles on social networks and RSS feed. Put StairWay Social Widget into Sidebar or Footer widget area in "Appearance > Widgets" panel and fill requested URL addresses. These social networks and services are supported:
This widget is ready to use for displaying Facebook Like Box. The Like Box is a special version of the Like Button designed only for Facebook Pages. Using this widget, you can easily promote your Facebook page on your website.
Put StairWay Facebook Like Box Widget into Sidebar or Footer widget area in "Appearance > Widgets" panel and fill the full URL of your Facebook Page that will be liked. Then set a height of Like Box and specify whether to display the profile photos of people who like the Page and a stream of the latest posts by the Page.
This widget is ready to use for displaying Twitter Follow button. Put StairWay Twitter Widget into Sidebar or Footer widget area in "Appearance > Widgets" panel and fill the Twitter username you want to display via Twitter Follow button.
This widget is ready for displaying full-screen image sections using Drag-and-drop Page Builder. Before using this widget, you will need to upload the requested background image through "Media > Add New" panel. After uploading, simply copy the "File URL" (not the "Permalink"!) into the "Image:" field of a StairWay Box-Image widget. Then fill the other fields according to your needs (Title, Subtitle, Button link and Text).
You also can set some properties of the Image-Box: box height (in pixels), background image size (cover or auto) and scrolling (whether the background image should be scrolled or fixed for creating a parallax effect).
IMPORTANT NOTE: For correct displaying of the Image-Box, you must set the "Full Screen (Page Builder)" page template for that page and the "StairWay - full screen" Visual Style for a Row where you have inserted this widget. For more information about the Page Builder, please read this paragraph.
This widget is ready for displaying a text box with custom link and header icon (you can choose from 14 pre-defined icons). You can insert this widget into the Right Sidebar or into the content of a static page using Drag-and-drop Page Builder.
This widget is ready for displaying a box with your custom image, title, subtitle and text. You can insert this widget into the Right Sidebar or into the content of a static page using Drag-and-drop Page Builder.
This widget is ready for displaying a headline of a section created with the Drag-and-drop Page Builder (for example, you can specify the headline for section of StairWay Box-Info Widgets using this widget).
Note: This widget is designed for inserting into a separate Row in the Page Builder, so the other widgets should be inserted into a different Row below the separate StairWay Section-Headline Row.
This widget is ready for displaying the popular posts, recent posts, comments and tags in tabbed format in your sidebar.
In StairWay theme, there are 2 areas for displaying menus:
Menu settings panel is located in "Appearance > Menus". At first, create a new menu and assign it to one of the Menu areas. Then, in the left panels choose required pages/categories or custom links and add them to your new Menu. Then save all changes.
If you want to create a submenu, just drag required menu item and move it more to the right against its parent item. When you drop your sub-item, it should stay with indentation against the parent item. This way you can create unlimited levels of submenus.
By default, the width of the Main Header Menu bar is 50% (percentages due to the header width). In "Theme Options > Header settings", you can increase or decrease the width of Main Header Menu bar (and also the Title bar width by the same way). The sum of these two options should be always 100%.
Example of three-levels menu
Beside Default Template, StairWay offers 8 other custom Page templates (only 4 in Free Version). If you create a new page or edit some existing page, you can choose the Page template in "Page Attributes > Template" right panel.
"Sitemap" Page template is ready for displaying your sitemap page. If you want to use it, the Dagon Design Sitemap Generator plugin must be activated. The sitemap options can be specified in "Settings > DDSitemapGen" panel.
If you want to display only some pages without the main right sidebar, simply use this template for these pages.
This template displays the page in the same way as the "Full-width" template, but it will not display the Facebook, Twitter and Google + sharing buttons. It could be useful for creating pages using Drag-and-drop Page Builder.
This template displays the page in the same way as the "Default" template, but it will not display the Facebook, Twitter and Google + sharing buttons. It could be useful for creating pages using Drag-and-drop Page Builder.
This template is designed only for working with Drag-and-drop Page Builder. You must set this template when you are using the StairWay Box-Image Widget.
This template hides the whole Comments area (even if the comments are allowed for this page).
This template displays only the page Content without the page Title.
This template displays only the page content without menus, right sidebar, comments area and footer widget areas. You can use it for creating a temporary home page before your website will be ready for the public launch.
Using Drag-and-drop Page Builder, you can simply create your own page templates. Working with Page Builder is as easy as managing widgets in "Appearance > Widgets" panel. By default (if all the StairWay theme features are active), the Page Builder contains 40 widgets altogether:
If you have installed some plugins offering their own custom widgets, they will be probably also included into the Page Builder widgets offer.
Page-layout created by the Drag-and-drop Page Builder
Tip: If you does not want to display the Share Buttons on some page, just select the "Page without Share Buttons" or "Full Width without Share Buttons" page template instead of the Default Template.
Some functions of StairWay are conditioned by installing some plugins. If some of the recommended plugins are inactive, you can see them in "Appearance > Install Plugins" panel.
List of recommended plugins for the Free Version:
If you want to display the breadcrumb navigation beside the main content headlines, the Breadcrumb NavXT plugin has to be installed and activated. This plugin provides many advanced options for displaying breadcrumb navigation. You can set them on "Settings > Breadcrumb NavXT" panel.
Tip: If your Breadcrumb Navigation is too long, so it takes 2 or more lines, you can short the Title Length in "Settings > Breadcrumb NavXT > General" panel.
StairWay offers several custom shortcodes for easy displaying of some HTML objects on pages/posts or widgets:
1.) [image src="Image URL"]
Shortcode for displaying images. It is especially useful for inserting images into Text widgets.
2.) [table cols="headline1,headline2" data="row 1 value 1,row 1 value 2,row 2 value 1,row 2 value 2"]
Shortcode for displaying tables. The parameter "cols" is used for inserting headlines of individual columns. The parameter "data" is used for inserting own data in rows of your table.
3.) [button link="URL address"]TEXT OF YOUR BUTTON[/button]
Shortcode for displaying left-aligned buttons.
4.) [highlight]HIGHLIGHTED TEXT[/highlight]
Shortcode for displaying color-highlighted text (the color is editable in "Theme Options > Colors").
5.) [google-map address="Address of any place in the world" width="100%" height="200px"]
Shortcode for displaying Google maps. The "width" and "height" parameters are optional. You can set the dimensions in percentages or pixels, but for responzive displaying is recommended to input percentage dimensions.
6.) <!-- ddsitemapgen -->
Shortcode for displaying Sitemap in the content of any page/post.
7.) [display-posts category="category-slug" include_excerpt="true"]
Shortcode for displaying a listing of posts in post/page content or in a Text widget.
Arguments for [display-posts] shortcode:
author
Specify the post author
Default: empty
Example: [display-posts author="bill"]
category
Specify the category slug (or comma separated list of category slugs)
Default: empty
Example: [display-posts category="fishing,hiking"]
date_format
Specify the date format used when include_date is true. See Formatting Date and Time on the Codex for more information.
Default: '(n/j/Y)'
Example: [display-posts include_date="true" date_format="F j, Y"]
id
Specify a specific post ID (or multiple post IDs) to display.
Default: empty
Example: [display-posts id="9, 10"]
image_size
Specify an image size for displaying the featured image, if the post has one. The image_size can be set to thumbnail, medium, large (all controlled from Settings > Reading), or a custom image size.
Default: empty
Example: [display-posts image_size="thumbnail"]
include_date
Include the post's date after the post title. The default format is (7/30/12), but this can be customized using the 'date_format' parameter.
Default: empty
Example [display-posts include_date="true"]
include_excerpt
Include the post's excerpt after the title (and date if provided).
Default: empty
Example: [display-posts include_excerpt="true"]
offset
The number of posts to pass over
Default: 0
Example: [display-posts offset="3"]
order
Specify whether posts are ordered in descending order (DESC) or ascending order (ASC).
Default: DESC
Example: [display-posts order="ASC"]
orderby
Specify what the posts are ordered by. See the available parameters here.
Default: date
Example: [display-posts orderby="title"]
post_parent
Display the pages that are a child of a certain page. You can either specify an ID or 'current', which displays the children of the current page.
Default: empty
Example: [display-posts post_type="page" post_parent="8"]
post_status
Show posts associated with a certain post status
Default: publish
Example: [display-posts post_status="publish, future"]
post_type
Specify which post type to use. You can use a default one (post or page), or a custom post type you've created.
Default: post
Example: [display-posts post_type="event"]
posts_per_page
How many posts to display.
Default: 10
Example: [display-posts posts_per_page="5"]
tag
Display posts from a specific tag, or tags
Default: empty
Example: [display-posts tag="tag1, tag2"]
taxonomy, tax_term, and tax_operator
Use these parameters to do advanced taxonomy queries. Use 'taxonomy' for the taxonomy you'd like to query, 'tax_term' for the term slug (or terms) you'd like to include, and 'operator' to change how the query uses those terms (most likely this field will not be needed).
Default: 'taxonomy' = empty , 'tax_term' = empty , 'tax_operator' = 'IN'
Example: [display-posts taxonomy="color" tax_term="blue, green"]
wrapper
What type of HTML should be used to display the listings. It can be an unordered list (ul), ordered list (ol), or divs (div) which you can then style yourself.
Default: ul
Example: [display-posts wrapper="ol"]
StairWay theme is ready for translation into any language. The .pot file (stairway.pot) is located in "languages" theme folder. StairWay contains integrated Czech (cs_CZ), Danish (da_DK), Dutch (nl_NL), French (fr_FR), German (de_DE), Greek (el), Italian (it_IT), Polish (pl_PL), Russian (ru_RU), Slovak (sk_SK) and Spanish (es_ES) language localizations. The best way how to make the language localization is creating your own .po and .mo files and adding them in "languages" theme folder. If you create them, please let me know, I will add your language localization into the official theme distribution.
If you don't know how to create the .po and .mo files, never mind! Simply install CodeStyling Localization plugin and create your language localization on "Tools > Localization" panel.
1.) Where could I edit my website title and description?
Go to the "Settings > General" panel and rewrite here the fields "Site Title" and "Tagline".
2.) Where could I allow/disallow comments adding?
Go to the "Settings > Discussion" panel and set the options according to your needs. If you want to disallow adding comments only for one specific page/post, you can do so using "Quick Edit" link at this page/post in "Posts > All Posts" or "Pages > All Pages".
3.) What are the "Tags"?
Tags are similar to Categories. They are used for better description of posts. We can say that Tags are the keywords which specify the posts in great detail.
4.) How could I set title, description and keywords meta tags for each page and post?
The easiest way is to install some SEO plugin, for example All In One SEO Pack.
5.) Where could I set the number of posts, which display on index/categories/archives/search pages?
Go to the "Settings > Reading" panel and set the options according to your needs.
6.) I do not want to display the latest posts on my home page. Could I set a static page as my home page?
Yes, go to the "Settings > Reading" panel and choose the option "A static page" instead of "Your latest posts".
7.) How could I set the URL addresses of my pages and posts into user-friendly form, instead of "?p=123" displaying?
Go to the "Settings > Permalinks" panel and choose the option "Post name" in section "Common Settings".
8.) Where could I set my time zone and date/time format?
Go to the "Settings > General" panel and set the options according to your needs.
9.) Where could I set the header image?
Go to the "Appearance > Header" panel and upload here your own header image or select one of the already uploaded images.
10.) I have tried to upload a theme through "Appearance > Themes" panel, but I got the following error: "The uploaded file exceeds the upload_max_filesize directive in php.ini". How can I fix it?
This error is caused by a too low memory limit set on your web server. To fix it, please contact your web host provider with the request to increase the memory limit for uploading files. Or, you can install your theme through FTP.
Once again, thank you so much for choosing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. Best regards and have fun with StairWay!
Tomas Toman