“Alyeska WordPress Theme” Documentation by “Theme Blvd”

“Alyeska WordPress Theme”

Created: March 6, 2011
By: Jason Bobich
My Blog: JasonBobich.com
Follow Me: Twitter.com/jasonbobich

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. And if you like the theme, please go to your Theme Forest downloads page and give this product a 5 star rating :-) Thanks so much!

Table of Contents

  1. Getting Started
  2. Theme Overview
  3. Standard WordPress Elements
  4. Writing Pages and Posts
  5. Page Templates
  6. Slideshows
  7. Portfolios
  8. Search Engine Optimization
  9. Compatible Plugins
  10. Customization Tips
  11. Sources and Credits

Getting Started

Installation (video) - top

This video explains the simplest way of installing a ThemBlvd WordPress theme. However, this method does not work for everyone on all servers. So, if this way doesn't work, follow the instructions in the next video.

Installation - Classic Method (video) - top

This video shows you the classic way of installing a WordPress theme.

Important Installation Notice - top

Please note there is an important first step after installing this theme. You need to navigate to Settings > Permalinks and click on the "Save Changes" button, even if you haven't made any changes. This is to register the custom post types used in the theme.

Browse Theme Options (video) - top

When you first install the theme, it's a good idea to skim through your available theme options so you understand how the theme works.

Utilizing Built-in Documentation (video) - top

When you're working with the theme, it's a good idea to utilize built-in documentation scattered throughout your WordPress admin panel.

Theme Hints (video) - top

Theme Hints will help you setup your website while you're in development mode.

Configuring Theme Fonts (video) - top

This theme gives you control over your body and header fonts from your theme options page. This videos shows you how and explains what it all means.

Theme Overview

Default Homepage Video Walk-through (video) - top

This video will walk you through how this theme's default homepage works.

Default Homepage Overview - top

The default homepage with this theme is quite flexible. There many layouts you can achieve with just a few options that you may not have realized from just viewing the theme's live demo before purchasing. So, make sure and take a moment and really look over this section to understand the true flexibility of the homepage.


Alyeska > Theme Options > Homepage Options

In this theme, by "default homepage" we are referring to the homepage you see when you go to Settings > Reading, and select "your latest posts."

You can use the numbers in the screenshot to locate corresponding descriptions below.

Note: If you've just installed the theme, your site won't be looking quite like the screenshot you see above because you haven't put in any of your content yet. If you're feeling lost at this point, make sure and watch some of the getting started videos.

You can put in a URL to your own logo image on your theme options page. You can also specify just to just show text, if you like. If you choose to show your site title and not a logo image, you can set your Title under Settings > General.


Alyeska > Theme Options > Logo

2) Social/Contact Buttons

For your social buttons, you have many buttons to choose from, as you can see from the theme options page. In order to use any of the buttons, you simply can fill in the URL you'd like the button to link to, and it will display. If don't want any buttons to show, then make sure they are all blank.


Alyeska > Theme Options > Contact Buttons

3) Primary Navigation

When you first install the theme, you will see Home button and a listing of your WordPress pages by default because you haven't created a menu yet. So, you'll need to navigate to Appearance > Menus, create a menu, and assign it to the primary navigation location. If you're unfamiliar with creating menus in WordPress, you should check out this video tutorial.

Below, you can see exactly how the theme's live demo main menu is setup as an example.


Appearance > Menus

4) Homepage Slideshow (optional)

This theme use a custom post type called "Slides" which you organize into a custom taxonomy called "Slideshows". These Slideshows can then be shown throughout your website, as well as assigning specifically to the homepage. See the slideshow section of the documentation for more details on that.


Alyeska > Theme Options > Homepage Options

Additionally to selecting which slideshow to show, take note that on the homepage you can also select from one of four slideshow types to show. Scroll down below on the theme options page to actually configure the settings for each type of slideshow. Also note that if you use any slideshow other than the "Anything Slider" only "Image Slides" will be shown.

When creating an individual slide, the screenshot below shows where you choose whether that slide is an image slide or a content slide.

5) Homepage Slogan (optional)

You can put in a homepage slogan on your theme options page. This slogan should be plain text only as it will get inserted into < h1 > tags on the front end of your site. If you're looking for something fancier, with maybe some HTML and a call to action button or similar, you can use the Page Content block instead (item #7 below).


Alyeska > Theme Options > Homepage Options

6) Homepage Widget Columns (optional)

Here are columns of widget areas. You can put widgets here under Appearance > Widgets. Also, you can specify on your theme options page how many columns you'd like to display, or if you'd like to hide the section all together.


Alyeska > Theme Options > Homepage Options

Also, you can see in the screenshot below which widgets were actually used in the theme's live demo.

7) Homepage Content (optional)

