What does this mean for you as a WordPress user? Well in a nutshell. It means a faster loading website and happier customers. Speed is the key in this day and age and nobody wants to wait around for a website to load. Visitors want their content as fast as possible.

To get an understanding of how a CDN can help your WordPress site, lets explain what exactly a CDN or Content Delivery Network is.

What is a CDN (Content Delivery Network)

A content delivery network or content distribution network (CDN) is a large distributed system of servers deployed in multiple data centers across the Internet. The goal of a CDN is to serve content to end-users with high availability and high performance. CDNs serve a large fraction of the Internet content today, including web objects (text, graphics, URLs and scripts), downloadable objects (media files, software, documents), applications (e-commerce, portals), live streaming media, on-demand streaming media, and social networks.

Besides better performance and availability, CDNs also offload the traffic served directly from the content provider’s origin infrastructure, resulting in cost savings for the content provider. In addition, CDNs provide the content provider a degree of protection from DoS attacks by using their large distributed server infrastructure to absorb the attack traffic. – Wikipedia

CDN77 As Your Content Delivery Provider

In this article I will demonstrate how to integrate CDN77 Content Delivery Network into a WordPress site. For this to occur you must first register for a free account at the CDN77 website.

CDN77 is great in the fact that you do not pay any monthly fees or do not need to sign a contract and be liable for a certain amount of time. They offer a contract free approach where you simply “Pay as You Go” and only pay for the traffic your site receives.

Signing up at CDN77 only takes a few moments

Signing up at the site only takes a few moments and currently at the time of this article CDN77 are offering a FREE 14 day trial. This also includes 100Gb transfer or 10 CDN’s.

Once you have completed registration you will be sent an email to the email address you used to register with. Keep this email in a safe place as it contains your CDN77 website password.

Now that you have successfully created your account, go ahead and login to your to the CDN77 Control Panel.

Login to your CDN77 account

Once you successfully login to your account you will be transferred to your account Control Panel. The Control Panel is a user friendly way to access all aspect of your account as well as create and manage your CDN’s.

The user friendly Control Panel

One aspect I love on the Control Panel page is the global map that illustrates where your recent visitor traffic has been originating from.

OK, now to be able to integrate the CDN into our WordPress sites we need to create our first “CDN“. Notice the button labelled “Create New CDN” on our Control Panel page? Go ahead and click that button to create our CDN.

Creating a New CDN on CDN77

1. Create the CDN in the CDN77 Control Panel

Everything on the CDN77 website is as user friendly as possible and creating your first CDN is no different. To create our new CDN we need to complete a few tasks on our hosting account as well as creating the CDN on the CDN77 website.

In this guide I am going to assume that you have cPanel web hosting and your hosting account is setup and working fine.

On the CDN77 CDN creation page you are presented with a form that requires us to enter a few details about the CDN we want to create.

• CDN Type: We want a standard CDN for our WordPress site so click on the Standard radio button.
• Origin Server URL: This is the URL of the site in which you want to use the CDN for. Enter your domain name here with the “http://” or “https://“. E.G wpinsite.com
• Custom CDN domain (CNAME): In this section we will insert a sub domain name that we want to use for the CDN. In the next step we will create that CNAME Record in our cPanel Dashboard. Enter your custom domain name E.G cdn3.wpinsite.com
• Advanced Settings: If you want to customize the creation of the CDN by applying a SSL setting click on this setting and choose from the available options.

Once completed entering all the details, click on the “Create CDN” button. On successful creation of the CDN you will be redirected to a success page that lists details about our newly created CDN. Keep this page open and open a new browser tab and navigate to your web hosting cPanel.

2. Create a new CNAME in your cPanel account.

Simple DNS Zone Editor

Login to your web hosting cPanel account and scroll down to the “Domains” section of the page.
Click on the link labelled “Simple DNS Zone Editor” to start the process of creating a new CNAME record.

Creating our new CNAME record

Scroll down to the section labelled “Add a CNAME Record“.

In this section we want to enter the sub domain details that we entered above on the CDN77 creation page.
In the “Name” textfield we enter the sub domain name we entered earlier. E.G cdn3.wpinsite.com

Our new CDN CNAME address details

