With the latest update of ClickBump 5, the WordPress theme that runs ClickBump Express, Express with JumpStart Pro and BizLocal, I’ve integrated full support for Google Web Fonts via point and click. Here are a few examples to give you a quick taste of what this is all about…

Above: “Magnetic” template skin using google web font: “Kreon”

Above: “Gadget” template skin using Google web font “Annie Use Your Telescope”

Above: “BlackJack the Ripper” template skin using google web font: “Nosifer Caps”

If you are unfamiliar with Google Web Fonts, a bit of background on the current state of fonts on the web

99% of all websites use one or two of only a handful of “Web Safe” font families. These are the 6-10 fonts that are common between Macs and PCs and include fonts like Arial, Times, Courier, Verdana, Georgia, and a few others. The reason for this is that prior to this development web pages were limited to only using those fonts installed on your computer (or tablet, cell phone or other device) when viewing web sites. So, If you didn’t have the font that the site designer specified, the site could render in a manner that the designer did not intend. This could result in adverse layout or readibility issues when interacting with the site.

Modern browsers support for @font-face make Google Web fonts possible

With the enhancements of modern web browsers, including Google Chrome, Mozilla Firefox, Apple Safari, Opera and Microsoft’s IE7-9*, and specifically, their support for web fonts in the form of the @font-face CSS property, designers can now specify almost any font they wish, taking the web one step closer to the design asthetics of the print world, but with all the advantages of the interactive medium that is the web. *interestingly, IE has supported @font-face since 1998

In short, this is a huge, watershed moment for web design and usability. Not suprisingly, Google has taken full advantage of the opportunity by offering a freely available library of over 270 designer quality web fonts (and growing) that web site owners can use in their sites.

ClickBump 5 is one of the first WordPress themes to integrate Google Web Fonts without need of a Plugin and without requiring code copy and paste

Take a look here at Google’s Web Fonts Viewer to check out all thats available for you right now on your existing web sites running ClickBump 5.

Ok, now that you know what Web Fonts are, let me introduce you to one of the coolest new enhancements to the ClickBump theme, perhaps since I introduced the automated ad rotation feature:

I’ve integrated Google Web Fonts in a very big way. You don’t have to use them, but if you would like to take advantage, you can dramatically improve the look and feel of your web site, with just a couple of mouse clicks. There is no code to learn and nothing to copy and paste!

Just go to “ClickBump 5 > Misc > Headline Fonts” and click “Enable”. Then, choose a font from the Google web fonts pulldown menu and you will instantly see a preview of a line of text set in that font. When you find one you like, just click “Apply Changes” and preview your site. That’s all there is to it!

You will see that your Site Title, Tagline and h1-h6 level headings are automatically drawn in the font you’ve chosen.

You can also specify a letter-spacing value if you would like to extend or condense the font to best suit your tastes.

Have fun with Google Web Fonts and please give me your feedback here on what you think of this exciting new feature. Here are a few more examples:

Above: “Blue Halloween” template skin using Google Web Font: “Eater Caps”

Above: “CTR-Plus” template skin dressed in Google Web Font: “Cuprum”

Above: “Amaze” template skin dressed in Google Web Font: “Oswald” (my personal favorite)

Above “Velocity” template skin dressed in Google Web Font: “Nova Slim“

NEW: Live Demo Site for Magnetic

Warning: This template package will give you a completely UNFAIR advantage against others in your niche. If you are sensitive to the feelings of your competitors, read no further.

But, if you want to crush the competition with one of the most unique and “Sticky” WordPress premium templates available anywhere, read on.

“Magnetic” Premium Skin for ClickBump 5

Today I’m releasing the ClickBump “Magnetic” 8-in-1 template/skin pack. All 8 templates feature a “magnetic” menu across the top which holds the site menu (featuring WordPress new “Custom Menus” that combine posts, pages and categories into a single menu complete with flyouts) as well as the ClickBump exclusive Google Search widget.

The unique thing about it is that this menu stays anchored at the top of the user’s browser while they scroll down the page. This means that your site menu, and most importantly, the Google search widget, is always in view and accessible. That alone would be enough to boost CTR, but there’s much more to magnetism than stickyness. These templates are designed to give a sense of depth and dimension to showcase the main ad block like never before. This one really makes the ads Pop!

Like all ClickBump premium templates, all 8 skins in the magnetic 8 pack feature clean, SEO optimized, w3c-validating html5 compatible markup for some friendly Google love.

With the “Magnetic” template pack, I’ve taken it a few steps further. Each template has a unique background image. The background image gives the template its unique look and character. “Smile” for example, resembles a smile. “Clouds” features a unique 3D parallax effect that makes the clouds appear to part when the user scrolls the screen (video demo to come, you really have to see this to appreciate it).