This may not have been something that was apparent on the demo, however in a addition to showing a slideshow, slogan, and widget columns, you can also show the content from a page that you choose. With this page you could potentially use whatever shortcodes, HTML code, or content you want. Combining this with the fact that the slideshow, slogan, and widget columns can all be hidden individually, you can see the true flexibility of the homepage. So, get creative!


Alyeska > Theme Options > Homepage Options

8) Homepage Portfolio (optional)

Here you can choose to have portfolio items feed onto your homepage. This theme uses a custom post type called portfolio items that then get customized into a custom taxonomy called portfolios. You can learn more about that by watching the video on creating portfolios.

You can configure the basic options for the homepage as shown in the screenshot below. Additionally, you can set your sitewide portfolio options under Alyeska > Theme Options > Portfolios, and these options will effect the homepage portfolio feed, as well.

Alyeska > Theme Options > Homepage Options

9) Homepage Blog (optional)

If you have a blog set to show on your homepage, here is where you can configure some basic settings for it. This blog will function as a typical WordPress theme homepage blog. So, if you'd like to set basic settings like limit the number of posts, you can do this from Settings > Reading, as you would normally do.


Alyeska > Theme Options > Homepage Options

Here are columns of widget areas. You can put widgets here under Appearance > Widgets. Also, you can specify on your theme options page how many columns you'd like to display, or if you'd like to hide the section all together.

Also, you can see in the screenshot below which widgets were actually used in the theme's live demo.

In the default theme options, I've included a design credit and a sample copyright notice. It's always nice to leave some credit to the theme author in there, however you are, of course, allowed to change it to say whatever you like. This copyright notice can be altered under Theme Options > General Options.

If you'd like to add a menu to the footer of your site, you can do so by creating one under Appearance > Menus, and assigning it to the Footer Navigation theme location.

Standard WordPress Elements

This is a general video tutorial that will show you how the WordPress 3+ menu builder works.

Widgets and Widget Areas - top

Here's a quick visual overview of your Appearance > Widgets page after installing this theme.

Additionally, here is a quick glance at which widgets are used in the theme demo's two sidebars.

Writing Pages and Posts

Shortcodes - top

For examples of all the theme's shortcodes, visit the Shortcode section of the theme's live demo here:

http://www.themeblvd.com/demo/alyeska/features/shortcodes/

You can also easily insert all available shortcodes when writing your pages and posts with the simple click of a button.

This video will show you how to link an image or text link to a lightbox popup while using this theme.

Sample Code Reference:

<a href="URL TO FILE" rel="lightbox">Link Text</a>

This video will show you how to quickly create a gallery of images and show how they will utilize built-in lightbox integration with this theme.

Sample Code Reference:

[gallery link="file"]

Page Templates

Archives & Sitemap (video) - top

This video will show you how to setup your Archive and Sitemap pages. It also explains the benefit of why you would want to use these pages for SEO reasons. Google likes links!

Blog Style #1 - top

This page template will show all of your blog posts. Additionally the blog posts can be filtered, if you wish.

Blog Style #2 - top

This page template will show all of your blog posts. Additionally the blog posts can be filtered, if you wish.

Contact Page (video) - top

This video will show you how to setup your contact page with the provided template. If you're looking for something with more features, check out the Contact Form 7 WordPress plugin. Also, note that this video was made for the Stealth WordPress Theme, but implementing it is exactly the same in this theme.

Full Width Page (video) - top

This is a simple page template you can use in order to have a full width page that doesn't include the theme's sidebar.

This video will show how to setup a full-width page.

Redirect (video) - top

You may have noticed that weird Redirect page template, and may be wondering what it is and how it works? This video explains how this page template and works and why you'd want to use it for practical and SEO reasons.

Slideshows

Create Your First Slideshow (video) - top

This theme uses a custom post type "Slides" that you can then organize into "Slideshows" in order to accomplish an unlimited amount of slideshows throughout your website. This video will show you how it all works.

Using the [slideshow] Shortcode (video) - top

The last video showed you how to create slideshows. Next, this video will show you how to put those slideshows into any page or post with a simple shortcode.

Sample Shortcode Usage:

[slideshow category="your-slideshow-slug"]

See the Shortcodes section of the demo for a full overview of options.

Example Content Slides - top

When you're creatine Slides for your slideshows, you can designate a slide as a "Content Slide" and then the slide will be comprised of whatever you put into the content area. Below are some example HTML snippets for creating slides similar to this theme's demo.

Right Content

<div class="staged">

	<div class="alignleft">
		<img src="URL TO IMAGE" class="pretty" />
	</div>
	
	<h2>Right Content</h2>
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla libero,
	pharetra ut hendrerit eget, hendrerit vitae risus.
	
	[button text="Learn More" link="http://www.google.com"]
	
	[clear]
    
</div><!-- .staged (end) -->

Left Content