On the success page or “CDN Configuration” page of the CDN77 Control Panel you will notice a section labelled “CNAME Configuration (optional)“. Inside this section is the address that we want to enter in the “CNAME” texfield in our cPanel Dashboard.

The text looks like this as illustrated above: cdn3.wpinsite.com 3600 IN CNAME *********.r.cdn77.net

Note: For security reasons I have hashed out the CNAME address.

Copy that address and enter in into the textfield labelled “CNAME“. Only paste in the *********.r.cdn77.net aspect.

Finally click the “Add CNAME Record” button to save the changes.

Congratulations! You now have created you first CDN. In the next section we will demonstrate how to configure WordPress to use this recently created CDN.

Integrate CDN77 with WordPress

Now that we have our first Content Delivery Network created, it is time to integrate it with our WordPress site. Thanks to the W3 Total Cache WordPress plugin this task only takes a few minutes to setup and configure.

Login to your WordPress Dashboard and browse to the “plugins -> Add New” page. In the “Search Plugins” textfield enter the search term “W3 Total Cache“.

Search for and install the W3 Total Cache WP plugin

Once the search results have been displayed, click on the “Install Now” link to install the W3 Total cache plugin if you do not already have it installed. Once the plugin has been successfully installed go ahead and activate it.

Browse to the W3 Total Cache settings page from within your WordPress Dashboard.

W3 Total cache Settings Page

In the links at the top of the settings page click on the link labelled “CDN” to automatically scroll down the page to the CDN configuration section.

W3 Total Cache CDN Configuration

Place a tick in the textbox labelled “Enable” and select “Generic Mirror” from the available options in the “CDN Type” dropdown menu. Click on the “Save All Settings” button.

Next, in the navigation links in the WordPress menu click on the “CDN” link under the “Performance” tab. This will direct us to the CDN setup page within the W3 Total Cache plugin.

This page is where you configure CDN77 and W3 Total Cache. Leave all the default settings as are unless you have a requirement to change any of theme. Scroll down the page to the section labelled “Configuration“.

W3 Total Cache CDN Configuration

In the first section labelled “SSL Support” leave the option as “Auto (determine connection type automatially)” unless you added an SSL setting when creating the CDN in the CDN77 Control Panel.

In the next section labelled “Replace site’s hostname with” enter the sub domain name you used when creating the CDN in the CDN77 Control Panel. E.G cdn3.wpinsite.com

You can click on the test mirror button for confirmation that you have the CNAME configured correctly.

Finally, save the settings.

After your setting have been saved navigate back to the W3 Total Cache “General Settings” page and lets just double check that you have the Content Delivery Network enabled. You should should some green text labelled “enabled“. This is our confirmation that we have the W3 Total cache plugin enabled.

Confirming the W3 Total cache plugin is enabled

Conclusion

Congratulations! You have now completely integrated CDN77′s Content Delivery Network with your WordPress powered site. The process required a few steps and a few moments of us getting our hand dirty, and diving into our hosting settings, however the benefits are well and truly worth it.

You should now see an explosive improvement in your site performance and page loading time. Like I said at the being “A faster loading site = happy visitors”.

Bizstream Responsive Premium WordPress Theme

Bizstream is a feature packed multi-purpose theme that is the ideal solution for your business. It is flexible & responsive (works on all devices, including mobile based) and focuses on attention to detail. It is built using the latest web technologies and gives you the option of using any of the two available layouts. A full width design or an elegant boxed design. With a design focus on usability and extend ability Bizstream is WPML Translation Ready & certified. Bizstream allows for the integration of the ever popular e-Commerce solution WooCommerce. Simply enable the WooCommerce integration setting, install the WooCommerce plugin and you can effortlessly streamline your WooCommerce shopping pages directly into the theme.

It comes with over 100+ Visual Shortcodes, 15 highly functional widgets, unlimited page and post sidebars. You will love the highly intuitive and flexible admin panel which makes customizing the theme fun as well as practical.

With the clever use of Custom Post types you can create pages to display pricing tables & display multi-layout interactive portfolio’s.

Bizstream Features:

• Clean, Modern & scalable design can be used for any type of website
• 100% Responsive Theme – Works great on all devices.
• Retina Ready, Ultra High Resolution Graphics
• Built with HTML5 and CSS3
• One Click Demo Import – Includes XML file for demo data
• WPML plugin ready & certified
• Child Theme Compatible – includes child theme!
• WooCommerce compatible with easy e-Commerce integration
• Includes the Awesome Parallax Layer Slider 3D Plugin – $15 Value
• Includes the jQuery Isotope plugin for interactive portfolio sorting – $25 Value
• Touch swipe enabled slideshows
• Unlimited color variations with 14 color skins included.
• Unlimited Portfolio pages
• Unlimited Sidebars
  • Set global sidebar positions as well as single post sidebar positions
  • Create custom sidebars for the various sections of the site
  • Sidebars can be positioned on left or right side
  • Use any of our custom or built in widgets in any sidebar
• Advanced Blog Options
  • Set global blog options or individual post settings
  • 2 image layouts to choose from; large, medium for each post, or set a global option
  • 6 amazing post types (standard, audio, gallery, link, quote or video)
  • Awesome image rollovers with PrettyPhoto and link icons!
  • Set Custom Featured Image size per post
  • Auto generated thumbnails
  • Easily specify the number of items per page
  • Pages can have left or right sidebar, or set a global option
  • Tons of options to add or remove meta data, featured images, full or excerpt, etc
• Advanced Portfolio Options
  • Set global portfolio options or individual post settings
  • 1-4 column portfolio layouts to choose from
  • Set up multiple Portfolio Pages with paging
  • Select specific categories for each portfolio, fully customized!
  • Awesome image rollovers with lightbox and link icons!
  • Use Images, Slideshows, & Videos with ease!
  • Set Custom Featured Image size per post
  • Auto generated thumbnails
  • Easily specify the number of items per page
  • Automatic pagination
  • Sortable/filterable categories
  • Gallery & Full detail layouts
• Includes entire Font Awesome 3.0 icon set, fully integrated
• Advanced Theme Control Panel using customized version of the popular Slightly Modified Options Framework by Syamil MJ
• jQuery enabled Contact page and widget
• 8 separate page templates to choose from
• Side Navigation Page Template for Easy Page Navigation
• Custom Sitemap template for better SEO
• Built-in SEO options in the Bizstream Control Panel
• SEO Optimized, Great SEO base built-in (compatible with SEO Plugins like Yoast)
• Built-In 404 Page
• 15 highly useful interactive widgets
• Custom Typography Options
  • Use Standard or Google Fonts
  • Delegate your fonts from the Bizstream Control Panel
  • Set different font sizes for all H1-H6 headings and body text
  • Set different colors for your fonts
• Wide & Boxed Layout Versions
  • Upload custom background images for boxed layouts
• Translation Ready, Includes the .po and .mo files
• Post sharing options with social icons
• Lots of Useful Shortcodes with an easy to use Shortcode Generator
  • Accordians, Buttons, Columns, Tabs, Typography, Google Maps, Media, Message Boxes, Pricing Table and much, much more…
  • Easily Create Stunning Pages within minutes using Shortcodes
  • Slider shortcodes are even Touch Optimized & swipe-enabled
• Amazingly Cool jQuery Enhancements
• 15 Highly Useful Built-in Custom Widgets
  • 125px Advertisement Widget
  • Contact Form (jQuery enabled)
  • Contact Info
  • Facebook Widget
  • Feedburner Widget
  • Flickr Photo Widget
  • Google Maps Widget
  • Popular Posts Widget
  • Random Posts Widget
  • Recent Posts Widget
  • Recent Portfolio
  • Social Widget
  • Tabbed Widget
  • Twitter Widget &
  • Video Widget
• Threaded Comments
• Layered PSD’s included for customization
• Strong focus on typography, usability and overall user-experience
• Well organized, commented & clean code
• Cross-Browser Compatibility FireFox, Safari, Chrome, IE8, IE9, IE10
• Fully Tested for WordPress 3.5, and compatible with WP 3.1+
• Detailed theme documentation

How to Enter

The competition is now closed.
Congratulations to our lucky winners:

• DrTeddy
• Chandra

You have each won a copy of the Bizstream Premium WordPress Theme

View more details on the Bizstream WordPress theme

Page Template Dropdown

Getting the page template name

The first step we need to do is create a short PHP function that will aid us in getting the page template in use name.

