TV Elements Theme Documentation

Installing Your Theme

There are a number of ways to install a WordPress theme:

- WordPress admin
- S/FTP
- Hosting control panel (cPanel used as a specific example)

The recommended installation method for most people is through the WordPress admin, though some theme updates may require the use of S/FTP or your hosting control panel. Instructions for all three options can be found in the Using Themes Codex article.

Managing Custom Menus

Modern WordPress themes include native custom menu support which allows you to configure your theme menus however you like in a convenient drag-and-drop interface. With a custom menu you can easily add custom links, pages, and categories to your navigation menu. Follow the instructions below for more information on how to create and mange custom menus.

1. Log into your WordPress Admin (e.g. yoursite.com/wp-admin), and navigate to Appearance > Menus.
2. By default your pages will be listed, so click 'create new menu' to begin setting up your menu
3. On the left you will see options to add 'Pages', 'Custom Links', and 'Categories' to your menu.
4. Once done, click 'Save Menu' to save your custom menu, then under 'Menu Settings' check the box beside your desired menu location.

For more information on custom menus please see the Appearance Menus Screen Codex article.

Importing Included Theme Sample Data

TV Elements includes sample data ( sample-data.xml ) that can be imported to populate a fresh WordPress install with the content you see in the theme demo. This is helpful for learning how the theme works if you aren’t comfortable starting from scratch.

1. Download the sample-content.xml file (right click and ‘save as’). The demo content file is also included in your root theme folder.
2. Log into your WordPress admin panel (yoursite.com/wp-admin). Replace ‘yoursite.com’ with your actual URL.
3. Navigate to Tools > Import, and then select the “WordPress” option.
4. Click “Choose File” to select the “sample-data.xml”.
5. Click “Upload File and Import” to import the sample data, following the on screen instructions. Make sure to check the ‘import file attachments’ option or else media from the demo won’t import to your site.
6. Once finished you can begin configuring your theme under Appearance > Customize > TV Elements.

TV Elements Options Setup

TV Elements is integrated with the WordPress theme Customizer (Appearance > Customize), giving you easy control over the theme’s various options:

Appearance > Customize > Colors

Here you will find TV Elements colors options. These include settings for the theme’s header text, background, and primary (font and link color) and secondary elements (headline text).

Appearance > Customize > Header Image

This option allows you to upload a header image (or logo) to the upper left portion of the TV Elements theme (where you see the ‘TV Elements’ image in the demo).

Appearance > Customize > TV Elements > General

This panel allows you to set the following options:

Header color. This refers to the background of the logo and menu icons. You will want to choose the ‘dark’ option if using light images in the header. The logo icon will display black(ish) or white depending on the option set here.

Display Site Description?. This option will show your site tagline beneath your header text if you are not using a header / logo image.

Default Featured Image. If you do not have a featured image assigned to your posts, then the image selected here will display instead. If you do not set this option, then no featured image will display at all.

Footer Text. This allows you to replace the footer (left) attribution text with your own.

Appearance > Customize > TV Elements > Featured Video

TV Element’s homepage features a large (self-hosted) video on desktop displays, and a featured image on mobile / tablet devices (that don’t yet fully support HTML5 video).

For the best results across all browsers and devices, include a video in each format (MP4/OGV/WebM), and a Featured Video Image.

This panel allows you to setup the following options:

Video MP4 / Video OGV / Video WebM. These are the supported video formats for your home page video. The process for uploading one is straightfoward. Once your video is in one (or all) of the formats above, navigate to Media > Add new in your WordPress admin panel to upload your video. Once uploaded, “Edit” the media file and copy the file URL path. Once copied, navigate to Appearance > Customize > TV Elements > Featured Video, and paste the file URL path in the appropriate text field. If desired, you can supply three versions of the video, one in each format.

Featured Video Image. You must set an image for this option before your featured video will display. This image performs two functions: (1) it will display on mobile / tablet devices in place of the video, and (2) it show initially on slower connections, and act as a fallback should anything happen to your video.

Featured Image Overlay. This option allows you to show an image on top of your featured video. It is the ‘Born to Roam’ text that you see in the demo. For best results ensure that the image you are using is 250px wide and 100px tall.

Appearance > Customize > TV Elements > Homepage

Here you will find the rest of your available home page options, which are as follows:

Featured Post. This option allows you to feature text from a selected post immediately beneath the featured video. To setup a featured post:

1. Navigate to Posts > Add New, and create a new post.
2. Add a title to your post, and enter text into the ‘Excerpt’ meta box beneath the main editor element. If you do not see the ‘Excerpt’ meta box, then you’ll need to click the ‘Screen Options’ tab to the top right of your browser window, and then check the box beside the word ‘Excerpt’.
3. When done, publish the post.
4. Navigate to Appearance > Customize > TV Elements > Homepage, and select the post you created to display on the home page.
5. Save and exit the customizer.

Latest Posts – Category. This option allows you to feature a category in the three column grid layout beneath the featured post. If no category is selected then all of your posts will display, with a header that reads ‘Lastest Posts’.

Posts to Show. Here you can select how many ‘Latest Posts’ posts to display on the home page. The choice is yours.

Appearance > Customize > TV Elements > Social Icons

This panel allows you to add links to your various social media profiles. Make sure that you include the full http:// (or https://) path when entering your URLs. Social icons will display in the footer (right). The following social icons are supported:

– YouTube
– Twitter
– Facebook
– Google+
– Linkedn
– Tumblr
– Instagram
– Vimeo

If there is a social media icon that isn’t supported but you would like to use, then please send us an e-mail and we can add it in for you.

Appearance > Customize > TV Elements > Portfolio

This panel allows you to select a particular category for your portfolio page template. This is necessary for the filters on the portfolio template to work. Please note that the filters are child categories to the category you select here.

Adding a Portfolio Page

TV Elements features a custom Portfolio Page Template that will allow you to choose a set of posts to feature in a filtered layout.

Adding the Portfolio Page:

1. Navigate to Pages > Add New, and create a new page with the ‘Portfolio’ page template assigned. Publish.
2. Navigate to Posts > Add New, and create posts with your desired title, content, categories, feature image (image should be 768×549 pixels), etc. Publish your posts when they are ready.
3. Navigate to Appearance > Customize > TV Elements > Portfolio to select the Portfolio Category that you would like to display on the Portfolio page that you’ve created. Please note that the filters are child categories to the category you select here.

Creating a Video Post

To create a video post (example here), follow these steps.

– Navigate to Posts > Add New, and create a new post.

– To show a video in the header, paste the URL for your video (Vimeo or YouTube) at the beginning of your post.

– To show a thumbnail image for this post on the home page, add a featured image to your post (image should be 768×549 pixels, see Featured Images). If you would like the image to be pulled automatically, then you can try a plugin like ‘Video Thumbnails’.

– Add your title, post content, categories and tags, and publish your post.

– Done!