<div class="staged">

	<div class="alignright">
		<img src="URL TO IMAGE" class="pretty" />
	</div>
	
	<h2>Left Content</h2>
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla libero,
	pharetra ut hendrerit eget, hendrerit vitae risus.
	
	[button text="Learn More" link="http://www.google.com"]
	
	[clear]
    
</div><!-- .staged (end) -->

Full-Size Vimeo/YouTube Video

[video file="http://vimeo.com/11178250" width="940" height=350"]

Staged Vimeo/YouTube Video

<div class="staged">
  
	<div class="alignleft">
		[video file="http://vimeo.com/11178250" width="533" height="300"] 
	</div>
	
	<h2>Staged Video</h2>
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla
	libero, pharetra ut hendrerit eget, hendrerit vitae risus.
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla
	libero, pharetra ut hendrerit eget, hendrerit vitae risus.
	
	[button text="Learn More" link="http://www.google.com"]
	
	[clear]

</div><!-- .staged (end) -->

Staged Self-Hosted Video

<div class="staged">
  
	<div class="alignright">
		[video file="http://yoursite.com/uploads/video-file.mp4" 
		image="http://yoursite.com/uploads/start-image.jpg" width="448" 
		height="280"] 
	</div>
	
	<h2>Staged Self-Hosted Video</h2>
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla
	libero, pharetra ut hendrerit eget, hendrerit vitae risus.
	
	Lorem ipsum dolor sit amet, consectetur adipiscing elit.
	Nunc nec pharetra purus. Aliquam erat volutpat. Donec nulla
	libero, pharetra ut hendrerit eget, hendrerit vitae risus.
	
	[button text="Learn More" link="http://www.google.com"]
	
	[clear]

</div><!-- .staged (end) -->

Portfolios

Create Your First Portfolio (video) - top

This video will take you through how portfolio items and portfolios work with this theme.

Search Engine Optimization

SEO Plugin Overview (video) - top

This theme comes with a built-in SEO plugin for controlling your titles and meta information. This plugin is optional, as it can be activated and deactivated from your theme options panel. This video will run you through what the plugin does, how it works, and give you some basic SEO information.

Compatible Plugins

WP-PageNavi - top

This theme is compatible with the WP-PageNavi plugin, which allows for nice looking page numbered buttons to appear at the bottom of your blog or portfolios. The plugin must be installed separately in order to achieve the same look show in this theme's live demo.

All you need to do is download the plugin, upload it, and activate it. You don't need to adjust any settings. It will just work.

You can download the official WP-PageNavi plugin here: WP-PageNavi

This theme is compatible with the Breadcrumb NavXT plugin, which allows for breadcrumbs to be displayed throughout your site. The plugin must be installed separately in order to achieve the same look show in this theme's live demo.

All you need to do is download the plugin, upload it, and activate it. You can then configure it however you want on the plugin's settings page.

You can download the official WP-PageNavi plugin here: Breadcrumb NavXT

Customization tips

Using a Child Theme (video) - top

If you're wanting to customize your WordPress theme as WordPress intended, you should really look into using a child theme. This will make future updates to the theme much easier, and you can feel more safe that you're not actually editing any of the theme's core files.

This tutorial will show you how a child theme works.

Make Use of Bonus Content (video) - top

This theme comes with several pages of bonus content to get you started utilizing the theme's basic shortcodes and styling in your pages and posts.

This tutorial will show you how to quickly make use of this theme's bonus content.

How to filter a Blog Page (video) - top

This tutorial will show you how to specify certain categories to be used or not used on your blog pages.

How to use this theme as a classic blogging theme (video) - top

This tutorial will take you through how to use the blog page template as your homepage.

Keep in mind that this theme gives you the option to apply a blog to your homepage in conjunction with the other homepage elements. So, that would be a completely different approach form the method outlined in this video.

This video will take you from Photoshop to your WordPress admin panel, and show you how to incorporate your own logo into Alyeska.

How to show widgets on certain pages only (video) - top

Utilizing the Widget Logic WordPress plugin, you can make use of WordPress conditional tags in order to specify where widgets on your site will or won't show up at.

This video will show you how the Widget Logic plugin works.

How to hide theme options pages from your client (video) - top

It can sometimes be confusing for your clients to see author-branded theme options pages in the WordPress admin panel. Fortunately, with the ThemeBlvd WordPress theme framework, it's extremely easy.

This video will show you how to hide the theme options panels for a ThemeBlvd theme.

Sources and Credits

I would like to thank the following providers. This theme wouldn't have been possible without the hard work and dedication of all of them.

Once again, thank you so much for purchasing 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. If you have a more general question relating to the themes on Theme Forest, you might consider visiting the forums and asking your question in the "Item Discussion" section. And if you like the theme, please go to your Theme Forest downloads page and give this product a 5 star rating :-) Thanks so much!

Jason Bobich and Theme Blvd

Go To Table of Contents