Guide: Configuring your wordpress theme

Written by Luke on May 14th, 2011. Posted in Wordpress

Once you have wordpress installed you will no doubt want to alter the theme layout, ensure it is displaying your own logo, and generally rearrange widgets, menus and other aspects of your site.

In this tutorial, I will be setting up theme for my new niche site TVTycoonGames.com.  I have always had a somewhat strange passion for simulation games in which you manage or run a television station.  There are only a handful of games out there, and I’ve never seen a centralized list of them all before.  I thought I would create a small review site, and my keyword research seemed to show these keywords were the best available given the number of searches compared to the competition for these keywords.  I will post a tutorial on keyword research using Market Samurai in future.

1. Finding Your WordPress Theme

There are many wordpress themes available – mostly paid, but quite a few free ones.  While I plan to use the free theme AdCents in this tutorial, I feel I should just give a quick few words of warning when it comes to using free themes-

Some free themes include links to third party sites (usually related to the developer of the theme) which either cannot be edited or removed, or may be very difficult to do so.  Generally speaking as well, free themes may not be as customizable as paid ones.

If you are planning on seeking out a paid theme, you can pick them up relatively cheaply, and there are several options for doing so.  First, you could have a completely custom theme designed through a service like oDesk, or 99designs.  Alternatively, you can utilize professionally designed themes, which although not custom, are less likely to be found on 25,000 other websites, like some of the free themes.  These themes can generally be purchased either individually, or by joining a template club (with a monthly or yearly fee) which gives you access to all of that company or designers themes.

 

2. Installing Your WordPress Theme

Step 2A: Once you’ve found the wordpress theme you want to use, or test – and have downloaded the zip or rar file of the theme you want to use attempt to unzip or unrar the file.  If it simply unrars a folder, which contains (either in it or in a single subfolder) a bunch of php files and other folders such as ‘css’, ‘images’ ‘includes’ and so forth, then you can simply upload the file you have unzipped.  However, if the zip file contains more zip files then you will need to upload the zip file which includes the ‘css’ ‘images’ ‘includes’ and other folders as well as the themes php files (such as header.php, index.php etc).  Sometimes, the other zip files may contain things like the themes image source files, so that you can use these to edit the theme – but that is getting a bit complex for this tutorial.

Step 2B: Making sure you have found the right zip file to upload, log in to your wordpress administration dashboard – likely at yourdomain.com/wp-admin/.  Once logged in, select ‘Appearance’ from the left hand pannel, then ‘Themes’.  Now, from the top tabs choose ‘Install Theme’, which will probably be grayed-out.  Under that tab, will be the options ‘Search’, ‘Upload’, ‘Featured’ etc, from which you should select Upload.  Then hit ‘Browse’, select the correct zip file ascertained in Step 2A, and then click ‘Install Now’.

With any luck, you won’t have received any errors – if you did it is possible you did not obtain the right zip file outlined in Step 1, the zip file is corrupted, or the theme is perhaps incompatible with the version of wordpress you are running.  Click ‘Activate’.  Now, your current theme should be displayed, with ‘OPTIONS’ including ‘widgets’, ‘menus’ and perhaps a third option – ‘theme settings’ or something to that effect.  If you do have a theme settings option, click on that now

Step 2C (depending on your theme):  Most, but not all themes include at least a basic theme options page.  If it includes this it will appear within the administration pannel in one of a few likely places.  This may appear under the Appearance menu on the left-hand pannel, or an entirely new menu option may be created.  Alternatively, the theme options page can usually (but not always) be accessed via Appearance > Themes, where under the current theme it lists the options available.

Depending on the complexity of this theme options/setup page, you may be able to enter the URL or upload a new logo image, set the Alt text and in the fancier themes even alter the style, colors and layout quite dramatically.

Because this options page varies depending on the theme, it is essentially impossible to write a guide that is applicable to all of them.   Generally, the options are relatively self-explanatory.  However, where something is not made clear, you can always play around with the settings – save them – then explore the frontend of your site and take note of the changes (if any).