Here’s a preview of a few of the template/skins available in this pack (click the images for full size previews):

“Magnetic Smile” Premium Skin for ClickBump 5 – Greet your visitors with a smile

“Magnetic Helix” Premium Skin for ClickBump 5

“Magnetic Uncorked” Premium Skin for ClickBump 5 – Care for some bubbly?

“Magnetic Chill” Premium Skin for ClickBump 5 A crisp fresh look to entice your viewers to stay longer

“Magnetic Helix Too” Premium Skin for ClickBump 5

All skins in this series are hand-crafted with a unique blend of cutting edge CSS design (including a few tasty morsels of CSS3 background, shadow and border effects for modern browsers), html5 compatibility, as well as the ability to morph into any color scheme you can envision, using the ClickBump 5 point and click color options.

You could literally build hundreds of unique looking websites with this template pack

Just add your unique custom headers, logos and your matching color options to create an infinite number of designs to suit your tastes.

You can easily add a custom header graphic (to replace the default avatar character) and I’ve included a layered .pxd file with the package so that you can easily create your own custom header image to make this your own. You can open the .pxd image at pixlr.com, edit it, then save it as header.png for uploading to your site. If you don’t care to use a header graphic, you can easily disable the header graphic with one click at “ClickBump 5 > Images > Header Image > Disable”

The template also features a vast array of color customization options. Here is the help overlay that you will see at “ClickBump 5 > General Settings > Show Help” (click the image for full size preview)

By default, the color values are preset to match the examples. However, you can easily customize these colors, along with the header image to instantly transform this template into your vision. As you can see in the screenshot below showing ClickBump 5′s point and click color swatches (1-4) that you will use to set those colors:

Adding the ClickBump Google Search Widget to the template

At the top right corner of the screenshot, you can see the Google Search Widget, specially formatted and anchored to the top right corner of the template’s header area. Its a snap to add this to your ClickBump enabled site.

1) Go to “Appearance > Widgets” and drag “Google Search Widget” (a ClickBump 5 exclusive widget not found elsewhere) over into the widget area labeled “Sidebar“. Once you’ve done that, it will look like this:

As you can see from the screenshot, I’ve already pasted in all of the default script for you. All thats left for you is to place your Adsense Pub ID into the space provided. You’ll get this from your Google search widget code at your Adsense dashboard. You can also see that at the bottom of the widget panel you have even more control over where the widget appears on your site via the “Widget Visibility” panel, another ClickBump exclusive. You can selectively show/hide the widget depending on whether its being shown on the home page, on posts, on pages, on category pages, on the search page, on 404 pages or on tag pages. No one else gives you this level of control right out of the box.

Adding Your Ad Code to the template’s Main Content Ad Area

To add your Main Ad code to the template, you have two options (for Adsense), you can use your Adsense Client ID and Slot ID or you can paste your entire Ad code block. I’m using a combination of both in my example, so that I can rotate ads between the two. However, you can use one or the other. Of course, you are not limited to Adsense. You can use ANY AD NETWORK, such as Chitika, Amazon, Ebay, ClickBank or whatever. Just paste your Ad code or script into the spaces provided at “ClickBump > Ads” and you are all set to go with global control over your ads.

To enable the stacked 336×280 ads as you see in the screenshot, open your site’s admin dashboard and click on the theme options panel (ClickBump 5). Once you have that open, just click on the “Ads” tab and click the “Default to Stacked Ads” option and paste in your Google Client ID and Slot ID for your saved large rectangle ad like so (click the image for full size preview):

Note that I have a few extra options selected in my example. These are all optional (as all of the ClickBump 5 settings are). By placing ad code into the “Alternate Ad Code” block, and checking the “Turn on Ad Rotation Script” option, I’m enabling ClickBump 5 to rotate the ads that the viewer sees between the Adsense main ad (the one I’ve specified at the top with the Client ID and Slot ID) and the “Alternate Ad Code”.

What’s cool about this feature is that I can place ANY ad code I want into the “Alternate Ad Code” box, and I’m not limited to Adsense. I can, for example, rotate between my stacked 336 Google Adsense blocks, and a high commission ClickBank product with affiliate link (or whatever). You get the idea. This is very powerful.

Adding Custom Menus to ClickBump 5 Templates

The Magnetic series (and almost all premium templates) is pre-configured to present the WordPress custom menus as you see in the screenshot, with the current post or section automatically highlighted. It also will display any posts you’ve flagged with the top-menu category and place them in the blue bar across the bottom portion of the header area. If you built your site with JumpStartPro!, the installer automatically created a custom menu for you. However, if you did not, click on “Appearance > Menus” to create and configure your menu similar to this (click the image for a full size preview):

