Tag: Web Development

How To Create A WordPress Widget Area

Posted on by Chris Cook

To create or add additional WordPress widget areas or sidebars to your WordPress website or theme its as simple as adding some code to your themes functions.php file. Now, as I always say you will first want to make sure you are editing your child theme (if using update-able theme) and if you do not have one then i recommend you create one.

Once in your theme, edit your functions.php file and add the code below. This will add an additional widget area to create a new or secondary sidebar you can use anywhere on your site. once saved you should now see the new widget area under appearance / widgets.

Now that you have created a new widget area you can place the widget area anywhere in your WordPress theme be using the example below.

To place your new sidebar or widget area in your theme using a shortcode, checkout the amr short code any widget plugin.

Happy Coding!

How To Add A Favicon To Your Website

Posted on by Chris Cook

What Is A Favicon?

A Favicon is a small image that is used as a websites favorites icon. Favicon’s help users find your website in favorites or bookmark bars by quickly recognizing the favicon. Usually company’s will use their logo, abbreviations or something specific to their brand.

favicon-what-is

A favicon can be created as .ico, .gif or .png image files and are 16×16 pixels in size.

Where To Place The Code

Traditionally favicon’s are placed in the root folder of your website (http://example.com/favicon.ico) because almost every browser will look in the root for a file named favicon.ico, but you can place your favicon in any folder as long as you add an HTML link in the sites <head> and have the correct image location (yourwebsite.com/images/favicon.ico).

Here is an example of the HTML code you will want to place in the head section of your site, usually placed below the <title>. Copy the code and paste into the head of your document and replace the .png file name and location with your own.


<link rel="shortcut icon" href="http://example.com/favicon.ico" />
<link rel="shortcut icon" type="image/png" href="http://example.com/favicon.png">

Happy Coding!

How To Create A Child Theme In WordPress

Posted on by Chris Cook

Many people using WordPress have heard the term child theme, or have come across themes that utilize child themes but might not understand what a child theme really is. I will explain this in simple terms and how to create one when developing and or customizing your theme.

What Is A Child Theme?

A child theme is a miniature version of your main theme, but WordPress will use whatever files that are in your child theme folder before your main theme. This gives your child theme hierarchy, this is why you always want to use a child theme when customizing. For example, lets say you have been working on customizing a theme you purchased from themeforest.net and after weeks of customizing and countless cups of coffee, the theme decides to roll out an update. You say “Sweet” and without thinking quickly update the theme and cannot wait to see the new changes. Then a few minutes later , you find that the update wiped out all of the changes you made because the update overwrote the theme files you have been tweaking to your liking, Ouch.

By creating a child theme, you create a set of separate files that you can use to customize the theme without ever affecting the original theme. Not only does this make updating a theme stress free, it also makes sure that you will never ruin your original theme as you are never actually modifying those files.

Quick & Easy Child Theme

The quickest and easiest way to create a child theme is to use a plugin, and the plugin I prefer to use is One Click Child Theme or Child Theme Wizard. The plugins are very easy to use, and will give you a simple child theme structure to build upon. Some other plugins I have used are just not as simplified and straight forward as these.

Simply download the plugin, install and activate. Next you will use the plugin to name and create you child theme, but make sure you activate your new child theme before starting any customization.

Note

You will copy any files that you will be editing from your original theme, into your child theme. Remember that WP will check for files in the child theme first, then the original theme if the needed file is not found. This gives the child theme authority over the original theme when the child theme is activated.

Tip: If you are not sure what file to edit, use the plugin What The File to find out what file is being used on every page.

Child Theme Resources