Rainier Theme Manual

Please note that this theme currently has limited support, meaning we may provide bug fixes and security updates, but are not regularly updating it. As of March 31, 2018 we will be discontinuing support completely for our WordPress and Tumblr products. Thank you for understanding.

Rainier for Wordpress is a single-channel theme that perfects the blogging experience. It provides a minimalist, highly customizable space to share your work, with a Ph.D. in gorgeous typography and balanced negative space.

Feature overview

  • Responsive to every device and screen size
  • Completely customizable header, including user-defined height, colors, background images, transparent overlays, and background video support
  • Three preset styles for header title
  • Advanced font customization with Typekit integration
  • Support for Standard, Photo, Video, Quote, Link, and Gallery post formats
  • Support for nested menus up to five levels deep
  • Support for up to five footer widgets
  • Custom Twitter feed widget
  • Custom share widget
  • Selective content display options
  • User-friendly Customize Panel
  • Support for Jetpack's Infinite Scroll, Galleries, and Shares & Likes

Customization

Every visual aspect of Rainier can be controlled through WordPress'  Customization Panel. It allows you to change all of your visual and content options. All changes will be reflected live in front of you, without needing to reload the page. Upon activating Rainier for the first time, you will be taken through a guided tour of Rainier's features and functionality.

You can access the Customize Panel from your admin panel by navigating to  Themes > Customize or by appending /wp-admin/customize.php to your site's URL.

Header and Index

Site Title & Tagline

Under the Theme section of your customizer, you can set the Site Title Style to one of three preset font options – Lato, Lato Boxed, and Crimson – applied to your header and tagline.

Alternatively, you can choose to  toggle the visibility of both the Site Title and Tagline, or you can replace the site title with a logo instead.

Colors

Use the color picker to set the Link and Accent Color, which is used as a uniform color for elements such as links, footer widgets text, and the share widget.

Site Header

Rainier comes with a slew of features to let you customize your site's header. Here is a comprehensive list so you can make your header just the way you like it.

RANDOMIZE UPLOADED HEADERS

Once you have uploaded multiple header images, you can press the  Randomize uploaded headers button to get a different image on every page load. We recommend a header size of 1100 × 450 pixels. This feature is built in to WordPress's Customize Panel.

VIDEO HEADER

You can also add a background video header instead of a background image. To do so, you'll need to upload both an  .mp4 and .webm version of your video in order to support all the major browsers. Then check the Enable Header Video box. Due to browser limitations, some mobile browsers don't support embedded HTML5 videos. To keep everything looking nice you'll want to also upload a header image to fall back to in this situation; it can be a still from the video or a different image altogether. Some server configurations cap the size of files uploaded, so if you find your videos aren't uploading you may need to contact your web host to increase your upload size.

DARK AND LIGHT PRESETS

Select the  Dark or Light preset for header elements (title, tagline, and menu items) to match your background image and desired overlay color.

HEADER COLOR

Instead of setting a background image, you can set a header color using the color picker. By default this will be an opaque color, but will become an overlay when an image or video background is set — use the  Overlay Opacity range slider to set the visibility of your overlay color.

HEADER HEIGHT

Set the header's height using the  Header Height range slider.

HEADER DIMMER

Check the  Enable Header Dimmer box to apply a gradient dimmer along the bottom of your header.

Nested Navigation

Rainier supports up to five levels of nested navigation items in its Pages footer widget. When creating or editing pages, you can create and control sub-menus by assigning your page a parent page and changing the page order in the  Page Attributes section.

Toggle  Show Search to display a dropdown search field in the header.

Static Front Page

WordPress, by default, allows you to set your site's homepage to a static front page instead of your blog index. Choose from  Your latest posts or A static page options to enable one of them as your home page.

Social Icons

We built a custom social icons management tool to make it easier than ever to add, edit, and delete links to your other social media accounts.

RainierSocial

