Hi! Before I go into my issue, I should mention that I am a designer and a newbie when it comes to PHP & WP development. Ok, I am developing a plug-in that should display the AddThis sharing buttons. I enqueued the script, converted HTML and JS to PHP variables, appended buttons to content and script to the footer. Once I activated my plug-in, my entire code printed on the screen in both the admin and on the webpage. Where did I go wrong? Thanks!
AddThis Sharing URL: https://www.addthis.com/get/sharing#.UfRfU2SgmYo
my code:
function add_this_sharing_enqueue_script(){
wp_enqueue_script(
'add_this_sharing',
'//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-51f45f596a3e1f1a',
array(),
null,
true
);
}
add_action( 'wp_enqueue_scripts', 'add_this_sharing_enqueue_script' );
function add_this_sharing_buttons( $content ) {
if ( is_single() ) {
$button_html = '<div class="addthis_toolbox addthis_floating_style addthis_32x32_style" style="left:50px;top:50px;">';
$button_html .= '<a class="addthis_button_preferred_1"></a>';
$button_html .= '<a class="addthis_button_preferred_2"></a>';
$button_html .= '<a class="addthis_button_preferred_3"></a>';
$button_html .= '<a class="addthis_button_preferred_4"></a>';
$button_html .= '<a class="addthis_button_compact"></a>';
$button_html .= '</div>';
$content .= $button_html;
}
return $content;
}
function add_this_sharing_script( $footer ){
$js_html = '<script type="text/javascript">';
$js_html .= 'addthis.layers({';
$js_html .= '"theme" : "gray",';
$js_html .= '"share" : {';
$js_html .= '"position" : "right",';
$js_html .= '"numPreferredServices" : 3';
$js_html .= '},';
$js_html .= '"whatsnext" : {},';
$js_html .= '"recommended" : {';
$js_html .= '"title": "Recommended for you:"';
$js_html .= '}';
$js_html .= '});';
$js_html .= '</script>';
$footer .= $js_html;
return $footer;
}
add_filter( "the_content", "add_this_sharing_buttons", 20 );
add_filter( "wp_footer", "add_this_sharing_script", 21 );