3. Integrating your Logo into the theme

There are several approaches to including your logo in the wordpress theme, and modifying the theme so that it displays your logo.  Here are the three approaches, with the easiest and fastest methods appearing first.

First, if your theme does have a theme settings page, the logo image can often be either uploaded, or the URL to the image file can be entered to quickly update the logo.  Sometimes, you may also be able to update the favicon .ico file.  The favicon is the small icon displayed next to your site’s address in the address bar, left of the page title in your browser tabs, and also appears next to the page title in your bookmarks.  You can easily convert a gif or png image file to a .ico using this handy tool.

This is the approach that worked using the free AdCents theme for my niche site TVTycoonGames.com.

Second, if you can locate the image of the logo displayed by default within the zip file you uploaded, then you can replace this within the zip file, or rezip the unzipped file structure.  Then reupload the theme (after removing it if you have already installed it).  Alternatively, using an FTP tool (I use Core FTP LE), you can browse to wp-content/themes/the-name-of-your-theme and replace (or overwrite) the default image.

Third, is probably a better approach to the second method, for SEO reasons.  By having the image of your logo named to include some of your core site keywords, this can improve SEO.  To do this, you must locate within the .php files of the theme where it calls for the default image to be displayed.  Thus, first find the files name.  Next, under Appearance > Editor select ‘Header.php’ from the right hand side.  Using your browsers search function enter the name of the default image.  If you have found it, replace the name with the name of your own logo file – upload the file to that location – and save your changes to the .php file.  However, this may not be located within header.php, and depends on the theme – some other obvious files to try are index.php, but you may have to go through and search the contents of each one.

Note, if your theme does not use a logo image by default, but rather uses text – this option may sometimes be changed within the theme’s settings page.  Alternatively, in some themes this can only be changed by editing the .php files.

 

4. Configuring Your Footer

In your footer you may want to include a number of things, from a copyright notice to links to various pages – such as your about page or privacy policy.  Depending on the theme you are using, this can be achieved in a number of ways.

First, from within the theme option menu a footer option may be available allowing you to insert HTML code for your copyright notice – and even (if there is enough room) – a few links you could write in HTML if you are familiar with this or using something like an online demo of tinymce to create the html code for you.

Second, if the theme has a footer widget or any widget that appears in the footer area (irrespective of its name) you may place widgets in this area to create your footer.  You can use a simply ‘Text’ widget to insert text for your copyright notice, or links.  Alternatively, there may be a different area for you to place links in a widget – which can be achieved using either a ‘custom menu’ widget, a ‘links’ widget or again simple HTML code inside a ‘text’ widget.

Third, and as a last resort – a footer can usually be added by editing the footer.php file.  This can be done within wordpress from the ‘Editor’ link on the left menu, nder Appearance.  It may take some fiddling to work out where in the footer.php file you will need to place your code.

5. Other things to note-

Using ‘Links’ to create menus and links

This is not the preferred method for creating menus, but is another option.  Within ‘links’ create a category, and then create links associated with that category.

Now from within Widgets (under appearance), add a ‘links’ widget, and select the category you just created and associated links to.  You should be able to move the widget to various widget areas (depending on your theme) and have the links display on diferent places on the page.

 

Using ‘Menus’ to create menus and links

The newer versions of wordpress come with a built-in menu system.  From the menus screen (under appearance) create a new menu.  Ensuring the tab for the menu you just created is selected, add some links to the menu from the left.  Now save your menu.

From within Widgets (under appearance) drag a new ‘custom menu’ widget to one of the widget areas on the right.  Now within the custom widget’s settings select the menu you just created and click save.  The menu should now be viewable on your webpage.

Please note: Since this guide was written, the theme at TVTycoonGames.com has been significantly changed and now utilises a commercial wordpress theme.

Guide: Setting up a Blog or Site with WordPress

Written by Luke on April 24th, 2011. Posted in Wordpress