Currently, Rainier supports over twenty online accounts. Simply select your service from the dropdown, fill in your account info, and click the check mark on the right-hand side of the form. Additionally, you can rearrange how your accounts display by dragging and dropping each field to your liking.

Footer Widgets

Go to  Appearance > Widgets to add, modify, and remove any WordPress's built-in footer widgets. We cannot guarentee that Rainier supports widgets that are activated by third-party WordPress plugins.

Twitter Widget

Rainier comes with a custom footer widget called  Twitter Feed to display a Twitter feed. To enable it, you will first need to set up a new Twitter application.

SETTING UP A TWITTER APPLICATION

You will need to enter an application name, description, and URL during setup. The name and description do not affect your application, but the name needs to be unique. Include the full URL to your site – starting with  http:// or https://.

SETTING UP THE TWITTER WIDGET

After creating your application, you can retrieve your your API keys from the  API Keys tab. You will need the API KeyAPI SecretAccess Token, and Access Secret. Use the Create my access token button at the bottom of this tab to generate an Access Token and Access Secret. Your keys will be long strings of letters and numbers and should be kept private. Copy and paste them directly into the corresponding Twitter Feed widget fields.

Pages and Posts

Post Formats

Rainier makes use of the WordPress' Post Formats functionality, supporting Photo, Video, Quote, Link, and Gallery formats, in addition to Standard format. You can select your desired post format from the  Format section while adding or editing a post.

Photo, Video, or Gallery formats will take first photo or video respectively and hoist it out and above the post content, allowing it to expand beyond the maximum content width. Photo posts will expand photos to their maximum natural width when possible, and Video and Gallery posts will expand to a maximum width of 1100 pixels.

Quote and Link formats will apply unique styling to the first quote or link in the post.

Additional Text Styles

Add a lead paragraph style or pull quote to any of your pages or posts. You can see what they look like on our Rainier  demo. Select the paragraph you wish to add the style to, then use the "Toolbar Toggle" button to reveal your paragraph options.

Next, use the "Formats" dropdown to pick either "Lead" or "Pull Quote."

Advanced (Font Customization)

Rainier gives you control over the fonts on your site. You can enter in your your Typekit Kit ID to turn on Typekit font support. Use the fields provided to add your own  title fontserif font, and sans-serif font, which will override any default fonts. Custom fonts are not limited to Typekit. Another option is Google Fonts – just make sure you're using the font family's true name (for example, Helvetica Neue is "helvetica neue").

In the  Custom CSS section, enter any custom CSS styles to adjust font size, line height, and other parameters to align your custom font with the overall appearance of your site.

Note that fonts entered in the text field must reflect the font family's true name. So, for example, if you’re using FF Tisa Sans Pro, the font family name is "ff-tisa-sans-web-pro". This can be found in the Kit Editor in Typekit by selecting the font, then in the left side click "Using weights & styles in your CSS”.

Content Options

You can toggle the visibility of some content areas, so you can show what you need and hide what you don't need.

SHOW POST AUTHOR

Checking this option will show author information and an author photo at the end of each blog post. The author's name links to an archive of that author's posts. This is especially useful for blogs with multiple authors.

SHOW POST PINGBACKS & TRACKBACKS

Check this option to show Pingbacks and Trackbacks on your posts. This does not disable Pings on your blog. It just hides them.

You can disable Pings all together by clicking  Settings > Discussion from your admin panel. You can disable them on a post-by-post basis while adding or editing a post.

SHOW POST SHARE WIDGET

If you're opting not to use the  Jetpack's Sharing module, you can check this option to enable an animated and responsive share widget on each post. It supports Facebook, Twitter, and rich media for Pinterest. Add or remove the widget from individual posts from the Sharing section while adding or editing a post.

Check this option to show post titles for Quote and Link post types. By doing this you can set a post title but avoid displaying it on your blog's index page.

World-class customer support

Our support staff is committed to helping you solve any problems you encounter along the way. Exceptional, human support matters to us a great deal. Contact us or check our help centre if you need any help at all.