Design your own Affiliate Marketing WordPress theme

I’ve played around a bit at building my own WordPress theme after learning CSS and a little bit of PHP. Recently I  purchased a copy of “How to be a Rockstar WordPress Designer” from Rockable Press. It only cost around $30 and I spent most of yesterday reading it. I’m now really excited because I am quite confident that I am not very far off being able to build my dream affiliate marketing WordPress theme.

It’s not for total newbies, but if you have a smidgen of CSS and HTML knowledge then you should be able to knock up a theme fairly easily.

The book talks you through designing the mock up in Photoshop (I use Fireworks), putting it all together in Dreamweaver before importing into WordPress and adding a few final tweaks.

I’m going to get started right away, so I will add some basic tutorials as I learn myself.

Some tools I use when modding WordPress themes

Most of my websites are built in WordPress because it is so easy to use. There is almost no limits to the stuff you can do to make it look and behave exactly how you want to. Below is a list of some of the tools I use when modding a WordPress theme -

Two books that have been indispensable to me when messing around with a theme are -

CSS: The Missing manual and WordPress Theme Design

If you really want to change the look of your site, then I strongly recommend that you learn some CSS.

The Web Developer’s Toolbar for Firefox is one of those gadgets that once you have used it you will not be able to imagine how you got on with out it. It’s just wonderful. Especially the “edit CSS” function that lets you play around with a sites CSS without changing any code. It is also a great way to learn CSS by trial and error. I also like the color information function that brings up all the hex code for the colour on any selected page.

Which leads me nicely onto the Kuler website. Have you seen it? If not get on over there immediately and have a play. It is a wonderful site that lets you come up with some beautiful colour combination’s as well as browsing thousands of others submitted by users. It also allows you to save combination’s which can later be imported into graphics programs like Photoshop, Illustrator and Fireworks.

It’s attention to detail that make websites stand out from the rest, and I am surprised at the number of large sites that don’t even have a favicon! I know it’s not the be-all and end-all but it takes literally a couple of minutes to make one. A couple of seconds if you use the FavIcon Generator.

The RawHTML plugin allows you to add, well – raw html into your blog posts. I like to create price comparison type tables in dreamweaver and paste them into my site. Here is an example from my effects pedals website that I am building.

These are some of the tools that I use when modding WordPress themes. Good free themes can be found here and here.

All I need now are some tools to inspire me to write good content!


Oh money, money, money!

I’m generating a few sales through my affiliate sites using organic SEO efforts but I’m rapidly running out of money!

I have been seriously considering getting a job!

Another option would be to find some self employed work as a web designer. I’m talking about small, basic websites for local businesses. I was thinking about knocking up some business cards, putting my suit on and trying a bit of cold calling (I used to work in direct sales).

Ive already got a Re-seller hosting package with Heart internet and I’m pretty nifty with Dreamweaver. It can’t be that difficult to get work can it?

It would be great to hear what you think about this. have any of you tried it?

If I could earn an extra couple of hundred quid a week I’d be happy.

The fastest way to add affiliate products to wordpress

I use WordPress for most of my affiliate websites as I find it just as quick to publish something in WordPress as it is to knock something up in Dreamweaver.

I have been looking for ways to get datafeeds into WordPress. Something that is preferably free and stable. I have yet to find the perfect solution but the nearest I have got is the CSVtoPost plugin by Zac Preble.

So I’m still adding items manually. The challenge then is to find a way to identify relevant products and publish them to my site as quickly as possible.

As I use Affiliate Window a lot, I was chuffed to bits when I heard about the Affiliate Window Deeplink builder for Firefox. This tool lets you go directly to a merchants website, locate a product and create a deeplink with the click of a button.

So what I have done is knock up a basic wordpress site using a modified css theme from here and added some custom fields.

Custom fields are a great way to customize WordPress and the possibilities are almost limitless.

So publishing a new product to a wordpress post can be done in a minute or so. It’s as easy as this -

  1. Locate item on merchants website and get deeplink details
  2. Create new post in WordPress
  3. Add image url to custom field called “image”
  4. Add price to custom field called “price”
  5. Add deeplink url to custom field called “deeplink”
  6. Copy and paste or preferably compose description and add to main text field

Adding Custom Fields to your WordPress blog

I admit to not knowing much about custom fields but through trial and error I have managed to get them working ok. I am going to show you how I did it but please bear in mind that there could be easier ways to do this. This is just the way that works for me.

N.B - If your a newbie like me then it is a good idea to back up your theme first.

Firstly I go to the functions.php and I add the following code -

function image_attachment($key, $width, $height) {
global $post;
$custom_field = get_post_meta($post->ID, $key, true);

if($custom_field) { //if the user set a custom field
echo ‘<img src=”‘.$custom_field.’” alt=”" width=”‘.$width.’” height=”‘.$height.’” />’;
}
else { //else, return
return;
}
}

function price_attachment($key) {
global $post;
$price_field = get_post_meta($post->ID, $key, true);

if($price_field) { //if the user set a custom field
echo $price_field;
}
else { //else, return
return;
}
}

function deeplink_attachment($key) {
global $post;
$deeplink_field = get_post_meta($post->ID, $key, true);

if($deeplink_field) { //if the user set a custom field
echo $deeplink_field;
}
else { //else, return
return;
}
}

That sets up three custom fields called “image attachment”, “price_attachment” and “deeplink_attachment”

Then I go to my index.php and where I want my thumbnail image to appear I add the following -

<a href=”<?php deeplink_attachment(‘deeplink’); ?>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php image_attachment(‘image’, 80, 80); ?>
<div> <span>MORE INFO</span><br />

This displays a thumbnail image of the product with a link to the merchant. The image size is 80 x 80px but can be changed to suit, as can the text.

Then wherever I would like the price to appear I insert -

<?php price_attachment(‘price’); ?>

That’s all the code I’ve done. As I say – please don’t criticize it, im a newbie and still learning!

Getting products from merchant site onto my homepage

First of all, I will navigate to my selected merchant’s website and find a product that I wish to promote.

On the product page I will click on the Affiliate Window Deeplink builder to generate the link.

I then download the image and upload it to a file on my site called “images”

Go to WordPress and create a new post. Enter the title ie the product name and a short description. This can be copied from the merchant but it is always better to write your own for SEO purposes.

Scroll down to the “custom fields” section and create your new fields “deeplink”, “price” and “image”.

Paste the deeplink info into the deeplink field the price into the price field and the url of your uploaded image to the image field (eg – www.mysite.com/images/product1.jpg

Click publish and your done! <————hopefully

This is something that I am still working on, so if any of you would like to offer me any help or advice please contact me. I set this blog up so that all us newbies can help each other :-)

Here is my template in action – Funny Gadgets

It is still work in progress so I can’t guarantee what it will look like when you click on it.