While there are many content management systems (CMS) out there, there are a few core frameworks which are perfect for particular kinds of sites.

For example, for a large site – or a portal kind of site – content management systems like Joomla, or Drupal are perfect.  They provide out-of-the-box for various types of layouts, and both come with many different plugins and addons.  In the future, we plan to implement sites using these systems and will post guides here when we do.

However, for a simple site or blog – which is the best place to start – wordpress is arguably the best CMS.  It is certainly the most used, with millions of blogs and sites on the internet hosted using the wordpress system.  There are plenty of themes available freely, or paid.  These can be customized relatively easily, and we will cover this to some extent.  Alternatively, for a completely custom look developers and graphic designers can be hired through various online services such as oDesk or Elance.

Step 1: Domain & Web Hosting

In order to startup a blog or site which you can monetize and hopefully make money from, you will need a domain name and professional hosting.  While there are various free hosted solutions out there, they are generally already supported by advertising or limited in the extent to which you may customize them.

 

Web Hosting

For web hosting, I would recommend BlueHost $6.95 unlimited account for several reasons. Its unlimited in terms of storage, bandwidth and the number of domains you can host on the account – making it the perfect hosting for all of your online ventures and startups. Also, it comes with cPanel, which is a powerful tool for managing your websites, domains, subdomains and so forth. It also comes with a great scripts installer, meaning it is as easy as pie to install content management systems like WordPress, Drupal, Joomla and many others I will be using for my online startups and providing guides for in the process.  It also comes with a free domain name.

 

Domain Name

There are various domain registrars out there, our current favourite is name.com.  However, if you are using a BlueHost account you will get to register a domain free when signing up for your web hosting account.

There are some great tools out there for selecting your domain name, but if search engine ranking and keyword optimization is important to you – for instance, if you are planning on developing a niche site – then it is  imperative that you have the keyword you are targeting in the domain name.  For finding the right domain, Domain Samurai is a great free tool. The same company also offers a free trial of Market Samurai which is an indispensable and more in-depth tool for finding the right keywords to target when creating niche sites, filtering out the markets penetrated with heavy competition, and allowing you to focus on a market where a first page search ranking is attainable.  Alternatively, the free keywords tool in AdSense can be used to find markets to target, as can a simple google search.

Some other tools for finding domain names, and even business or blog names are great for a simple site, but will not generally help in search optimization or attaining a high search result.  These include a variety of domain name generators, web 2.0 name generators, and domain search tools, the list we are compiling is available here.

Once you have a domain and web-hosting, you’ll be able to move on to the next step.. installation.

 

Step 2: Installing WordPress

Log in to your web host’s control panel.

If you are using BlueHost then go to ‘Simple Scripts’, located under Software/Services.

If using BlueHost, from your cPanel select 'Simple Scripts'

If you are using other web hosting with cPanel, a similar scripts install program may be available under the names of ‘Softaculous’ or ‘Fantastico’.  While we will not be covering installation of wordpress with these install scripts, they will present many of the same options as installing via simple scripts with BlueHost will.

Now, from within simple scripts (or an alternative install program) select WordPress under the Scripts List.
From within simple scripts select 'Wordpress'
Then hit install-
Then hit install

Next, you will see a page similar to the following.

  • Under Step 1 select where you would like to install wordpress – your domain should be one of these options.  Leave the box after the / empty, unless you would like to install wordpress to a particular folder, for instance mydomain.com/blog.
  • Then, under Step 2 ‘click here to display’ the advanced options.

 

Under the advanced options, you should receive the following.

  • Give your blog a name – this will be the title of your home page, and depending on your configuration later will generally also appear on other pages.
  • Create an administrator username and password – with this you will log in to manage your site, post blogs and create pages.  This username will generally appear as the person who has ‘posted’ most of the content on your site, although other user accounts can be setup from which you can blog.
  • Click to agree to the terms and conditions.
  • Hit complete!

WordPress will a few seconds to install-

