Blog

Taking Control of What’s Next and Recommended Layers [UPDATED]

You’ve probably installed the What’s Next, and Recommended Layers on your site/blog, and you’re thinking to yourself, “Why is that blog post with kittens doing yoga showing up in the layers?!”

blog_image_template_aug2

Well, the easy answer is because people love watching kittens doing yoga. The not-so-easy answer is that your visitors are constantly sharing and driving more visitors to that page, which signals that the page is trending and should be recommended to other visitors. Then again, you have lots of other great content that you want to appear in those layers as well. So I’m here to help you take control of your layers.

Built into Smart Layers is the ability to filter and take control (to a certain degree) of what links show up in the What’s Next and Recommended Layers. This is done through the linkFilter property which is documented in our API. The basic idea is that you define a function that will be passed the link and layer and you decide if you want it to show up.

Now let’s go through an example of how to filter out the fictional blog post about kittens doing yoga.

First, find your Smart Layers code. It should look something like this:

addthis.layers({
    'share' : {},
    'whatsnext' : {},
    'recommended' : {}
});

Next we are going to add “linkFilter” to our configuration object and define our function which will be passed the link and the layer:

addthis.layers({
    'share' : {},
    'whatsnext' : {},
    'recommended' : {},
    'linkFilter' : function(link, layer) {
        console.log("URL", link.url);
        console.log("Title", link.title);
        console.log("Layer", layer);
        return link;
    }
});

You should also notice that I added some console.log messages to output the URL, title, and layer. This is really useful to debug what’s going on under the hood. You should also see that at the end of the function, I’m returning the “link” object. By doing this, I’m telling Smart Layers that I want to show this link. If I don’t want Smart Layers to show this link, I would return “false” instead.

So now I’ll update my example and filter out any link that has “kitten” in its title:

addthis.layers({
    'share' : {},
    'whatsnext' : {},
    'recommended' : {},
    'linkFilter' : function(link, layer) {
        if (link.title && link.title.indexOf('kitten') >= 0) {
            return false;
        } else {
            return link;
        }
    }
});

That was pretty easy right? Okay, so now I’ll do a slightly more complicated example where I’ll filter out specific titles and URLs:

addthis.layers({
    'share' : {},
    'whatsnext' : {},
    'recommended' : {},
    'linkFilter' : function(link, layer) {
        if (link.url && link.url.indexOf('http://www.mysite.com/kittens-doing-yoga') === 0) {
            return false;
        } else if (link.title && link.title === 'Kittens doing yoga') {
            return false;
        } else {
            return link;
        }
    }
});

The previous example works great for filtering out a single string or URL. But suppose you had multiple pages of kittens doing yoga. Here’s another example that shows how to filter multiple URLs:

addthis.layers({
    'share' : {},
    'whatsnext' : {},
    'recommended' : {},
    'linkFilter' : function(link, layer) {
        if (link.url && (link.url.indexOf('http://www.mysite.com/kittens-doing-yoga') === 0 
           || link.url.indexOf('http://www.mysite.com/more-kittens-doing-yoga') === 0)) {
            return false;
        } else if (link.title && link.title === 'Kittens doing yoga') {
            return false;
        } else {
            return link;
        }
    }
});

I mentioned limitations earlier. To clarify, you cannot add a link or pick the link you want to have show up. You have the ability to filter out what you don’t want to display, but ultimately Smart Layers will choose what’s best for your visitor.

And there you have it! Now you can write your own custom rules to filter out specific links, or if you can come up with a regex, you could even filter out certain sections of your site/blog!