Navigate to your current WordPress theme “wp-content/themes/your-current-theme” and open your theme functions.php file.
Add the below PHP function to this file.

/**
 * Get the name of the current page template name. 
 * @return string
 */
function get_page_template_name() {
  if(is_page()) {
    global $post;

    return str_replace('.php', '', get_post_meta($post->ID, '_wp_page_template', true));   
  }
  return '';
}

Code Definition

1. First we ensure that we are actually displaying a WordPress “Page“.
2. We declare and use the global variable $post. This is where the current for the current Page is stored.
3. Finally, we grab the Page template filename from the Page metadata and strip out the “.php” file extension.

Usage

When we actually want to use the code to retrieve the page template name we simply call the above function in our template file like so:

$template_name = get_page_template_name();

Back to the initial requirement for this function, an example conditional statement where you might use the function could be that you only want to enqueue a JavaScript file if a specif page template is in use like so:

$page_template = get_page_template_name();
if($page_template == 'page-templates/template-contact'){
	wp_enqueue_script('jquery-gmap-apis', 'http://maps.google.com/maps/api/js?sensor=false');
	wp_enqueue_script('jquery-gmap', BIZSTREAM_JS .'/jquery.gmap.min.js');

	add_action('wp_head', 'bizstream_display_gmap');
}

Whether you are searching for clip art to use in your latest WordPress theme or simply want to update your existing site, clipartlogo.com is sure to have some amazing graphics and logos for you to use.

The site is well presented and you can almost find everything you are after directly from the homepage. There is a solid navigation system in place that allows you to browse the entire collection of clip arts & logos by category and even the option to browse or search by tag.

Using the search engine you can easily search through the database of 78,000 free vector graphics, 205,000 free logos and 2,300,000 premium stock vectors.

Interactive Clipartlogo homepage

Browsing by category if my favorite way of finding that special clip art graphic for the job. It easily allows you to see a large collection of graphics and logos that have been categorized into the category you are browsing. Browsing through the category or tag pages you are presented with a 125px preview of the clip art graphic.

One element that I did find inspiring was the paging system that allows you to view previous and next pages in the current selection. Apart from the numbered paging links that are found at the bottom of the pages there are directional arrows to the left and right borders of the viewing screen. Clicking on any of these arrows allows you to effortlessly browse to the previous or next page. A nice touch indeed.

The clip art details page with all the graphics details

Once you ave found a clip art graphic or logo that interests you, you simply click on the graphic preview image to be redirected to the graphic details page.

The details page is where you can download the graphic or add it to your favorites. Adding graphics to the favorites collection does require you to register for a free Clipartlogo.com account. Also on this page are details relevant to the clip art or logo such as:

• User rating
• Number of downloads
• Number of times a user has added it to their favorites
• File size & file type
• Author
• Date clip art uploaded
• License
• Description

When browsing the site you can view the free collection of clip arts and logos or if you do not find what you are after you can easily browse the collection of “Premium” clip arts. When viewing the categories or searching for items you are presented with the free graphics as well as the premium ones. A good way for you to compare the different quality of clip arts. Although from my experience I found both the free and premium clip art graphics to be of the highest quality.

Clipartlogo.com is Multicultural

Clipartlogo.com has been translated into many different languages

The developers of the site have not geographically limited the site audience to a single region. The site is multicultural and open to a wide range of regions and languages. Backed by a team of translators the site has been translated into many language and the list is growing.

The site has been translated into the following languages:

 Whether you are searching for a specific clip art graphic or looking for ideas for a new theme logo you must check out the huge collection of graphics that clipartlogo.com offers.

Check out the Clipartlogo Site

To test WordPress 3.6, you can download  the WordPress Beta Tester plugin from the WordPress plugin directory.

WordPress 3.6

Here’s what’s new in 3.6:

• Post Formats:  Post Formats now have their own UI, and theme authors have access to templating functions to access the structured data.
• Twenty Thirteen: We’re shipping this year’s default theme in our first release of the year. Twenty Thirteen is an opinionated, color-rich, blog-centric theme that makes full use of the new Post Formats support.
• Audio/Video: You can embed audio and video files into your posts without relying on a plugin or a third party media hosting service.
• Autosave:  Posts are now autosaved locally. If your browser crashes, your computer dies, or the server goes offline as you’re saving, you won’t lose the your post.
• Post Locking:  See when someone is currently editing a post, and kick them out of it if they fall asleep at the keyboard.
• Nav Menus:  Nav menus have been simplified with an accordion-based UI, and a separate tab for bulk-assigning menus to locations.
• Revisions: The all-new revisions UI features avatars, a slider that “scrubs” through history, and two-slider range comparisons.

