AddThis smart layer have a recommended content feature that adds a recommended content box to your page. This box is by default will be placed at the end of the page. A normal user won’t notice this. To make the recommended content noticeable, you have to move it to someplace else. But, AddThis doesn’t support the positioning of the recommended content.
So, the only way to move the recommended content box is to find a hack. I found the hack and I’m going to share it with you. All your blog or website should need is a jQuery library loaded on the page and the AddThis Smart Layers Recommended Content Feature. The rest will be taken care by the script we are going to add.
You can see a demo if you scroll to the bottom of this blog just after the comments section. :
Add the following code before or of your HTML page. Or you can add this to a separate file and load it using tag.
var __subinsbdotcomAddThist=".at4-recommended-outer-container";
function __subinsbdotcomAddThisintervalTrigger() {
return window.setInterval(function(){
if(jQuery(".cloned-at4").length==0 && jQuery(__subinsbdotcomAddThist).length!=0 && jQuery(__subinsbdotcomAddThist).text()!="" && jQuery(window).width() > 1008){
jQuery(__subinsbdotcomAddThist).clone().addClass("cloned-at4").insertBefore("footer").wrap("<div style='z-index:99999999;position:relative;background:#F5F5F5;border-top:1px solid black;'></div>");
jQuery(__subinsbdotcomAddThist).not(".cloned-at4").remove();
jQuery(".at4-recommended-recommended").css("cssText","padding:10px 0px;opacity:1 !important;");
jQuery(".at4-visually-hidden").css("cssText","position: relative!important;");
window.clearInterval(__subinsbdotcomAddThis);
}
},2500);
}
var __subinsbdotcomAddThis=__subinsbdotcomAddThisintervalTrigger();
Mention the place where you want to show it by changing the insertBefore(“footer”) code. By default it will be appended before the . If you want to place it after the Disqus comment box, replace the insertBefore code with the following :
insertBefore("#disqus_thread")
The variables used in the code are unique, so that it won’t conflict with any other codes. When the page starts loading a function will start to initiate every 2.5 seconds. The function checks if the AddThis Smart Layers Recommended Content is loaded. If it’s loaded, then it will be cloned and moved to the place you mentioned. By default it’s above the .
If you need help in positioning the AddThis Smart Layer etc… post a comment and I will be glad to help you.