The custom menus are flyout enabled, so that if you drag and drop them under one another, they will automatically orient themselves as flyout menus on the live site.

To flag specific posts to appear in the blue bar below the custom menus, just add the “top-menu” category to the post and ClickBump 5 takes care of the rest. To do this, click on “Posts”, then for any post you want to appear in the blue bar menu, click “Quick Edit > Categories” and click to select the “top-menu” category. Then click “Update” to save the setting. That’s all there is to it. The menu is now set as a top menu item and will appear in the submenu under the main header menu.

Adding the footer boxes

The four boxes you see at the bottom are optional. However, these are great areas to showcase special Amazon or ClickBank products that relate to your niche. Or, you can just place additional content into them. To create them, just go to “Appearance > Widgets” and drag a few “ClickBump Box x” widgets over into the “Footer” sidebar as you can see below. You can use as many or as few box widgets as you want. Magnetic will auto adjust the boxes to fit equally in the footer area alongside one another!

Note from the screenshot above, one of the unique capabilities of the ClickBump 5 theme that set it apart from other themes, the ability to set widget visibility. For example, in this case, the widget will only be seen on the home page.

Feel free to use the comments are below to ask any questions you may have about setting up the new “Magnetic” template pack for ClickBump 5.

I’ve just finished a 4 pack premium halloween templates package for the Halloween costume and accessories sales season. This template series is an updated “Remix” of last year’s halloween templates for WordPress, “Blackjack the Ripper” and “Blue Halloween” templates. I’ve updated them to support flyout menus, a slider widget, social media icons and background images. I’m also including two additional templates, “Grey Ghost” and “Pickled Pumpkin”, with this package.

Halloween Templates for WordPress

“Pickled Pumpkin” for ClickBump C5
Click for full screen

If you have ClickBump Engine, Express, BizLocal or JumpStart Pro, you can purchase & install this package now via Paypal. You get all 4 templates for one low price of $15

All 4 templates are based on the same basic high converting layout and structure, each with a unique header image and colors. 4 premium templates specially designed for the halloween and fall sales season. These templates require the ClickBump theme to operate. If you don’t have it, you can get it here.

They all feature background image support that ties into the ClickBump C5 background image manager and you can achieve some pretty phenominal 3D like effects with that feature alone.

“Grey Ghost” for ClickBump C5
Click for full screen

Perhaps the coolest thing about them though, once the holiday season’s over, you can take any one of these templates, change out the background colors and header and have a template for all seasons. I can’t wait to finish the video to show you the 3D effect you’ll get with a fixed position background image on any of these 3.

“Blue Halloween 2″ for ClickBump C5
Click for full screen

“Black Jack the Ripper 2″ for ClickBump C5
Click for full screen

If you have ClickBump Engine, Express, BizLocal or JumpStart Pro, you can purchase & install this package now via Paypal. You get all 4 for one low price of $15, an incredible value for premium halloween templates for WordPress.

I’ve just released ClickBump 5, the latest edition of my core WordPress theme that’s at the heart of ClickBump Express, Engine, BizLocal and JumpStart Pro! ClickBump 5 is available as a free upgrade to existing owners of those products.

Here’s a screenshot of the updated theme options interface:

Click for full size

The main feature of this release is speed.

The key to the incredible performance of sites running ClickBump 5 is its use of highly efficient CSS and Web Standards coding practices.

ClickBump 5 is one of the first widely distributed WordPress themes to be fully compatible with the HTML5 and CSS3 specifications and validates as W3C compliant HTML5.

In addition to numerous speed and performance enhancements, there are two main highlights of this release:

First, is the revamped options panel. I’ve organized the options in more logical groupings and categories and highlighted each function by its main keyword (Adsense, Ads, Images, Site Menu, Sidebar, Footer, Show, Hide, Move) etc, so help you quickly find the option you need by its most logical keyword.

Secondly, you now have a background image manager. This will allow you to create some pretty stunning website designs by attaching a single background image and color that you control via point and click.

For example, you can tell C5 to repeat the image horizontally (repeat-x), Vertically (repeat-y), in both directions (repeat), static, scrollable, etc…

If you’ve ever seen a website that scrolls the content vertically while the background remains fixed in place (a very neat effect), you can now do that with C5 with just a few mouse clicks and your custom background image.

Here’s a look at the updated “Images Manager” along with the background image options…

Click for full size

About ClickBump
The “ClickBump Engine” consists of this core theme, along with complimentary products including “ClickBump SEO! for on-page SEO optimization, JumpStart Pro! for one click site setups, BizLocal! for creating full HTML5/CSS3 compatible local business sites and soon “Keyword Miner!” for finding profitable niche site opportunities without leaving your web browser.

