Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Add a like button without a plugin in WordPress
add_action( 'wp_enqueue_scripts', 'pt_like_it_scripts' );
function pt_like_it_scripts() {
if( is_single() ) {
wp_enqueue_style( 'like-it', trailingslashit( plugin_dir_url( __FILE__ ) ).'css/like-it.css' );
if (!wp_script_is( 'jquery', 'enqueued' )) {
wp_enqueue_script( 'jquery' );// Comment this line if you theme has already loaded jQuery
}
wp_enqueue_script( 'like-it', trailingslashit( plugin_dir_url( __FILE__ ) ).'js/like-it.js', array('jquery'), '1.0', true );
wp_localize_script( 'like-it', 'likeit', array(
'ajax_url' => admin_url( 'admin-ajax.php' )
));
}
}
add_action( 'wp_ajax_nopriv_pt_like_it', 'pt_like_it' );
add_action( 'wp_ajax_pt_like_it', 'pt_like_it' );
function pt_like_it() {
if ( ! wp_verify_nonce( $_REQUEST['nonce'], 'pt_like_it_nonce' ) || ! isset( $_REQUEST['nonce'] ) ) {
exit( "No naughty business please" );
}
$likes = get_post_meta( $_REQUEST['post_id'], '_pt_likes', true );
$likes = ( empty( $likes ) ) ? 0 : $likes;
$new_likes = $likes + 1;
update_post_meta( $_REQUEST['post_id'], '_pt_likes', $new_likes );
if ( defined( 'DOING_AJAX' ) && DOING_AJAX ) {
echo $new_likes;
die();
}
else {
wp_redirect( get_permalink( $_REQUEST['post_id'] ) );
exit();
}
}
.pt-like-it {
display: inline-block;
position: relative;
height: 38px;
line-height: 38px;
padding: 0 16px;
outline: 0;
color: #57ad68;
background: rgba(0,0,0,0);
font-size: 14px;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid #a9d8b2;
vertical-align: bottom;
white-space: nowrap;
text-rendering: auto;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
box-sizing: border-box;
border-radius: 999em;
letter-spacing: -0.02em;
font-weight: 400;
font-style: normal;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-moz-font-feature-settings: "liga" on;
}
.pt-like-it:hover,
.pt-like-it:hover a {
border-color: #57ad68;
color: #468c54;
}
.pt-like-it > a.like-button {
border: none;
}
.pt-like-it .like-button:before {
font: normal normal normal 14px/1 FontAwesome;
content: '\f087';
margin-right: 3px;
}
.pt-like-it .like-count {
padding-left: 10px;
}
jQuery( document ).on( 'click', '.pt-like-it', function() {
var post_id = jQuery(this).find('.like-button').attr('data-id'),
nonce = jQuery(this).find('.like-button').attr("data-nonce");
jQuery.ajax({
url : likeit.ajax_url,
type : 'post',
data : {
action : 'pt_like_it',
post_id : post_id,
nonce : nonce
},
success : function( response ) {
jQuery('#like-count-'+post_id).html( response );
}
});
return false;
})
add_filter( 'the_content', 'like_it_button_html', 99 );
function like_it_button_html( $content ) {
$like_text = '';
if ( is_single() ) {
$nonce = wp_create_nonce( 'pt_like_it_nonce' );
$link = admin_url('admin-ajax.php?action=pt_like_it&post_id='.$post->ID.'&nonce='.$nonce);
$likes = get_post_meta( get_the_ID(), '_pt_likes', true );
$likes = ( empty( $likes ) ) ? 0 : $likes;
$like_text = '
<div class="pt-like-it">
<a class="like-button" href="'.$link.'" data-id="' . get_the_ID() . '" data-nonce="' . $nonce . '">' .
__( 'Like it' ) .
'</a>
<span id="like-count-'.get_the_ID().'" class="like-count">' . $likes . '</span>
</div>';
}
return $content . $like_text;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment