• Feed RSS

Top WordPress Plugins from CodeCanyon: November Edition

"WordPress is a powerful content management system, and the vast array of plugins available certainly helps. CodeCanyon has long been a great place to find top WordPress plugins. From content and security to galleries and sliders, there’s plenty to choose from. Here’s a quick rundown of some of the most popular WordPress plugins available at CodeCanyon.


1. UberMenu

UberMenu is a user-friendly, highly customizable mega menu ( or mega drop down menu ) WordPress plugin. It works out of the box with the WordPress 3 Menu Management System, making it simple to get started but powerful enough to create highly customized and creative mega menu configurations.

2. uBillboard Slider

uBillboard is a Premium Slider for WordPress. It is a jQuery based slider with a multitude of transitions and options for you to be able to customize it to your needs while not overwhelming you with options you never wanted or needed. Version 3 is a revolutionary release with most of the codebase rewritten from scratch. This has enabled us to integrate many features that you have been requesting during the first year.

3. WordPress Video Gallery

The most advanced stock video gallery in the world! Now as a WordPress plugin!

4. Styles with Shortcodes

This plugin lets you customize content faster and easier than ever before by using Shortcodes. Choose from 100 built in Shortcodes!

5. Lightbox Evolution

Lightbox Evolution is a tool for displaying images, html content, maps, and videos in a “lightbox” style that floats overtop of web page. Using Lightbox Evolution, website authors can showcase a wide assortment of media in all major browsers without navigating users away from the linking page.

6. Font Uploader

This plugin lets you upload your own font files and apply them to any element of your website without requiring a knowledge of html or css.

7. Custom Backgrounds

With WordPress 3.0 a new feature was introduced called custom backgrounds for WordPress themes. This feature gives you the ability to add custom backgrounds on your site, which will give your site a unique touch.

8. WordPress Email Newsletter

Easily send mass emails to your existing wordpress user database.

9. 5 Second Google Maps

Simple Google Maps integration with no API keys, no setup and no code editing.

10. Special Recent Posts

It’s the perfect solution for online magazines or simple blogs and it comes with more than 60+ customization options.

11. Security Ninja

Years of industry’s best practices on security combined in one plugin! Perform 25+ security tests including brute-force attacks.

12. Visual Composer

Add columns/elements with one click, then use your mouse to drag elements around to re-arrange them. Control element width with simple mouse clicking.

13. Foobar Notification Bars

A WordPress plugin for adding great looking notification bars to your site.

14. SocialPop

This plug-in adds social media sharing options under the content section on WordPress Posts and Pages. Currently supports sharing for 26 of some of the most popular social media sites.

15. Estro Slider

We have added a custom admin panel which will allow you to customise all aspects of your slider without having to touch a line of code. Drag n drop arranging of your slides, multiple slider insertion, skin selection, Ken Burns customisation, you name it, we’ve included it.

16. Premium Pricing Tables

WP Mega Tables are the perfect solution for those who are in need of a well designed and more importantly a easy to use pricing table in there wordpress themes.

17. Flip Book

Flip Book WordPress Pluginis based is on XML Flip Book / AS3 one of the three top selling items of all times on ActiveDen . It has been built from scratch. Almost everything you see on the page is easily customizable through the WordPress administration panel – easy installation, no coding skills required.

18. jGallery

The jGallery WordPress Plugin gives you a simple and customizable way to create a gallery on any post, page, or sidebar. You have the option to use widgets, shortcodes, or to manually insert your gallery directory into the template files.

19. Ninety Ajax Login/Register

Our Sidebar Login/Register plugin for WordPress does exactly what it says on the tin; Logins and Registrations with a touch of AJAX magic. Simple! It also has a nice ‘logged in’ view, and a lost password form for those forgetful folk.

20. Slider Evolution

Slider Evolution is a JQuery plugin that lets you easily create powerful javascript sliders with very nice transition effects. Enhance your website by adding a unique and attractive slider!"
read more

PHP for WordPress: Mastering Conditional Statements and Tags

"The conditional statements feature is an extremely useful and powerful feature in WordPress; still it remains unused in the development process. You can achieve many things by the simple and smart use of these statements. Sometimes when you need specific text or a unique image to appear on a specific page and not on any other pages in your site, by using conditional statements along with WordPress conditional tags you can achieve this easily without creating multiple pages or templates.


What are Conditional Statements?

