If you are a blogger or own a website then your foremost objective would be to get people to your website. In other words, it could be said to increase the number of followers and subscribers. You must have seen lots of websites during browsing that when they ask for your email, they also provide free gifts like plugins for websites, pack of icons and electronic books. This is a good way to get traffic on websites. Some websites require tweeting as a medium for increasing the number of people on that website.
Below, I will present a tutorial which will enable you to learn about creating a WordPress reward for a Tweet plugin. This will be done to gain more tweets for your content.
Anyone who will tweet for your content will get the reward. It is the primary motive behind this tutorial. A freebie will be offered by you for the tutorials or each blog of yours. The moment anyone goes and tweets for the content, a link of downloading will appear in front of the users. These links could be different, such as tutorial files, for any special reward etc.
How to create the Plugin Files?
Your first task for creating a plugin is to make a new folder. It should go with the name Reward-Tweets. Place in the wp-content/plugins directory. After this, make an index.php file in the folder you have created. When you are done with it, the next step would be to give information about the plugin on above the index.php file, which can be done by some comments as are given below in the code.
/* Plugin Name: Reward for a Tweet Plugin URI: http://innovativephp.com/ Description: Provide additional links or freebies for a tutorial for tweeters. Version: 1.0 Author: Rakhitha Nimesh Author URI: http://innovativephp.com/about/ License: GPLv2 or later */
As you have entered this, a plugin would be seen on admin dashboard. It would have a link so that you plugin could be activated.
How to add reward for Tweets to your posts
Whatever posts you have on your website, they would have different rewards. Delete the reward link if you think you cannot provide anything for the post. Now the next step would be to put a textbox so that rewards links could be inserted.
Add Meta Boxes on the Post Screen
We have the option of adding custom fields by WordPress Meta Boxes. Check the coding below.
add_action('add_meta_boxes', 'add_reward_link_box' ); function add_reward_link_box() { add_meta_box( 'reward_link_box-id', 'Reward Link', 'display_reward_link_box', 'post'); }
- For making a custom Meta Box, use the add_meta_box which is inside add_meta_boxes.
- The unique ID is the first parameter for the Meta Box.
- In the second parameter, it is the title. In my case, it is Reward Link.
- After this is the function name. It is used for displaying HTML.
- Last parameter is type of post. For normal posts, it will just be post. If you are making use or reward links on custom type posts, then change the post name.
Let us look at display_reward_link_box function now. It shows the custom fields.
function display_reward_link_box(){ global $post; $values = get_post_custom( $post->ID ); $reward_link = isset( $values['reward_link'] ) ? esc_attr( $values['reward_link'][0] ) : ''; wp_nonce_field( 'reward_link_box', 'reward_link_box' ); $html = "<lable>Reward Link</label><input type='text' name='reward_link' value='$reward_link' />"; echo $html; }
- In the starting we get the Meta value by get_post_custom function.
- After this we see if Reward Link is there for current post. This could be done by using the post meta values.
- Once this is done, then make a WordPress Nonce value by the function wp_nonce_field. You must know that this function validates our request upon hitting the publish button. Give a specific key to the parameters here.
- The last part is to show the HTML label as well as the text for the Reward Link.
Save link to the database
Now our task is to save the link created. Below is the coding for saving the data to wp_postmeta table.
add_action( 'save_post', 'reward_link_box_save' ); function reward_link_box_save($postID){ if( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) return; if( !isset( $_POST['reward_link_box'] ) || !wp_verify_nonce( $_POST['reward_link_box'], 'reward_link_box' ) ) return; if( !current_user_can( 'edit_post' ) ) return; if( isset( $_POST['reward_link'] ) ) update_post_meta($postID, 'reward_link', esc_attr( $_POST['reward_link'] ) ); }
- Save a function with the name reward_link_box_save.
- Your current post ID will pass to this function itself once the post is saved.
- You must know that WordPress comes with auto saving option. But it is good to check the feature.
- It is now important to see whether the form created is valid by making use of nonce vale for the current request.
- Also check for editing posts option that whether it is allowed to current user or not.
- Now save the Reward Link by reward_link. Use the update_post_meta for it.
Checking different Scripts and Styles
Different scripts and styles are to be provided by wp_enqueue_scripts action. Below is the coding for it.
function apply_reward_tweet_scripts() { global $post; wp_enqueue_script('jquery'); wp_register_script("twWidget", "http://platform.twitter.com/widgets.js"); wp_enqueue_script('twWidget'); wp_register_script('rewardTweet', plugins_url('js/rewardTweet.js', __FILE__)); wp_enqueue_script('rewardTweet'); wp_register_style('rewardTweetStyles', plugins_url('css/rewardTweet.css', __FILE__)); wp_enqueue_style('rewardTweetStyles'); $config_array = array( 'rewardAjaxUrl' => admin_url('admin-ajax.php'), 'rewardNonce' => wp_create_nonce('reward-nonce'), 'rewardPost' => $post->ID ); wp_localize_script('rewardTweet', 'rewardData', $config_array); } add_action('wp_enqueue_scripts', 'apply_reward_tweet_scripts');
- For the scripts, we call apply_reward_tweet_scripts function.
- Then we add jquery and Twitter widget by the function wp_enqueue_script. This is the most recommended way for inserting scripts properly in the WordPress.
- To give tweet style and make buttons, use the Twitter widget.js file.
- A js script has to be added by the name rewardTweet.js. There is a custom style available as well as called the rewardTweet.css. This is used for different plugin functions and method.
- To give some value, the $config_array has to be given in the js script.
- After this, wp_localize_script is used for adding value above in the js file.
- For accessing data make the name of object as second parameter. For the array of value, third parameter is included.
Show Tweet Button
The scripts are already given to make the tweet button. The link only remains to be included. Add the code below to make it active.
function add_reward_tweet_button($content){ global $post; $tweet_meta_values = get_post_meta($post->ID,'reward_link'); $tweet_text = $post->post_title." - ".get_site_url(); if(is_single() && isset($tweet_meta_values[0]) && $tweet_meta_values[0] != '' ){ return $content."<div class='tw_reward_panel' ><div class='tw_reward_title'>Tweet and Get Rewarded <span class='tw_reward_button'><a href='https://twitter.com/share?text=$tweet_text&via=1stwebdesigner' class='twitter-share-button' data-lang='en' data-url='$post->guid' >Tweet</a></span></div> <div class='tw_reward_links'><a id='rewardLink' href=''>Click Here To Get Reward Link</a><div style='clear:both'></div></div></div>"; }else{ return $content; } } add_filter('the_content','add_reward_tweet_button');
- Initially we call the add_reward_tweet_button function on the_content filter. This filter will be applied for content of every post and page.
- Page or post content will be automatically passed to this function.
- Then we get the custom Meta values of the current post.
- We do not want to include this Reward Link in summary, category, archive, tag pages. We call the function is_single to ensure that this is the detailed post page.
- Also we check whether Reward Link exists for current post and display the tweet button.
- Reward Panel will not be visible if the post does not have a reward link.
- A reward panel as shown below will be under every post.
Give links for download on Tweets
After giving the tweet buttons and publishing it on the profile, the next step is to show the Reward Link. For this, Twitter Web Intents Events will be used. Now let us move to the part of JavaScript code.
$jq =jQuery.noConflict(); twttr.events.bind('tweet', function(event) { $jq.post(rewardData.rewardAjaxUrl, { action:"get_reward_links", nonce:rewardData.rewardNonce, postID :rewardData.rewardPost }, function(result, textStatus) { if(result.status == 'success'){ $jq("#rewardLink").attr("href",result.value); $jq("#rewardLink").show(); } }, "json"); });
- The first line used will help to prevent jQuery. There could be conflict with others so this query is used.
- After this, use twttr.events.bind(‘tweet’, function(event). This is for binding a function to our button of Tweet.
- Next we use the rewardData object. This is for getting data that we put in our script by using wp_localize_script.
- Once this is done, then make use of get_reward_links which is an action.
- After completing this, a JSON object will be received by you. It will have the reward link.
- Next we have to check what our status is. Then assign the Reward Link with button of Download and make it visible to the user.
Producing Reward Link
Send the AJAX request with your current post ID to the server. Check the code below for help.
function get_reward_links(){ global $post; $tweet_meta_values = get_post_meta($_POST['postID'],'reward_link'); if(isset($tweet_meta_values[0]) && $tweet_meta_values[0] != '' ){ echo json_encode(array("value"=>$tweet_meta_values[0],"status"=>"success"));exit; }else{ echo json_encode(array("status"=>"error"));exit; } } add_action('wp_ajax_nopriv_get_reward_links', 'get_reward_links'); add_action('wp_ajax_get_reward_links', 'get_reward_links');
This is our Reward for Tweet plugin completed. Different rewards could be posted and let your visitors enjoy by downloading them.
I hope this plugin will help you gain traffic on your website. For queries, feel free to contact me.
This is very effective wordpress plugins create tutorial. Thanks for sharing.