About Red Mountain Media
Red Mountain Media, LLC is a privately held company located in Birmingham, Alabama. We produce the ClickBump suite of products for marketing professionals and website owners. Scott Blanchard, President and Founder of Red Mountain Media has been developing web sites and software using Web Standards since 1998

Jan 6, 2012 Update: Keyword Miner version 1 is complete! Before it can be released we are still working on a downloads site and support infrastructure. There will be a free version and a paid “Pro” version at launch.

Dec 13, 2011 Update: Keyword Miner has been converted to a native browser extension! We have it running in Chrome and will soon port our work to Firefox.

Deploying the app as a native browser extension allows much faster execution than Greasemonkey allows, plus more control. For example, when you hit the Adwords keywords tools page, we can default the “Match Type” to “Exact” (no more mistakes with that annoying little default “broad” search)

Continue Reading

I’ve been asked many times for a clean, white template for CE4. One that really makes the ads Pop! Well, today I’m releasing a new premium template made for owners of CE4 (aka ClickBump Express/Engine). Its called “White Lightning!” and its a clean, SEO optimized, w3c-validating html5 compatible template made for WordPress and CE4.

Here’s a preview (click the image for full size preview):

This template features a unique blend of cutting edge CSS design (including some CSS3 for modern browsers), html5 compatibility, as well as the ability to morph into any color scheme you can envision, using the CE4 point and click color options.

You can also add a custom header graphic (to replace the default female avatar character) and I’ve included a layered .pxd file with the package so that you can easily create your own custom header image to make this your own. You can open the .pxd image at pixlr.com, edit it, then save it as header.png for uploading to your site. If you don’t care to use a header graphic, you can easily disable the header graphic with one click at “CE4 > Images > Hide Header Graphic”

The template also features a vast array of color customization options. Here is the help overlay that you will see at “CE4 > General Settings > Show Help” (click the image for full size preview)

By default, the color values are preset to match the example. However, you can easily customize these colors, along with the header image to instantly transform this template into your vision. As you can see in the screenshot below showing CE4′s point and click color swatches (1-4) that you will use to set those colors:

Adding the CE4 Google Search Widget to the template

At the top right corner of the screenshot, you can see the Google Search Widget, specially formatted and anchored to the top right corner of the template’s header area. Its a snap to add this to your CE4 enabled site.

1) Go to “Appearance > Widgets” and drag “Google Search Widget” (a ClickBump CE4 exclusive widget not found elsewhere) over into the widget area labeled “Sidebar“. Once you’ve done that, it will look like this:

As you can see from the screenshot, I’ve already pasted in all of the default script for you. All thats left for you is to place your Adsense Pub ID into the space provided. You’ll get this from your Google search widget code at your Adsense dashboard. You can also see that at the bottom of the widget panel you have even more control over where the widget appears on your site via the “Widget Visibility” panel, another CE4 exclusive. You can selectively show/hide the widget depending on whether its being shown on the home page, on posts, on pages, on category pages, on the search page, on 404 pages or on tag pages. No one else gives you this level of control right out of the box.

Adding Your Ad Code to the template’s Main Content Ad Area

To add your Main Ad code to the template, you have two options (for Adsense), you can use your Adsense Client ID and Slot ID or you can paste your entire Ad code block. I’m using a combination of both in my example, so that I can rotate ads between the two. However, you can use one or the other. Of course, you are not limited to Adsense. You can use ANY AD NETWORK, such as Chitika, Amazon, Ebay, ClickBank or whatever. Just paste your Ad code or script into the spaces provided at “CE4 > Ads” and you are all set to go with global control over your ads.

To enable the stacked 336×280 ads as you see in the screenshot, open your site’s admin dashboard and click on the theme options panel (CE4). Once you have that open, just click on the “Ads” tab and click the “Default to Stacked Ads” option and paste in your Google Client ID and Slot ID for your saved large rectangle ad like so (click the image for full size preview):

Note that I have a few extra options selected in my example. These are all optional (as all of the CE4 settings are). By placing ad code into the “Alternate Ad Code” block, and checking the “Turn on Ad Rotation Script” option, I’m enabling CE4 to rotate the ads that the viewer sees between the Adsense main ad (the one I’ve specified at the top with the Client ID and Slot ID) and the “Alternate Ad Code”.

What’s cool about this feature is that I can place ANY ad code I want into the “Alternate Ad Code” box, and I’m not limited to Adsense. I can, for example, rotate between my stacked 336 Google Adsense blocks, and a high commission ClickBank product with affiliate link (or whatever). You get the idea. This is very powerful.