PHP “If” statements are generally known as conditional statements. These statements are used within WordPress Theme files along with certain WordPresss functions defining the logic to inform the WordPress database what and how the content should be displayed based on a given criteria. These statements are very important in defining WordPress themes and are similar to creating template hierarchy.
Basic Conditional Statements look like this:
<?php if ( ) { ?>......<?php  } ?>
In layman’s terms, this is pretty simple:
If “something” exists/happens/etc., Do something.
You can (and probably will) use this type of general “if” statement inside WordPress all the time. WordPress has it’s own set of conditional statements as well though, so let’s take a peek at what those look like:

A List of Important WordPress Conditional Tags

Different types of Conditional Tags exist within Conditional Statements. These tags fetch particular information from the WordPress database. These conditional tags are defined for many different items in WordPress e.g. posts, tags, texts, images, categories etc.
Some of the most popular ones are-
1.is_page() - If you want to apply a certain condition to one of your specific page, e.g. “Contact Us” page. You can use this tag to refer to that page using its database ID number or title or slug/name. For instance:
is_page(’2')
or
is_page(‘Contact”)
2. is_category() – If you want to apply a certain condition to a specific category page e.g. Books, then this tag can be used to refer to that page using its database ID number or title or slug/name. For instance:
is_category(“4”) 
3. is_home() – This is used to refer to your home page.
4. is_single() – This is used for single page blogs, single posts or attachments.
5. is_tag() – This is used to refer to a tag archive page. It works similar to category page.
6..is_archive() – This is used to refer to archived pages.
7. is_search() – This is used to refer to search results pages.
8. is_404() – This is used to refer to a HTTP 404: Not Found error page.
9. is_author() – This is used to refer to an author archived page.
10. is_comments_popup() – This is used to refer to a comment popup window.
You can get the complete list of tags on the WordPress Codex page.

Learning by Example

This is all fine and well in theory, but let’s dig into some practical code examples of these conditional statements in action.

Example #1:

What should be the code to display an image on your first page, nothing on the second and some text on the third page? (These pages are hypothetical, you can replace them with your own page names, like Contact Us, About, Information, etc…)
<?php  if ( is_page('First_Page') ) { ?>
 <img src="image.gif" />
 <?php  } elseif ( is_page('Third_Page') ) { ?>
 <p>Here is some text….</p>
 <?php  } else { ?>
 <?php  } ?> 
Please Note-
These codes should be written in your writable theme editor on the page.php file where you want the conditional content to appear.
Extra Note: This is a multi-conditional statement (see the multiple “if, elseif, else…” running logic?) This code checks for the appropriate page using the tags and then displays the items accordingly. You can use unlimited conditions within a code.
is_page(array(‘First_Page’,’Second_Page’)) can be used to display something on both the pages.

Example #2:

How to display a text on either a single post OR a particular category page?
Here you need to use the “||” symbol to display something if any one of the given condition is met. If no condition is satisfied, it displays nothing.
<?php  if(is_category(Category_Page) ) || ( is_single(Single_Page))  { ?>
 <p>Display  this text….</p>
 <?php  } else { ?>
 <?php  } ?>
 
Extra Note: We used the “||” here, which checks for any of the conditions… Alternatively, we could use the “&&” to create an AND condition, in which both the condition must be met in order to display the item. The “!” is used for excluding something from the list.
E.g. !( is_page(Excluded_PageName)). You can also use variables to refer to the sub pages of a parent page. E.g. post->post_parent=="Parent_Page_Name"

Example #3:

How to load other items like CSS files, Java Script files in one of my pages?
This code snippet will show you how to display contact form files only on your Contact Us page.
<?php  if ( is_page( 'contact_us_page' ) ) {   ?>
 <link  rel='stylesheet' href='/contactusform.css' type='text/css' media='all' />
 <script  type='text/javascript' src=k'/jqueryform.js'></script>
 <script  type='text/javascript' src='/spec_forms.js'></script>
 <?php  } ?>

Example #4:

How to use conditional tags in your custom post types?
The mixture of custom post types and conditional tags makes a smart way to display information to the users. The following code snippet will enable you to display contact information at the end of your review posts.
<?php  if ( review_entry' == get_post_type() ) { ?>
 <div  id="reviewcontact">
 <p>If  you're impressed by the  reviews, kindly  contact us asap. Give us a call or <a href="/contact"  title="Contact Us">CLICK HERE</a> to send us a message!</p>
 </div>
 <?php  } ?>

Example #5:

How to check if a “post thumbnail” image has been uploaded or not?
The following code checks for an image and display another if not found.
<?php  if(posted_thumbnail()) {
 show_thumbnail();
 }  else {?>
 <img src="<?php  bloginfo('template_directory');?>/images/default_Image.gif" alt="Image not Displayed">
 <?php  }?>

Conclusion

Thus by mastering these little conditional tags and mixing them with php conditional statements, you can write less and do more in your WordPress site. This not only helps you during the maintenance of your site but it also helps to take advantage of the highly useful WordPress database architecture.
If you guys want to see more of these “basic PHP” tutorials for WordPress, let us know in the comments!"
read more

Load jQuery From Google CDN With Local Fallback For WordPress

"In this tutorial we are going to cover why loading jQuery from the Google CDN with a local file fallback is important, and how to set this up for WordPress. If you’re still trying to self-host your own copy of jQuery (or lots of other script libraries for that matter!), this is a great way to quickly improve your workflow.


Introduction

When I first took a look at HTML5 Boilerplate there was this great code snippet for loading jQuery from the Google CDN with a local file fallback.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
<script>window.jQuery || document.write("<script src='js/libs/jquery-1.6.4.min.js'>\x3C/script>")</script>

This was the greatest thing I’d seen on the topic of loading scripts for a while… Unfortunately, this doesn’t play well with WordPress, because we should be loading our JavaScripts using wp_enqueue_script, which we recently looked at in this article on using enqueue to properly load scripts inside WordPress.

So, here’s a way to accomplish the same thing in WordPress.


Why Use a Local Fallback File?

Why would I use a local fallback file at all?

The first reason for using a local file fallback is for your local development environment. Internet access isn’t always available when you’re working on your project. Let’s say you work for a web development firm and the companies internet server goes down. If you’ve been working on a script that is jQuery dependent, and you’ve been calling jQuery from the Google CDN. Well, you’re out of luck. Even if you have jQuery cached, eventually you’ll have to clear the cache to make sure the site is rendering properly, or switch to another browser to check cross compatibility.

At that point, you might as well take a long lunch. Which I’m sure your manager won’t be too pleased with. If you’re getting paid by the hour, no internet access isn’t an excuse for not working.

The same could be said if you were at home and the internet went down… or if you traveled to the latest WordCamp and couldn’t get internet access in your hotel. There’s nothing more annoying than being in the zone and having to stop just because you can’t load jQuery.

The second reason is what if Google goes down. Besides the usual rioting in the streets, airplanes falling from the sky, and a plague of frogs. Your site will break, and we can’t have that. The rest we can deal with. Just find a, out of the way, cave and cook up some frog legs.

Seriously though, it’s not likely that Google will ever go down. Google is so big that I’m sure they have backup servers for their backup servers, but you never know. Isn’t better to have a backup of you own, just in case?


Step 1 Where to Start

The script is going to be placed in you functions.php file.

The first thing we need to do is define some variables

<?php
$url = 'http://ajax.googleapis.com/ajax/libssss/jquery/1.6.4/jquery.min.js'; // the URL to check against
$test_url = @fopen($url,'r'); // test parameters
?>

$url is the URL the script is going to use to test against. In this case, we’re testing is the jQuery file on the Google CDN.

$test_url is setting up the parameters for the test.


Step 2 Setting up the Test

Now, let’s set up the main part of the test

<?php
if($test_url !== false) { // test if the URL exists
   //load the external script
} else {
   //load the local script
}?>

if($test_url !== false) is testing to see if it can open the URL we defined in the variable $url. If it can it will load the external script on the CDN. Else, if can’t open the URL it loads the local script on your server.


Step 3 Loading the External Script Function

Here we add the function to load the external CDN file

if($test_url !== false) { // test if the URL exists
   function load_external_jQuery() { // load external file
       wp_deregister_script( 'jquery' ); // deregisters the default WordPress jQuery
       wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'); // register the external file
       wp_enqueue_script('jquery'); // enqueue the external file
   }
 add_action('wp_enqueue_scripts', 'load_external_jQuery'); // initiate the function
}
  • wp_deregister_script deregisters the default jQuery that comes with WordPress. It’s usually an older version, so I like to use the the most recent version.
  • wp_register_script registers the external CDN jQuery with WordPress.
  • wp_enqueue_script will enqueue the newly register version.
  • add_action will initiate the function.

Step 4 Loading the Local Script Function

An else statement is used to load the local file is the test isn’t able to open the external CDN file

else {
   function load_local_jQuery() {
       wp_deregister_script('jquery'); // deregisters the default WordPress jQuery
       wp_register_script('jquery', bloginfo('template_url').'/js/libs/jquery-1.6.1.min.js', __FILE__, false, '1.6.4', true); // register the local file
       wp_enqueue_script('jquery'); // enqueue the local file
   }
 add_action('wp_enqueue_scripts', 'load_local_jQuery'); // initiate the function
}

This works the exact same way as the external file function. It deregisters the default jQuery, registers the local file, enqueues the local file, and initiates the function.


The Whole Script

Here’s the completed script

<?php
$url = 'http://ajax.googleapis.com/ajax/libssss/jquery/1.6.4/jquery.min.js'; // the URL to check against
$test_url = @fopen($url,'r'); // test parameters
if($test_url !== false) { // test if the URL exists
   function load_external_jQuery() { // load external file
       wp_deregister_script( 'jquery' ); // deregisters the default WordPress jQuery
       wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'); // register the external file
       wp_enqueue_script('jquery'); // enqueue the external file
   }
 add_action('wp_enqueue_scripts', 'load_external_jQuery'); // initiate the function
} else {
   function load_local_jQuery() {
       wp_deregister_script('jquery'); // initiate the function
       wp_register_script('jquery', bloginfo('template_url').'/js/libs/jquery-1.6.1.min.js', __FILE__, false, '1.6.4', true); // register the local file
       wp_enqueue_script('jquery'); // enqueue the local file
   }
add_action('wp_enqueue_scripts', 'load_local_jQuery'); // initiate the function
}
?>

This Works with Other Libraries Too!

If jQuery isn’t your cup of tea, there’s a CDN for that as well. Be sure to check out the entire hosted scripts library that Google keeps track of: http://code.google.com/apis/libraries/devguide.html . You can load everything from MooTools to Prototype in pretty much the same way that we’ve described above.


jQuery 1.7 Is Out!

Since writing this article, jQuery 1.7 has been released onto the Google CDN. (that’s a lie, we were promised this by November 7th, but we’re still in a holding pattern). Consider the MediaTemple CDN location instead if you want the latest and greatest version of jQuery for your WordPress projects: http://code.jquery.com/.


Conclusion

You can never be too careful and this script will alleviate of your worries about the jQuery library loading.

This can be expanded to include additional CDN resources. You can just add additional URL variables and else statements for additional CDN’s. You can also modified this to do the same test for your own CDN if you use it to load your CSS stylesheets."

read more

5 Cardinal Sins of WordPress Theme Development

"We talk alot on this site about tips and tricks for getting what you want out of WordPress… but today we’re going to take a step back from the technical stuff to look at some practices, bad habits, and coding faux pas that would be better left in our past. So, forgive the heavy-handed post title (haha!), we’re about talk bring up 5 surprisingly common practices that are blemishes on the platform.
Two of the nicest things about working on WordPress Themes is that fact that we get to target in an incredibly flexible environment (that is, the web) and we have solid documentation to help guide us through the process (that is, the WordPress Codex).
After all, if the theme works, does clean, maintainable code matter?
But there’s a danger that exists in theme development, too: we can completely forgo best practices for working with the web and completely ignore the documentation. Specifically, there’s nothing that forces us to write clean, maintainable code. After all, if the theme works, does clean, maintainable code matter? Furthermore, why go through the effort of following WordPress best practices if the theme appears to work fine?
Weak arguments, right? I don’t know – the more I’ve worked in the WordPress space, the more I’ve been surprised which how much bad code actually exists. As such, I thought it would be fun to outline five cardinal sins of WordPress Theme Development.

Ignoring The WordPress Codex

As with most programming languages, frameworks, or libraries, WordPress includes a massive amount of documentation. The WordPress Codex is arguably the best resource that developers have for working with WordPress. After all, it provides documentation for the majority of the application.
But the WordPress Codex often goes above and beyond standard documentation – in addition to supplying function names and parameters, the Codex provides rich examples for how to use many of the API functions. After reading any given article, you’d be hard pressed not to find a clear example of how to the function in question.
In addition to the API, the Codex also features a variety of other articles related to development:
Whenever I’m working on a theme or a plugin and I hit a point where I think I need to write a custom function to achieve something, I’ll search the Codex first. The majority of the time, a function is already available that helps with what I need.
Every serious WordPress Developer should regularly use the Codex when working on any WordPress-related development project. Ignoring it can often lead to creative, but untested and unstable solutions that can cause more harm down the line than good.

Not Localizing Your Theme

A few years ago, if you were to ask me my thoughts on localizing a WordPress Theme, I would’ve said that it would depend on the marketing that you’re targeting. That is, if you think the audience is going to use a language other than your own, definitely do it; otherwise, there’s nothing wrong with leaving the theme translated in your own language.
Fast forward a few years and WordPress’ is powering millions of sites on the Internet. Sites all over the world are using the application to drive their site’s content. On top of that, it’s becoming increasingly common for developers to supplement their income or even make a living off of working with WordPress.
Because WordPress has been so widely adopted and because the Internet has made the world so flat, the market for any given theme is not limited to a single language. On top of that, WordPress makes it so incredibly easy to localize your theme and it requires so little extra effort, that I now argue that localizing your theme is no longer optional.
For the most part, you need to understand three things:
Other than that, there’s very little extra overhead that comes with localizing a theme; however, I do recommend that you take a look at the Translating WordPress article in the Codex. It outlines the three things above and goes more in-depth on each.

Theme File Disorganization

Developers talk a lot about code organization and maintainability. Personally, I think that it’s much easier to give lip service to those principles than actually follow through with them, but they are important.
The thing is, they look different for each project type. Some applications are written in a single language and run on a desktop, some applications use two languages and run on a mobile device, other projects – such as WordPress Themes – can use anywhere from three (HTML, CSS, and PHP) to four (through JavaScript) languages. Additionally, certain components of the theme run on the client side, some run on the server side, some community directly with WordPress, and others communicate directly with the database.
To say that there’s potential to sacrifice maintainability is an understatement.
But it doesn’t have to be problematic as there are certain standards that WordPress suggests for organizing your theme files. Specifically, the Codex details how to organize your PHP template files, your stylesheets, JavaScript sources, and images.
  • Template File Checklist provides a listing of the files that compose a basic a theme and details what each should include.
  • Template Hierarchy provides an explanation for how all of the theme files fit together and how WordPress renders each during its page lifecycle.
  • Stepping Into Templates also provides a detailed breakdown of templates and the WordPress page structure for each.
  • Theme Development is a massive article that encompasses everything surrounding theme development.
Sure, it takes a little extra effort organize your files rather than just doing enough to “get it working,” but the dividends payout over time as you begin working on the next version of your theme or as multiple developers begin to work on the same codebase.

Disregarding Coding Standards

Of course, file organization is only part of the development process that affects organization and maintainability. Next, we have to focus on how we actually write the code that resides in our files.
After all, not only should we want to provide well-organized files, but easy-to-follow, standard-compliant code as well. Again, the WordPress Codex provides standard set for the major languages that contribute to a theme’s codebase:
A lot to process, huh? The thing is, spending time familiarizing yourself with all of the above pays dividends over time. Applying these standards at the beginning of development is exponentially cheaper than having to refactor an existing theme or plugin.
Additionally, it results in contributing better code back to the community.

Not Testing Your Work

After a theme has been developed and is ready for release, you should do – at the very least – a single of testing. That is, you should verify that the various styles of post data are formatted correctly, that your theme isn’t using any deprecated functions, or that it’s using any functions incorrectly.
Luckily, the Codex provides a number of suggestions and tools to help make this process much easier.
  • Debug mode helps to iron out any PHP warnings and/or errors
  • The Theme Unit Test is a data file including pre-formatted post data for you to run against your local development environment
  • Theme Check is a plugin that will examine that codebase of your theme and provide notes on what needs to be addressed as well as recommendations for improving the codebase.
Of course, there’s also additional testing you can do such as cross-browser testing, HTML/CSS standards compliance, and so on. The Codex outlines even more testing suggestions in the Theme Testing Process article.

What Are Your Own Pet Peeves?

They say that you often learn from your mistakes and I’ll be the first to admit that during my time with WordPress, I’ve broken every one of these. But, like the rest of the development community, you learn and you begin building better projects with experience.
This is the first of this type of “WordPress culture” articles that we’ll be posting on the site… so share your own experiences below – or better yet, write about them at length and we’ll publish it if it’s great!
That said, this is certainly not the definitive list and I’m sure there’s more to add (we haven’t even touched hacking the core, harassing the database, or hard coding elements that should have options). Drop your own pet peeves in the comments!
What are some of the most annoying, harmful, or unsustainable practices that you’ve come across?"
read more