WordPress 3.6 looks to be an exciting release of great features.

Download your copy of WordPress 3.6 beta 2

With an easy to use search engine you can easily search through the more than 250,000 free vector graphics or the impressive 200,000 free vector logo’s. This is why it is the ultimate resource for Free Vector graphics and Vector Logos.

What are Vector Graphics?

To understand why vector graphics are so useful to us, it is good to understand the technical definition of what a vector graphic is.
Vector-based graphics have a wide scope in line art. Apart from pixel-based graphics, in vector-based graphics images are developed by mathematical functions. Vector-based images are somewhat similar to geometric diagrams and use points and lines. Individual objects have individual attributes and characteristics which is unlike pixel-based images in which each and every pixel has separate attributes and properties associated with them. The editing of vector-based images is also very easy.

The image quality in vector-based graphics does not depend on the dpi of the output device. This type of artwork in graphic design is good for logo designs because the resulting image is clear and crisp.

Vector-based graphics are easily scalable to any size. This makes it the perfect choice for your WordPress theme logo or UI icons.

Browsing through the Vector.me inventory

Now that we understand the importance of vector graphics, lets start by browsing through the vector.me graphics and logo collection.

You can use the online search engine or simply browse through the full collection to find that special vector that is right for your project.
The Vector.me homepage features two sections that allow you to view the latest free vectors and also a section where  the most popular vectors are listed.  Scrolling down you can see the most used tags and also have the ability to search vectors by tag. If this is not enough you can define your tag search and search tag by alphabetical order.

The Vector.me easy to use search engine

Lets take searching for a Flower Vector or Computer Vector for example. Say we want to use these two styles of graphics in own theme or project. You simply enter the term “Flower” or “Computer” into the search box. Instantly you are presented with an auto-complete feature which list your keyword and the amount of vectors available for that category. Once you click on the search button you are taken to the search results page for your keyword. From here you can browse the graphics for your keyword or even define the search by limiting the results to a single file extension or even to a specific color. Very cool!

I personally love browsing through the category pages. The category pages list all the vector graphics that are relevant to the category you are looking in. From this page you can directly download the graphic or click on the “Preview” button to get a larger view.
A unique feature on the category page that I really like is the category listing that is to the left of the graphics. This allows you to easily jump to another category of vector or logos.

Browsing through the category pages

Once you have found your special vector graphic you can views the details on that specific graphic or logo. You can effortlessly download the graphics or even add it to your own favorites collection. Adding to a favorites collection does require you to sign up for a free Vector.me account.

Details on your chosen graphic

On this page you are presented with all the details relevant to the graphic that you are looking at such as:

• Amount of Downloads
• Amount of times users have added the graphics to their favorites collection.
• User Rating
• File Size
• File Type
• Author
• Upload Date
• License
• Tags
• Description

Whilst viewing the graphic details page you are presented with thumbnails of more premium items where you can click on and visit the sites of some of the paid premium vectors.

There is also a similar vectors section which contains vectors that are similar to the one you are viewing. A fast and efficient way to see other graphics in the category of the graphic that you are viewing.

In conclusion the Vector.me site is an awesome resource for vector graphics and logos. The site is user friendly and very well constructed. I highly recommend that you sign up for a free account to utilize all the sites features such as being able to upload your own vectors and also the option to add graphics to your own personal favorites collection as I mentioned earlier.

Whether you are building a new WordPress theme or want to spruce up your existing theme visit the Vector.me and you are sure to find some amazing vectors that appeal to you.

Check out the Vector.me Site

Wise Guys is brought to you by the talented theme developer FRESHFACE. They love paying attention to details, and love making things easy to use and intuitive. So besides the awesome and user friendly design you see in the Wise Guys theme preview, you will also love the highly intuitive and flexible admin panel, which features a custom made state of the art PAGE BUILDER, which will make it really easy to create and manage pages with drag and drop.