Feel free to use the comments are below to ask any questions you may have about setting up the new “white-lightning” template for CE4. Existing CE4 owners can purchase and install this template beginning today at Paypal. To activate this template or any template, check the preview panel at the top of the member dashboard downloads page. You can instantly purchase any premium template there.

Adding Custom Menus to CE4 Templates

The White Lightning template (and almost all premium templates) is pre-configured to present the WordPress custom menus as you see in the screenshot, with the current post or section automatically highlighted. It also will display any posts you’ve flagged with the top-menu category and place them in the blue bar across the bottom portion of the header area. If you built your site with JumpStartPro!, the installer automatically created a custom menu for you. However, if you did not, click on “Appearance > Menus” to create and configure your menu similar to this (click the image for a full size preview):

The custom menus are flyout enabled, so that if you drag and drop them under one another, they will automatically orient themselves as flyout menus on the live site.

To flag specific posts to appear in the blue bar below the custom menus, just add the “top-menu” category to the post and CE4 takes care of the rest. To do this, click on “Posts”, then for any post you want to appear in the blue bar menu, click “Quick Edit > Categories” and click to select the “top-menu” category. Then click “Update” to save the setting. That’s all there is to it. The menu is now set as a top menu item and will appear in the submenu under the main header menu.

Adding the footer boxes

The four boxes you see at the bottom are optional. However, these are great areas to showcase special Amazon or ClickBank products that relate to your niche. Or, you can just place additional content into them. To create them, just go to “Appearance > Widgets” and drag a few “ClickBump Box x” widgets over into the “Footer” sidebar as you can see below. You can use as many or as few box widgets as you want. White-lightning will auto adjust the boxes to fit equally in the footer area alongside one another!

Note from the screenshot above, one of the unique capabilities of the CE4 theme that set it apart from other themes, the ability to set widget visibility. For example, in this case, the widget will only be seen on the home page.

Feel free to use the comments are below to ask any questions you may have about setting up the new “white-lightning” template for CE4. Existing CE4 owners can purchase and install this template beginning today at Paypal.

Today I’m releasing a new premium template made for owners of CE4 (aka ClickBump Express/Engine). Its called “Velocity” and its an SEO optimized, fully-validating html5 compatible template made for WordPress and CE4.

Here’s a preview (click the image for full size preview):

This template features a unique blend of cutting edge CSS design, html5 compatibility, as well as the ability to morph into any color scheme you can envision, using the CE4 point and click color options.

You can also add a custom header graphic (to replace the default female avatar character) and I’ve included a layered .pxd file with the package so that you can easily create your own custom header image to make this your own. You can open the .pxd image at pixlr.com, edit it, then save it as header.png for uploading to your site.

The template also features a vast array of color customization options. Here is the help overlay that you will see at “CE4 > General Settings > Show Help” (click the image for full size preview)

By default, the color values are preset to match the example. However, you can easily customize these colors, along with the header image to instantly transform this template into your vision. As you can see in the screenshot below showing CE4′s point and click color swatches (1-4) that you will use to set those colors:

Adding the CE4 Google Search Widget to the template

At the top right corner of the screenshot, you can see the Google Search Widget, specially formatted and anchored to the top right corner of the template’s header area. Its a snap to add this to your CE4 enabled site.

1) Go to “Appearance > Widgets” and drag “Google Search Widget” (a ClickBump CE4 exclusive widget not found elsewhere) over into the “Sidebar”. Once you’ve done that, it will look like this:

As you can see from the screenshot, I’ve already pasted in all of the default script for you. All thats left for you is to place your Pub Code into the space provided. You’ll get this from your Google search widget code at your Adsense dashboard.

Adding Your Ad Code to the template’s Main Content Ad Area

To add your Main Ad code to the template, you have two options (for Adsense), you can use your Client ID and Slot ID or you can paste your entire Ad code block. I’m using a combination of both in my example, so that I can rotate ads between the two. However, you can use one or the other.

To enable the stacked 336×280 ads as you see in the screenshot, open your site’s admin dashboard and click on the theme options panel (CE4). Once you have that open, just click on the “Ads” tab and paste in your Google Client ID and Slot ID for your saved large rectangle ad like so (click the image for full size preview):

Note that I have a few extra options selected in my example. These are all optional (as all of the CE4 settings are). By placing ad code into the “Alternate Ad Code” block, and checking the “Turn on Ad Rotation Script” option, I’m enabling CE4 to rotate the ads that the viewer sees between the Adsense main ad (the one I’ve specified at the top with the Client ID and Slot ID) and the “Alternate Ad Code”.

What’s cool about this feature is that I can place ANY ad code I want into the “Alternate Ad Code” box, and I’m not limited to Adsense. I can, for example, rotate between my stacked 336 Google Adsense blocks, and a high commission ClickBank product with affiliate link (or whatever). You get the idea. This is very powerful.

