Setup Tutorials for Preference

Welcome to the Setup Tutorials for Preference. These are the standard guidelines to help you install, configure, and customize your newly downloaded theme. If you have any requests for additional tutorials relating to this theme, please contact me and I will review your suggestions. These tutorials are also based on the assumption you have a basic understanding of how WordPress works.

Customize Your Showcase, Banner, and Header Area

December 24, 2013 |
|

Preference lets you customize some styles relating to the Showcase, Banner, and Header area (WP Header) of your page with a set of options for changing colours, backgrounds, and paddings. Although the showcase, banner, and header are sharing the same space, you can achieve a slightly different style for each one, primarily for the Showcase and Banner, as the Header is actually one that shares both spots. Showcase Style By default, there is a background and padding set for the Showcase Header which looks like this (with an image added) screenshot: The padding is the space that is shown around the image, but it also shows the background image that is used for this area which also has a background colour. Change the Showcase Padding Go to your Home Dashboard Click on the big blue button labeled “Customize Your site” or you can go to Appearance >> Themes >> Click…    read more 

Using the WordPress Header photo feature

December 24, 2013 |
|

Part of WordPress includes a “Header” feature that lets you upload and crop photos that you can use in a header of your page. Before in the past the header would have the site title and description on top of it and you were able to change the background of it. Well things have changed and advanced to a point that you can use the header in many ways, whereas for Preference, you get to use it as a type of showcase banner for your pages…normally used for the “Front Page” only. How to Find the WP Header Feature First, there will be two methods you can work with the WP Header feature: The first is clicking on the “Header” link in the left panel in your dashboard under “Appearance“. When you are in your dashboard, this is going to be the fastest way of accessing the setup of your…    read more 

Let’s get some Plugins so we can do what the Demo Site does

December 24, 2013 |
|

In most cases, themes from developers are often filled with a ton of plugins that are coded directly into the theme. Although great and convenient, there is a major caveat of doing this…several actually: The theme gets bloated with code Your theme might have plugins you will never use or want to use The plugins and scripts coded in the theme may not play nice with other third party plugins The plugins and scripts may not be compatible with upcoming versions of WordPress The more scripts and code, the more chances bugs and other problems will show up Benefits of Keeping Plugins out of Themes The user can choose what they want to use You get a much lighter theme (less code) More stable theme Much easier to update plugins than if they were coded into the theme Updates are left to the developers of the plugins If you change…    read more 

Create a Static Front Page and Move the Blog inside

December 24, 2013 |
|

For anyone running a simple blog, you may want your blog to stay on the default front page which is what WordPress does when you first install it. However, for anyone wanting a “Static Front Page” and to move the blog inside the site, this is easy to do. Part 1 – Create a Home Page and a Blog Page Go to Pages >> Add New Title your new page as “Home” or whatever you want If you plan on adding content, you can add it to the editor Select the template you want to use with the selector at the far right Click “Publish“ Now we are going to create another page, so click “Add New” again Title this page as “Bog” or whatever you want Leave the editor empty with no content and you won’t be choosing a template here (which is standard with WordPress) Click “Publish“ Part…    read more 

Customize your page background

December 24, 2013 |
|

Preference comes with a split page background where the top half is a solid colour (white) and the bottom half uses a combination background colour (grey) and transparent pattern image. In addition to this, the main content floats on top of this. However, you can change the backgrounds for the top and bottom half, although this will be done in three parts because one uses the WordPress background function, while the other (the top half) uses a theme custom option.   Part 1 – Let’s Change the Top Half First Go to Appearance >> Customize >> Click on the tab labeled as “Colors“ Find the setting for “Top Half Page Background” colour (default is white #ffffff) and click on the colour selector to open the colour palette Find the colour you want and see it in real time in the right window as you move the colour cursor around. When…    read more 

Setting up your main menu and other menus

December 24, 2013 |
|

Preference comes with three (3) predefined menus for you, although you can create more as you need them. Before you create your menus, you will have what is called a “fallback” menu which means when you install WordPress, you will get a basic menu of pages showing like this: However, for this theme, you have: Primary Menu – This is the main menu of your site and will be located at the top of your content page Footer Menu – This is the footer menu that is located at the very bottom of your page and just above the copyright notice Portfolio Menu – This is a special menu that performs like a typical portfolio filter, except it’s not quite a filter (more on this in the Portfolio tutorial) Again, I will assume you know the basics of WordPress, but I will go through the setup for this theme. Setup…    read more 

Change the copyright notice in Preference

December 24, 2013 |
|

Although the copyright notice displays a default one for Styled Themes, you can change it to your own, but only for the front-end of your website. Any reference in the source code of any theme file must stay intact. Right now the notice looks like this in the footer of your pages: Changing the Copyright Notice Go to Appearance >> Themes >> click on the text link “Customize“ Click on the tab labeled as “Basic Settings“ In the copyright field, remove the reference to Styled Themes and then enter your own in. Click Save & Publish NOTE: I would recommend not putting in html code into this field, such as links. You do not need a linked copyright to the site it’s on.  

Change the colours of Preference

December 24, 2013 |
|

One of the best features of Preference (and my themes) is that you can modify the colours of almost every element within your page(s) with a colour selector that is already part of WordPress. I simply added more colour selector fields based on what elements you can change to suit your own preferences. Go to Appearance >> Themes >> click on the Customize text link Click on the Colors tab in the left column For each item, click on the select field which opens the colour selector and move the circles around until you find the colour you want You should be able to see the colour changes take effect in the preview window to the right When happy, click on Save & Publish and then Close Move on to the next colour item  

Choose your blog layout style

December 24, 2013 |
|

You get a couple layout styles for your blog along with a few options with Preference. For Preference, you can have a left or right column (sidebars) blog layout, but you also get the choice of using a full sized featured image or a small image. To give you an idea what the image style sizes look like, I’ve provided a couple screenshots below:       Setting the Blog Featured Image Layout Go to Appearance >> Themes >> Click on the text link “Customize“ Click on the tab labeled as “Basic Settings“ Place a check in the box next to the “Small blog image” option, or if you want the default big image, leave it unchecked Click Save & Publish and then close   Setting the Blog Layout for a Left or Right Column   Go to Appearance >> Themes >> Click on the text link “Customize“ Click on…    read more 

Before you start uploading images, set your media sizes

December 24, 2013 |
|

The most annoying thing with WordPress is that they have a set group of dimensions for images already in place when you install WordPress. What happens when you upload a photo, you will get several thumbnail sizes created automatically – whether you want them or not. This is a major problem for many because eventually your host server will get filled with unused images which take up a lot of server disk space. You don’t see all your thumbnails except just one in the Media Library of your site’s admin. But, if you were to go to your “uploads” folder through your FTP, you will get a shock of your life when you see how many images are there. So…before we continue on with setting up Preference, we will change the default settings of WordPress so that this does not happen to us. Go to Settings >> Media In the…    read more