The Wise Guys WordPress Theme was built using the latest technologies, and comes with a multitude of features such as: custom made page builder, a multitude of customizing options, shortcode generator, Smart Social Tool, Similar Works / Posts Tool, custom shortcodes, custom components and custom widgets, Revolution Slider ($15), Jackbox Responsive Lightbox ($10), two comments systems (custom wordPress comments system and the popular DISQUS comments system), Mailchimp Newsletter, together with a complete set of pages.

Long story short: the developers like creating smart and intuitive things, from the front end, to the back end, and the Wise Guys WordPress Theme is the perfect example for that. Check out the amazing features below to learn why.

1 click demo intstall

Flexible & Highly Customizable

Flexible & Highly Customizable

Design your website your way.

The developers at WiseGuys and FRESHFACE believe in usability, that’s why they did their best to make builidng your website a fun and friendly experience. The admin panel is smart, intuitive and user friendly, and you’ll be able to create your website in no-time.

WiseGuys WordPress Theme will allow you to design and set your website by your own preferences, no compromises. The Theme Options and Site Preferences are full of options that will turn the WiseGuys WordPress Theme into your own personalized website.

Cool Features

• 10 pre-made skins
• Boxed / Wide layouts
• Image / Pattern / Solid color background
• Font Selector and Font Style Selector (Google Fonts) – separated into 10 different sections (titles, body, menu, buttons, etc)
• Blur / No blur layouts – when NO BLUR is selected the page title and bread crumbs conveniently take the place of the tag line
• Site Preferences includes a large variety of useful options for each section of the theme
• Image and Thumbs fully resizable
• Using CSS Animation with FallBack to jQuery
• Unlimited Caption Layers
• Captions like Video, Image and html tags can be easily Created
• Unlimited Slides
• iPhone & Android Swipe Touch enabled
• jQuery Conflict free plugin
• Customizable 100% via Plugin Backend
• Special Easing
• Vimeo & Youtube Supported
• Full Screen Video with Autoplay function
• Stop AutoPlay during Video Playback
• Duplicate, Slider, slide, captions Function
• Drag and Drop Captions in the Editor
• Fullwidth, Responsive (8 Level) and Normal Modes
• Optional Shadows included
• Hide Captions Separetely or Together depending on Slider Width
• Hide whole Slider Depending on Screen Width
• Countless Art of Transitions
• 10 Different Caption Animation Types
• 20 Differen Slide Transition, and Unlkmited Variations due Rotation and Amount of Slots
• Two Level Animations of Captions. Start Time, End time, Different Animation Type and Easing at Start and End
• Public Api, like stop & start, next,prev, jump to slide. Events at video play, start and stop, events at slide change..

The Pages

WiseGuys WordPress Theme comes with a complete set of pages to suit your needs. From blog, to portfolio, to contact, to services or about us, they have got you covered!

• Home page (3 layout versions + 4 slider versions))
• About Us (2 versions)
• Services (2 versions)
• Portfolio (3,4,5 columns)
• Portfolio Single (4 versions: single image, YouTube video, Vimeo video, slider)
• Gallery (3,4,5 columns)
• Blog (large and medium versions)
• Blog Single Post (4 versions: single image, TouTube video, Vimeo video, slider)
• Contact
• FAQ page
• Sidemenu page
• Pricing page
• Features Pages (typography, pricing tables, comparison tables, elements, sliders)

WiseGuys WordPress Theme comes with a large variety of shortcodes, elements and widgets, all custom tailored to fit it perfectly. We’re only using the shortcodes for columns, all other elements are manageable through the PAGE BUILDER, it’s a lot easier and very user friendly.

Custom Elements

• Flex Slider
• Portfolio Carousel
• Blog Carousel
• Pricing Tables (3,4,5 columns)
• Comparison Tables (3,4,5,6 columns)
• Testimonials Slider
• Toggles and Accordions
• Team Members Slider
• Tabs
• 27 Custom Icon Buttons
• 14 Normal Buttons
• 4 Info Boxes (Success, Warning, Alert, Info)
• 2 Call to Action Boxes
• Social Icons Set (33 page icons and 33 footer icons)

Custom Widgets