Feel free to use the comments are below to ask any questions you may have about setting up the new “Velocity” template for CE4. Existing CE4 owners can purchase and install this template beginning today at Paypal.

Adding Menus to the Velocity Template

The template is pre-configured to present the WordPress custom menus as you see in the screenshot, with the current post or section automatically highlighted. It also will display any posts you’ve flagged with the top-menu category and place them in the blue bar across the bottom portion of the header area. If you built your site with JumpStartPro!, the installer automatically created a custom menu for you. However, if you did not, click on “Appearance > Menus” to create and configure your menu similar to this (click the image for a full size preview):

The custom menus are flyout enabled, so that if you drag and drop them under one another, they will automatically orient themselves as flyout menus.

To flag specific posts to appear in the blue bar below the custom menus, just add the “top-menu” category to the post and CE4 takes care of the rest.

Adding the footer boxes

The four boxes you see at the bottom are optional. However, these are great areas to showcase special Amazon or ClickBank products that relate to your niche. Or, you can just place additional content into them. To create them, just go to “Appearance > Widgets” and drag a few “ClickBump Box” widgets over into the “Footer” sidebar as you can see below. You can use as many or as few box widgets as you want. Velocity with auto adjust them to fit alongside one another!

Note from the screenshot above, one of the unique capabilities of the CE4 theme that set it apart from other themes, the ability to set widget visibility. For example, in this case, the widget will only be seen on the home page.

Feel free to use the comments are below to ask any questions you may have about setting up the new “Velocity” template for CE4. Existing CE4 owners can purchase and install this template beginning today at Paypal.

Nov 21, 2011 update. Demo CTR-Plus site is now live

In this blog post tutorial, I’m going to walk you through the process of creating a review site using my WordPress theme, ClickBump 5 (aka C5).

I will be using my “CTR-Plus” template which installs into ClickBump 5 with one click to instantly transform your site.

ClickBump 5 is the WordPress core theme which comes with any of products > ClickBump Express, or Engine, or Express with JumpStart Pro or ClickBump Bundle)

Here’s what the site will look like when we are done (click the image for a larger preview):

(Above: CTR-Plus for ClickBump 5. Click the image for full screen preview.)

You can view the live demo site here

As you can see from the screenshot, there are several monetization sources available and at your disposal in ClickBump 5.

The Ads in the Example Site

To the right side of the header image, you can place a Google search widget, just by dragging and dropping the ClickBump ClickBump 5 exclusive “Google Search Widget” from the “Widgets” area over into the “Header” sidebar at “Appearance > Widgets“.

Below the header image and to the left, we’ve placed a 160×600 tall skyscraper banner (it can be from Google adsense or from any affiliate network such as Amazon or ClickBank). To place this ad, I just went to “Appearance > Widgets” and dropped a “ClickBump Ad Box” over into the “Sidebar” widget area. I then pasted my ad code into it and clicked “Save”.

To the right of the skyscraper ad, and inside the main content area, I’ve placed a set of “Stacked 336×280 ads” one on top of another. ClickBump 5 has an automated setting to do this for you, so I’ve just enabled that option at “ClickBump 5 > Ads > Use Stacked Ads“. I also placed my Adsense Publisher ID into the space provided at “ClickBump 5 > Ads > Adsense ID” and I’m all set, ClickBump 5 does the rest, including the nifty, two column, magazine style layout you see in the screenshot.

Just below the content area, I’ve placed a single 600×160 banner ad that reinforces my main offer, which is a ClickBank product on the workout ebook my site is targeted to. To place this ad, I simply grabbed my ad code from ClickBank, then opened “Appearance > Widgets” and again, dragging a “ClickBump Ad Box” over into the “Below Content” sidebar area. I then opened the sidebar widget and pasted in my ad code before clicking “Save“.

The Images in the Example Site

Starting from the top left, you have the ability to add your own custom header image (the avatar character). This can be any image you choose. You’ll upload it via “ClickBump 5 > Images > Header“. I choose an headshot of a male avatar character, which has a transparent background to seemlessly blend in with the template gradient background area for a nice, clean look.

Directly under the header area, you’ll see two large 350×250 images that match my site’s theme (Crossfit Workouts). I grabbed these images via Google search. Make sure the images you use are cleared for display and you are not violating copyright. There are many free stock photo collections available online and you can also search google images with a copyright license filter enabled. I also use istockphoto.com for paid stock photography.

The Content and Menus in the example site

