Orion Theme Documentation

General Documentation


Top  

Setup & Installation

Important: Orion should be installed as a parent theme alongside of its child theme (included in your download).

Automatic updates will be disabled if Orion the child theme is not activated. The purpose of this is to ensure that you do not lose any of your customizations. WordPress completely overwrittes the parent theme when an update is downloaded. The child theme is never touched.

Installation

  • Install or upload and extract orion.zip and orion_child.zip to your wp-content/themes directory.
  • Activate the Orion Child theme

Archive Contents

  • README.md/html
    • Documentation
  • orion.zip
    • Orion Parent Theme
  • orion_child.zip
    • Orion Child Theme
  • orion_demo_content.zip
    • Orion Demo content WordPress XML export and MySQL Database
  • orion_sass_source.zip
    • This is the SASS source code for experienced developers only. You don’t need to upload or install these files. (See included included Readme.html file)
Top  

Usage

Page Layouts

When you create a new Page in WordPress when using Orion, you’ll notice the various Page Templates in the Attributes Selector:

  • Default Template - A standard WordPress page with Widgetized sidebars
  • Feature Page - A full-width layout with upper slideshow featured teaser boxes
  • Wide Page - Standard Page with no sidebars
  • Freeform Content - Bare page useful for custom HTML with no Title or sidebars

Formatting Tips

WordPress has its fair share of quirks. If you find that WordPress auto paragraph formatting (wpautop) is getting in the way of your markup, simply add a custom field to your Page or Post named “wpautop” with a value of “false”.

Top  

Sliders

There are tons of sliders out there that work with WordPress, however we’ve added an optional built-in simple slider that’s made to work with the theme out of the box.

The included slider is ideal for rotating text and image based content which can be seen in the theme demo. If you’re looking for a more robust solution with animated and spinning transitions, you may prefer to use a third party commercial slider such as Layer Slider.

Sliders can be accessed from the “Sliders” menu in your wp-admin menu. When you add a new slider, you’ll be presented with various options, so it’s a good idea to have balanced content and an end-goal in mind before you begin.

Sliders

The slider options are where you’ll configure the type of Slider you wish to achieve.

Slider Documentation

UI Features:

These settings control the user navigation options such as autoplay, autoheight, transition (slide/fade), etc.

Size:

These settings control how your slider will appear within your site. It’s important to know that Sliders can be embedded in the main content body (via [slideshow] shortcode or may be published in the “Featured” area below the header.

Colors:

Sets the text and background color/image for your main slider element.

Advanced:

Allows you to set a custom CSS class for advanced styling.


Once you’ve set your main slider element options, you can begin creating slides. Individual slide types can be mixed, but generally you’ll want them to be of the same type with relatively the same length of content.

Once you’ve set the slide type, check the “Slide Content” tab as the options will be updated based on your selection:

Once you’ve created your slider, you can embed it in one of a couple ways:

Embed in content area via [slideshow] shortcode:

In the Featured position:

On standard Pages, you can select the slider to display above your content:

Top  

Customization

Styling

  • Visit Appearance → Customize to set your preferred options

You may also wish to make more advanced customizations and tweaks to the CSS.

The Orion child theme uses two stylesheets:

  1. orion_child/style.css
  2. orion_child/style{x}.css (where x = your selected preset e.g; style1.css)

Within style.css you’ll see this line:

@import url("../orion/style.css");

What we’re doing here is importing a copy of the parent theme style.css into the child theme.

In most cases, you can just add your overrides below this line. If you find yourself needing more core customizations, you can copy the contents of the parent theme style.css into this file.

Note: Be sure to leave the child theme’s stylsheet header in tact as this line is important:

Template: orion

If you work locally and prefer to use SASS, please see the readme in the SASS Developer Source zip file.

Functional Customization

For PHP customization, most functionality can be overriden via action hooks and filters. This is the preferred method. If you find that you need even more control over functionality, you can duplicate the function entirely in your functions.php file.

Layout Customization

Layout (HTML) customizations are the most widely supported. Below is a list of actions that may be customized to suit your needs:

* Layout Functions:
* st_header_open
* st_logo
* st_main_nav
* st_header_close
* st_before_content
* st_after_content
* st_before_comments
* st_after_comments
* st_before_sidebar
* st_after_sidebar
* st_before_footer
* st_footer
* st_footernav
* st_after_footer