• Accordion / Toggle
• Categories
• Contact by Department
• Contact Details
• Get In Touch
• Latest Works
• Side Menu
• Posts Tab (recent+popular)
• Testimonials Slider
• Twitter

Wise Guys Screenshots

The Wise Guys Homepage

The filterable portfolio page

Custom Blog Pages

More details and/or purchase the Wise Guys – Responsive Multi-purpose WordPress

The winner of this contest will be afforded the opportunity to download one of the WordPress themes from ThemeFuse. It is completely free to those that are using WordPress already and there is no fee to enter.

Want to know how you can get your chance to win? Follow these three easy steps:

How to Enter

The competition is now closed. Thank you to all those who entered.

Congratulations to the lucky winners.

• Manuel Freund
• DrTeddy

Why Should You Enter?

ThemeFuse is among the top in providers of WordPress themes. They offer several options that you can utilize to make your page great and get the web traffic you desire.

Source coding is easily built in and you will get the cool graphics that you want. Loads of features are attached to the interface, which is easy to use and will provide you with exactly what you need in a WordPress theme.

If you have any questions about your ThemeFuse page, go to the FAQ page or the support forum. Winners of the contest will find this as a great resource for getting their questions answered.

ThemeFuse offers several WordPress themes. The following WordPress templates are just some of the options.

HomeQuest – Themefuse Real Estate WordPress Theme

If you want to make your mark in the world of real estate, consider choosing the HomeQuest theme. The real estate agent and broker will love seeing how this theme can turn potential clients into actual ones.

NewsSetter – News WordPress Theme

If you are sharing the latest and greatest of information, you will find everything you need in the News WordPress theme.

Envision – Business WordPress Theme

Unique features and several different options in sliders make this one of the most amazing WordPress themes by ThemeFuse. If there is a need, it can be met with this WordPress theme.

Conexus – Responsive WordPress Theme

A multi-purpose WordPress theme that can fit perfectly for various business industries or more laid back creative shops.

Welcome Inn – Hotel WordPress Theme

The hotel driven site will benefit from the Hotel WordPress theme. You can choose from two different options, the spa or the ski resort.

Be sure to enter for your chance to win. The reward can really take your WordPress driven page to the next level with a tremendous theme by ThemeFuse.

Times have now changed from the days of designing strictly in web-safe fonts (Arial, Tahoma, Georgia etc.) to using JavaScript (Cufon) to render more fancy fonts.

With a huge wealth of fonts (both paid and free) now readily available online, rendering fonts online has become more of an issue. Sure, your website may look great in Photoshop, but how are you going to emulate that intricate font across multiple browsers?

There are a variety of font services out there: fonts.com and Google fonts are the big players; however to ensure that fonts render correctly and look great in all browsers a good choice to use are @font-face.

font-face

@font-face is a CSS rule which allows you to download a particular font from your server to render on a webpage if the user hasn’t got that specific font installed. This means that web designers no longer have to adhere to a particular set of ‘web safe’ fonts that the user has pre-installed on their computer, or rely on users having JavaScript enabled. This works by turning the font file into a @font-face kit using an online generator like Font Squirrel.

Enabling and using @font-face fonts is slightly different than allocating standard fonts to HTML elements. In this article I will explain how to install and use @font-face in your WordPress themes.

Step 1. Download your font files

If you’re using a provider like MyFonts or FontSpring, you’ll be set up with a zip file full of all kinds of fun stuff, much of which you don’t need. First order of business is to read the license (always – you actually should have done this before buying, but do it again anyway). You want to know how many domains you can use the font on, and whether your license has any restrictions.

Once you’re clear on the details, open up the zip file and find the actual font files.

The font directory

In the screenshot above you can see that I have downloaded all variations of the font. You do not have to do this and can just load the specific variation you want. If doing this you will be left with 4 different files. We will use Cabin-Bold as an example.

1. Cabin-Bold-webfont.eot
2. Cabin-Bold-webfont.svg
3. Cabin-Bold-webfont.ttf
4. Cabin-Bold-webfont.woff

Step 2. Upload the fonts to your server via FTP

Because we want to integrate these fonts into our current WordPress theme we are going to upload them into a folder in a current theme:

1. Create a folder to store your new fonts. We will call the folder “fonts“
2. Place the 4 different file types of the font that you want into this folder.
3. Upload the folder and it’s contents to your current WordPress theme “wp-content/themes/my-current-themes/fonts“.