How have you used Smart Layers so far? Have you done any customizations to it? We’d love to see it!

  • john

    It still incomplete – should work with:

    (link.url && link.url.indexOf(‘kittins’) !== -1)

  • Sol

    Hi Mike, sorry, looks like my last reply didn’t get posted. To help you troubleshoot this, can you contact our Support group? And when you contact our Support group, be sure to include a link to your site so we can troubleshoot your code. Thanks.

  • Mike, if you haven’t already, send us an email to help@addthis.com and we’ll be happy to take a look.

  • Tony Margiotta

    Is there a way I can change the picture for the Recommended Layers at the bottom of my site? Each recommendation is showing the same picture and it looks stupid. Thanks!

  • Hi Tony! There is a way to fix that. In your other comment, we asked if you could email our support team with your site URL so we can take a look. That would help us figure out how you can fix the images: help@addthis.com

  • Tony Margiotta

    Thanks Mike. I did read that article and everything else I could find. I use Weebly for my site and when I go into the html editor, and input the open graph tag, I lose other content in my site. I’m probably doing something wrong.

  • Tony Margiotta

    I wish there was someone on the internet who has used open graphs within the Weebly interface who I could learn from but I haven’t found anyone.

  • Great article and thanks for sharing. Is there a neat way to filter out your homepage and also the current page your reader is on? I think it makes sense to exclude these from Recommend Layers.

  • Sarat

    Thank you for the blog. When a link filter is added and false is returned on a page, does that mean the Recommended for you is not going to appear on that page?

  • Can you clarify: are you trying to hide a page from showing up in your Recommended Content Footer, or did you want to get rid of the Footer altogether?

  • Sorry for the delayed response. LinkFilter is your best bet to manually prevent the obvious pages (like the homepage) from showing up in your recommendation widgets. (If by “neat way” you mean “code-less” then you can hide pages with a few clicks in AddThis Pro.) But as you mentioned, we are aware of the bug causing the page you’re on to also appear in the recommended widgets, and we’re working to fix that. :)

  • Thanks! I figured out a way to exclude homepage and the current page your reader is on and a few other useful bits which are specific to Blogger integration.

    http://www.project-internet-millionaire.com/2014/02/how-to-setup-addthis-blogger-filter.html

  • Great write-up!

  • Sarat

    I am not trying to hide it. I am trying to show articles only that have news in the URL. I implemented the linkfilter and am returning false if news is not in the URL. So, does this mean on some pages, the recommended wouldnt not show up, because it returns false since news is not in the URL ?

  • As long as there are other trending content pages that have news in the URL, the recommended content will appear. Does this make sense? Feel free to send us an email if you have more questions: help@addthis.com

  • Joni

    I have added smart layers and selected whats next ansd recommended but nothing (except the social media buttons) are showing on the page – the code ‘whatsnext’ : {},
    ‘recommended’ : {}
    is included – have I missed something?

  • Seems like you did it correctly, and it does take 24-48 hours for the recommended content to populate. If you’d like, email us your URL and we can take a closer look: help@addthis.com

  • lars2i

    hi, sorry, i really tryed, but i could not figure out, where to put this code. “First, find your Smart Layers code” was simply not possible for me. Can you please explain this here or in the post above? thank you

  • It might be best for you to send our support team an email. Please send a note to help@addthis.com with more information about what you’re trying to do.

  • Little South

    Is there a way that you can prevent ‘old’ content (in my case events) displaying as recommended content? ie: not show show content if it is over a certain time ago?

  • There is a way to do it, but it takes a few steps. If you’d like, send our support team and email with your URL and details of what you’re trying to achieve, and they’ll be happy to assist you: help@addthis.com

  • Hey guys. Currently using the Smart Layers and have installed it for quite some time now. Everything seems fine, except the Recommended Layers. They do not show up at all. Please help!

  • Hey guys. Currently using the Smart Layers and have installed it for quite some time now. Everything seems fine, except the Recommended Layers. They do not show up at all. Please help!

  • Sorry we missed your message! Have you sent an email to our support team? If not, send them your URL so they can check it out: help@addthis.com

  • Rahul

    Is there any way to scale images (Thumbnails)

  • We rely on the og:image tag that’s specified on your site and then have your browser resize the thumbnails to fit properly. Since we don’t save any images on our servers, the thumbnails aren’t scaled. Does that help answer your question?

  • Is this article up to date? I can not find the code on my website.

  • Quite possibly! If you’re using the AddThis dashboard, you have just one line of code that allows you to make all your edits right in the dash.

  • kilinkis

    where shall I put this code? thanks

  • Hats

    I suppose this is old and not functional any more ?!?
    Tried to apply the above in the magento plugin, but once I add the ‘linkfilter’ function to the code the whole layers block simply vanishes! I tried more of the above snippets (from simplest to more complicated) every time with the same effect: the left layer block simply dissapears from the site. If I take the “linkfilfer” off and leave the rest of the code, everything is OK and the layer is back.
    Is this linkfilter function still working? Of not, what about writing a note above?
    If yes, could you pld check the functionality again? Smth. is definitley wrong there …

  • Hi there, could you please send an email to help@addthis.com with these details and the URL for the site where you’re experiencing this issue? We’ll then be able to take a closer look for you and better assist.

  • may I ask is there a way to exclude contact-us, privacy-policy etc from recommended content widget? thx 4 advance

  • Hello! Yes, you can choose to hide certain pages from showing up in your recommended content by adding them here: https://www.addthis.com/dashboard#hide