Then, you should receive a page signifying your install has been completed.  Two links should be provided.

  • Here, the first is the link to your new site that the public and everyone else will see.
  • The second – something like yourdomain.com/wp-admin/ – is the link to your administration panel, from which you can change the site settings and make posts.

Congratulations! WordPress has been installed.

 

Step 3: Administration Area Layout

Before logging into the administration area I would like to explain one key concept when it comes to wordpress.  Content in wordpress is generally divided into two types: Posts and Pages.

  • Posts are your normal blog post, are generally dated, contain the authors name and appear consecutively (with the newest at the top) on the ‘Home’ page, as well as the pages for the categories to which the posts were marked.  These posts can generally be commented on.
  • Pages are more like static pages, in that they contain a simple page, generally undated and without an authors name.  They can be easily configured to appear differently to the blog pages, for instance without the usual sidebar appearing.  Thus these are perfect for your content which should not appear in a news-like format, such as your ‘About Us’ pages, and pages containing policy information and so forth.  These pages cannot generally be commented on.

Now log in.  The administration area can seem a bit daunting at first.  However, this part of our guide aims to make grasping it a simple task.

When you first login to the administration area, you should arrive at the dashboard.
In the left hand column, you can view a count of posts, pages, comments etc.  Next down you can view recent comments, and one box down again a handy list of blogs that have linked to your blog.  You can also view plugins, and the latest news from Yoast.  Yoast provides some Search Engine Optimization plugins for WordPress, but we’ll cover that more in our later posts on SEO for your wordpress site.
In the right hand column, QuickPress allows you to quickly make a blog post, and beneath it recent drafts can be viewed.  Underneath appears the latest from the wordpress blog, and other wordpress news.

Now, on the very left you should notice the main menu for the administration area.

  • Posts is where you go to make, edit or draft blog posts.  From here you can also manage the categories and subcategories in to which you will place your posts.
  • Media allows you to manage images and videos that have been uploaded, which can generally be done when making or editing a post or page.  For now, it is not too important.
  • Links allows you to make links and categories for those links, which will appear in widgets (kind of like boxes on the right or left hand sidebar(s)).  Again, not too important for now.  If these links appear on your site, which will depend on what theme you are using and which widgets you have selected, you may delete or change them from this menu.
  • Pages allows you to create, modify and draft static pages.  As mentioned above, these are perfect for content that you do not want to appear in a blog or news-like manner.  You will see when editing a page, on the right under Page Attributes, you can alter how the particular page appears.
  • Comments allows you to view existing, pending, spam, or trashed comments.

In the next section down-

  • Appearance allows you to change several things.  First, from here you can install different themes. Plugins gives you the option to install new plugins or manage the settings for existing ones.  You can also deactivate and delete plugins from here.
  • Users allows you to manage the registered users on your site.  You can create new users here for friends, colleagues etc.  You can also edit your profile from here, if you want to change your username, password
  • Tools will appear here. By default there are only 2, ‘Post This’ and ‘Categories and Tags Converter’.  Both can be quite handy, so take a look.  Just drag the press this link to your bookmarks, then when you come across something you’d like to blog about, highlight it and click your ‘Press This’ bookmark.
  • Settings is your first stop for editing most of your core site settings.  A variety of settings are broken down into further menu options- Settings > General > allows you to change everything from your site’s title, through description, address, contact email, date/time format and more.
    • Settings > Writing > manage the size of blog posts, whether to convert emoticons :) to images, as well as options for writing posts and submitting them via email or otherwise remotely.
    • Settings > Reading > allows you to change how your front/home page appears.
    • Settings > Discussion > allows you to manage your comment settings, such as whether comments require approval, whether users must be registered etc.
    • Settings > Media > set your default image and thumbnail sizes, default upload folders.
    • Settings > Privacy > select whether to block search engines from viewing your site.
    • Settings > Permanlinks > a key to Search Engine Optimization.  Soon we will be posting a tutorial on SEO for wordpress.
    • Finally, other settings options may appear for a variety of plugins you have installed.