Uploading the fonts to your server

Use can use any FTP program to upload your fonts to the server. In this example I am using FlashFXP.

Step 3. Include the Font Files via CSS

Now that you have successfully uploaded your new fonts to the server it is time to include them in your theme CSS file.

To do this, you’ll first want to open up the CSS file provided in that folder you downloaded where you grabbed your font files – it’s often just called “stylesheet.css.” You’ll also need the stylesheet for your current WordPress theme open – Normally found “wp-content/themes/my-current-theme/style.css“

Once you open up the “stylesheet.css” file that came with font download with will have CSS styles that look like this:

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 21, 2013 06:56:23 PM America/New_York */

@font-face {
    font-family: 'CabinBold';
    src: url('fonts/Cabin-Bold-webfont.eot');
    src: url('fonts/Cabin-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Cabin-Bold-webfont.woff') format('woff'),
         url('fonts/Cabin-Bold-webfont.ttf') format('truetype'),
         url('fonts/Cabin-Bold-webfont.svg#CabinBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

I have removed all irrelevant information here above other variations of the font and have just left the styles pertaining to the variation of the font I want to use. You’ll also see that this CSS snippet includes the URLs to the font files you uploaded to your server. Copy the full snippet and paste it into your theme CSS file. I usually put these font include snippets at the bottom of my CSS file, because it keeps them out of my way for future edits.

You may need to make some changes to the URLs in the snippet, depending where you put your files. Remembering that earlier we created a folder called “fonts” inside our current WordPress theme to store the fonts. If you called your folder something different or placed them in a different located be sure to update the above code snippet with the correct path to the fonts.

Step 4. Add Your font-family Declarations

Once you know your CSS selector you want to allocate the new @font-face for, you can go ahead and edit your CSS file. The best way to do this is to figure out where in your CSS the font selection is currently coming from. For simplicity and ease of this example I am going to allocate the new font to all my page headings.

To do this, switch back to your theme CSS file and if you have not aloready allocated a font face for you headings add this line of CSS code.

h1,h2,h3,h4,h5,h6 { 
	font-family: 'CabinBold', Arial, serif;
}

If your CSS file already has a font allocated simply update that declaration instead of adding a new one.

What this CSS declaration does is allocates the new font ‘cabinBold’ ( Be sure to keep the name in the brackets ) to the specific headings. I also added the fonts “Arial, serif” as a fallback. You get the font name from the first line of the previous code snippet where it declares the name of the font.

Step 5: Test & Troubleshoot, If Necessary

The final step in the process is to test your current theme and make sure that the font is correctly allocated to the specific  CSS selectors you assigned them too. If your new font is not displaying here are some common issues that can occur when using these fonts:

Common problems with this particular process include:

• Your URL to your font files is incorrect (this will show as an error in Chrome Developer Tools)
• You didn’t add your CSS to the right stylesheet.
• You’ve got the wrong selector.
• Your new CSS is being overridden by another CSS selector.

If all is looking good, than great, enjoy your new @font-face.

Theme Highlights

Best for a firm or agency website

An agency WordPress theme perfectly suited for all kinds of creative websites, corporate and business firms and last but not least creative studios in search of a new and modern web presence.

Responsive experience

It doesn’t matter if they use desktops, tablets or smartphones, your visitors will enjoy the same remarkable experience. All the elements scale and resize depending on the device the website is viewed on.

Infinite color variations

You can change the colors, textures and bg images at the click of a button from the WordPress admin, so when we are taking about theme flavors, only your imagination is the limit!

One click auto install

No more fiddling with server settings & complex WordPress install process! Our WordPress themes have this unique feature that lets you enjoy your coffee while our framework auto-installs the theme.

Standard Features:

• Jquery Image Lightbox
• Dynamic Sidebar Widget Creation
• Feedburner Ready
• Auto Image Resizing
• Cross Browser Compatible
• Jquery Image / Video Lightbox
• Custom Widget (Prefix with Fuse)
• Powerful Admin Options

Screenshots

Interakt Homepage

Portfolio pages

The theme is packed with easy to use shortcodes

More details and/or purchase the Interakt Themefuse Responsive WordPress Theme