To create this site, I used JumpStart Pro, the one click site installer that comes with my “Express with JumpStart Pro” and “ClickBump Bundle” packages. The JSPro installer automatically installed ClickBump 5, along with the CTR-Plus template (I placed a copy of the unzipped ctr-plus template folder into the JSPro’s “templates” folder prior to using it to create this site).

By using JSPro, I did not have to create any pages or posts, since JSPro creates them all for me as part of the one click install process. I merely had to edit my home page post with my main article content.

The menus were all created as part of the JSPro installer process as well. I simply removed the default “Custom menu” that the JSPro installer created (since I wanted a clean look across the top), but going to “Appearance > Menus > and de-selecting the “Site Menu” from the “Theme Locations” box and clicking “Save”.

Unlimited Color Options

As with all ClickBump templates, you have unlimited color options via the point and click colorpicker in ClickBump 5 theme options. For example, with just a few clicks on the colorpicker, you can instantly change the background to any color you like. Here are a few examples:

Since the template runs in the ClickBump Framework, you have complete control over ad placement, menu counts, and foreground (text) and background color options at the click of a button. You can also take advantage of ClickBump’s built in support for social media as well as Google search box as seen below (click for full size preview) as well as automatic social sharing widgets above or below your post content.

Finally, because CTR-Plus runs in ClickBump Framework, you can instantly customize the color palette to match your niche or tastes, from an unlimited selection of colors, with point and click ease via the ClickBump theme options panel. Here are a few color scheme examples:

CTR-Plus Step by step setup

1. (optional) Install and activate JumpStart-Pro. This sets up your site’s default pages and posts, installs the ClickBump WordPress theme into the site and sets up the site default settings to optimize it for search traffic and monetization.
2. Install the CTR-Plus template package ctr-plus.zip into the ClickBump Framework at “ClickBump > Home > Add/Upgrade Templates“.
3. From the “Template/skin” pulldown menu, select ctr-plus and click “Save Changes” at the top of the theme options panel. This tells ClickBump framework to use the CTR-Plus skin for your site’s design and layout. The ClickBump framework still controls the core markup, html5 & css3 compatibility, w3c validated markup and all settings. The template gives it the unique look and feel that leads to high conversion rates.
4.  Site Check – Assuming you’ve built your site with JSPro, the site will now appear as in the “Figure 1” screenshot below.

5. Next, if you don’t want the slider widget active, you can disable it, along with the jQuery library that it relies on by un-checking the two options at “ClickBump > Misc > Slider > Enable” and “ClickBump > Misc > Scripts > Enable jQuery“
6. Configure your Ad options – To do this, Go to “ClickBump > Ads“ and enter your Adsense Client ID (if using Adsense) and/or your Ad script or Amazon/ClickBank/Ebay/Chitika code at “ClickBump > Ads > Alternate Ad Code“
7. Site Check – Assuming you are using Adsense, and have pasted your Google Adsense Client ID into the space provided at “ClickBump > Ads” your site will now look like the screenshot labeled “Figure 2″ below.

8. Now I’m ready to place my affiliate ads into the left sidebar and below the content as in the screenshot. Before I do so, I’m going to clear out the default sidebar widgets that JSPro added to my sidebar. To do that, I just go to “Appearance > Widgets” and drag the 3 widgets out of the box labeled “Sidebar”. Just drag them over to the left and they will be removed from the sidebar leaving it empty.
9. Next, without leaving the Widgets screen, drag a “C5: Ad Box” widget from the “Available Widget’s” collection over into the sidebars labeled “Sidebar” and “Below Content“. If  you don’t want to place ads here, you can skip this step.
10. Continuing with Step 8, expand the “C5: Ad Box” widget and paste your ad code into it and click “Save”. In my example, I’m using a ClickBank offer in these areas, so I’ve uploaded my ad images via “Dashboard > Media” as ad1.png and ad2.png (but you can name your images anything you like). For the left sidebar, which will be using ad1.png, I”ve placed the following code into my “C5: Ad Box” widget for the left sidebar (don’t forget the “alt” attribute. You site won’t validate as html5 without it):
    

    <a href=”my-affiliate-link”><img src=”path-to-my-site/wp-content/uploads/ad1.png” alt=”crossfit workout course” /></a>

11. Continuing on with Step 9, for the Ad that appears below my content, I’ve expanded the “Below Content” sidebar and pasted the code for the 2nd ad into the “C5: Ad Box” that I placed into that sidebar:
    

    <a href=”my-affiliate-link”><img src=”path-to-my-site/wp-content/uploads/ad2.png”  alt=”crossfit workout course” /></a>

12. Site Check – Now that I’ve got all my ads in place, you can see what my site looks like now in Figure 3 below…

