WordPress has risen in popularity amongst the business community in the recent years. It is also become the chosen open source solution to implement several different solutions for many different web development companies around the world. The fact that WordPress websites are very good at promotion (from the SEO perspective) has worked for them and thus many prefer to use it.

WordPress which has been developed using a popular language PHP offers a large number of free and paid plugins for the users to install to enhance the functionality of their website. But not all websites developed are the same. It is often happens that the organization requests some special features to be implemented on their website which is not necessarily available as a plugin. In this case the Web Development company is left with only one option and that is to make a customised plugin to choose the specific needs of their client.

That is what this article is all about – how to make your own WordPress Plugin. This article explains the process in a step wise method. Here we will be explaining the process involved to develop a WordPress plugin that enables us to hide or lock certain content on our website that is meant only for the premium customers. Although the process to build any other plugin is essentially similar.

The Plugin:

• This is a content locker plugin that will have the following features:

• The user must share the content URL on Facebook in order to read it.

• The content is displayed only to the users that are registered and logged in on the website.

• Thus to start with you will need to have a WordPress installation at your disposal. You can start by creating a new file in your favourite text editor by the name devpub-conditional-content.php. (you are free to use any name you choose, but using the naming convention mentioned here will make it simpler for you to develop your own plugin in the future). The PHP code for the file is mentioned below which essentially sets up the plugin and registers its name and version with WordPress.

<?php

/*

Plugin Name: Developers Pub Conditional Content

Description: This plugin provides a shortcode that let you hide premium content to users until they log in or share with facebook

Version: 1.0

Author: Dev Pub

*/

?>

The Plugin – Shortcode:

In the same file devpub-conditional-content.php further below some more code is added as mentioned below to create the shortcode and ‘hook’ it to the action hook. For those who are completely new to WordPress, ‘hook’ is used in WordPress to integrate the actions and complete their functionality.

<?php

// registering the shortcode

add_shortcode ( ‘premium-content’, ‘devpub_conditional_content’ );

// the shortcode function

function devpub_conditional_content ( $atts, $content ) {

extract( shortcode_atts( array (

‘method’ => ”

), $atts ) );

global $post;

// check for facebook method

if ( ‘facebook’ != $method ) {

if ( is_user_logged_in() ) {

// We return the content

return do_shortcode($content);

} else {

// the login link

return ‘<div>You need to <a href=”‘ . wp_login_url( get_permalink( $post->ID ) ) . ‘”>Log in</a> to see this content</div>’;

}

// the facebook method

} else {

// checking cookies

if ( isset( $_COOKIE[‘devpub-lock’][$post->ID] ) ) {

// return to content

return do_shortcode( $content );

// request user to like content

} else {

return'<div id=”fb-root”></div><div>Please share this post to see the content <div data-href=”‘ . get_permalink( $post->ID ) . ‘” data-layout=”button_count” data-action=”like” data-show-faces=”false” data-share=”false”></div></div>’;

}

}

}

?>

Thus we have now successfully registered the shortcode which can be used like this: [premium-content method=””] Premium Content Goes Here [/premium-content]

The Plugin – JavaScript and Style files:

JavaScript is utilized to handle the cookie creation and the Facebook callback functions. The JavaScript file is called conscript.js and the code is mentioned below:

function createCookie( name, value, days ) {

var expires;

if ( days ) {

var date = new Date();

date.setTime( date.getTime() + (days * 24 * 60 * 60 * 1000) );

expires = “; expires=” + date.toGMTString();

} else {

expires = “”;

}

document.cookie = escape( name ) + “=” + escape( value ) + expires + “; path=/”;

}

(function( $ ) {

$(function() {

FB.Event.subscribe( ‘edge.create’, function( href ) {

createCookie(‘wptuts-lock[‘ + wptuts_content_locker.ID + ‘]’, true, 9999 );

location.reload();

});

});

}( jQuery ));

We will also require a stylesheet file which we will call constyle.css. The code for this file is mentioned below:

.devpub_conditional_content {

width: 80%;

display: block;

border: 3px dashed #ccc;

padding: 20px;

text-align: center;

margin: 20px auto

}

.devpub_conditional_content div.fb-like.fb_iframe_widget {

overflow: hidden;

}

The Pugin – Registering the Script and Style:

Edit the file devpub-conditional-content.php and add the following content to register the JavaScript and Stylesheet files.

// registering the javascript and stylesheet

add_action( ‘wp_enqueue_scripts’, ‘devpub_conditional_content_scripts’ );

//activates the files only if required.

function ‘devpub_conditional_content_scripts() {

global $post;

wp_register_style( ‘devpub_conditional_content_style’, plugins_url( ‘style.css’, __FILE__ ) );

wp_register_script( ‘devpub_conditional_content_js’, plugins_url( ‘script.js’, __FILE__ ), array( ‘jquery’ ), ”, true );

if( has_shortcode( $post->post_content, ‘premium-content’ ) ) {

wp_enqueue_style( ‘devpub_conditional_content_style’ );

wp_enqueue_script( ‘devpub_conditional_content_js-fb’, ‘ HYPERLINK “http://connect.facebook.net/en_US/all.js” \l “xfbml=1″http://connect.facebook.net/en_US/all.js#xfbml=1’, array( ‘jquery’ ),”,FALSE );

wp_enqueue_script( ‘devpub_conditional_content_js’ );

wp_localize_script( ‘devpub_conditional_content_js’, ‘devpub_conditional_content, array( ‘ID’=> $post->ID ) );

}

}

In the above code we have used the function ‘has short code’ which makes sure that the javaScript and Stylesheet files are only included if needed and not otherwise.

Conclusion:

We were able to create a functioning WordPress plugin in a matter of few 100 lines of code. Though this is a fairly simple plugin, other more complicated plugins can also be created using a similar technique.

Alakmalak is best web wordpress web development company that became aware of the advantages of using WordPress as a solution for their clients very early and thus has been using since a long time now. Having successfully developed more than 2000 websites for clients from all around the world, Alakmalak has kept up with the new features introduced in each new point release of WordPress. Thus they are not only aware of the benefits of using WordPress but also possess the appropriate skill set to meet the requirements of their clients.

Connect with our team

• build a wordpress plugin
• building wordpress plugins
• how to build a wordpress plugin