13. Next, I’m going to temporarily hide the 4 boxes that JSPro added to my “Footer” sidebar at the bottom of my template. Unlike before in Step 8 where I removed the widgets completely from the sidebar, in this case I might want to use them later, so I’m going to use ClickBump Framework’s built in “Widget Visibility” option to simply disable them for now. To do this I simply check the Hide button on each of the “C5: Box” widgets 1-4 and then “Save” at the bottom of each widget. You can see this in Figure 4 below.
14. Next, I’m going to customize the header image and replace the image of the girl with my own custom image. The default size of the CTR-Plus template’s header image is 967×100, but your image can be any size you like. To expand the header to accomodate a taller image, you can enter a custom header height at “ClickBump > Images > Header Image > Custom Height“.
15. To upload your image, go to “ClickBump > Images > Header” and click the button that reads “Upload Header”. Just remember to save your image as a .png file. ClickBump will automatically rename the image header.png and place it into the ctr-plus folder under “wp-content/themes/c5/styles/ctr-plus/”

16. Site Check – Now that I’ve disabled the 4 Boxes in my “Footer” sidebar, and uploaded a custom header image, my site looks like you see in Figure 5

17. Finally, all that’s left is to add the two large images just below my header area. To do that, I’ve renamed my images with an underscore in front of the filename (_image1.jpg and _image2.jpg) and uploaded them via “WordPress Dashboard > Media“. I’ve also checked the option to show product images at “ClickBump > Product Images > Enable“. This tells the theme to display any images it finds with an underscore character preceeding the filename at the top of each of my posts.
18. All done! Now you just need to add your content and you are set to go forward. For help configuring your custom menus, check FAQ #19 in the ClickBump User’s Forum. To see how ClickBump Framework’s automated metadata manager works, check FAQ’s #10-12.
19. BONUS: If you want to short circuit a few of the setup steps above (specifically #3, #5 and #17), here’s a script that you can import via “ClickBump > Misc > Settings Manager > Import Settings” to insure your site is set up as directed above (Note: you will still need to upload the product images, this script just assigns all the correct settings in CE4 theme options to emulate my example site).

Figure 1 – CTR-Plus after installing on a new site built with JSPro

Figure 2 – CTR-Plus after enabling ads and checking the “Default to stacked ads” option

Figure 3 – CTR-Plus after adding the ad to the left sidebar and the “below content” sidebar

Figure 4 -Temporarily hiding the footer boxes using ClickBump Framework’s unique “Widget Visibility” panel.

Figure 5 – CTR-Plus after adding a custom header image via “ClickBump > Images > Header Image”

I’m sitting in my den typing this post on a brand spanking new MacBook Air 13 that I picked up today from the Apple store in Birmingham, Alabama.

To say its a work of art would be an understatement.

The New MacBook Air is Fast

And, despite its razor thin profile, the Apple engineers have somehow managed to pull off the impossible. The new MacBook Air is amazingly responsive and fast. Cnet perhaps put it best…

Into a 0.68-inch high enclosure, Apple has dropped a six-cylinder engine where a poky four-cylinder used to be.

Everything about this computer is well rehearsed and flawlessly executed. From the smooth, backlit keypad that automatically adjusts its light output based on ambient lighting conditions, to the feather-light aluminum clad chassis that belies the incredible power inside, this is truly the state of the art in personal computing.

I’ve been on it non stop for about 5 hours since unboxing it at the Apple Store and the battery still has nearly a quarter charge left.

The New MacBook Air Comes Alive with Trackpad Gestures

But by far, the most enjoyable feature of the new MacBook Air, especially when surfing the web, is the perfect marriage of the expansive and velvety smooth trackpad with the new gesture-based navigation and control that has been introduced with OSX 10.7 Lion.

Web browsing is particularly enhanced with trackpad gestures. I’m finding that I open less tabs, due to the ease of 3 finger swiping backwards and forwards through the current tab’s history. I might just have found a cure for my severe case of “Tab-itus”. I frequently run up to 30-50 tabs at once! Maybe Lion will help me cut that in half at least, LOL.

I’m still learning and practicing the various gestures that whisk me around the computer, but its without a doubt, an enjoyable experience.

Here’s to Jonathan Ives and the brilliant engineers at Apple. You’ve hit a home run with the new Macbook Air 13.

I can definitively say, the next version of ClickBump Engine will be built on a Mac. The new MacBook Air.

I’m including a slider widget control, similar to the $99 slidedeck, with all copies of ClickBump Express, Engine and BizLocal. You will find the slider widget in your widgets collection once you upgrade or install CE 4.4

Here’s a quick video showing how to configure the slider options such as frame advance duration, auto-advance or paused on start, edit the contents, add/remove slides as well as how turn it on and off via CE4′s theme options panel…