TechTipsApp

Technology tips blog

  • Articles
    Categories
    • Tech news
    • Internet
    • Social Network
    • Google
    • Geeky Tips
    • Android
    • Windows 10
    Top Posts
    • Install Windows XP from USB
    • Install Windows 7 from USB
    • Open Facebook When It's Blocked
    • Partition Hard Drive Without Formatting
    • Reset Windows 7 Password
    • About
    • Contact
    • Privacy policy
    • Advertise
    • Terms of Conduct & Copyright Policy

Integrate and Customize Outbrain Related Links Widget in WordPress Blog

Tanmay WordPress Leave a Comment

Outbrain is a free service to integrate the related links with thumbnails into your blog posts. It is pretty easy to use, good looking and all over, it consumes a great traffic for your site. Outbrain supports WordPress, TypePad, Blogger and many more blogging platforms. You can download their widget by matching with your platform after registering with Outbrain.
Recommended reading: Insert Pagination in Custom Archive Page for WordPress Blog.
After the successful registration, you can get your widget from here. If you are using WordPress then the widget comes in a form of plugin. This plugin adds the related links with thumbnails at the very after your content. But if you want to change the position of the Outbrain related links in your WordPress blog then it is tough to adjust the position by editing the plugin.

How to place Outbrain related links at any place of WordPress blog

To solve this problem you can use javascript instead of the plugin. To get the javascript for your blog:
1. Log-in to Outbrain and click on ‘Get widgets’ > select the recommendation type > choose other options and select ‘Javascript’ from the list of platforms (by the way, javascript is a platform independent script).
2. Put your blog URL, choose the language, do agree with the Outbrain’s ‘Terms of Service and Privacy Policy’ then click on ‘Get code’.
3. It will land you to the page containing the code with the installation guide.
Grab the code and paste it into your WordPress blog template where you want to show the widget after applying the following tweaks.
The code should look like this:

<script language='JavaScript'> var OB_langJS = 'http://widgets.outbrain.com/lang_en.js'; var OBITm = '1290512064730'; var OB_raterMode = 'none';var OB_recMode = 'strip'; var OutbrainPermaLink='DROP_PERMALINK_HERE'; if ( typeof(OB_Script)!='undefined' )OutbrainStart(); else { var OB_Script = true;  var str = unescape("%3Cscript src='//widgets.outbrain.com/OutbrainRater.js'  type='text/javascript'%3E%3C/script%3E");  document.write(str); } </script>

In the above code, replace DROP_PERMALINK_HERE by <?php echo currentPageURL(); ?>
and add the following code before the ?> sign at the end of your theme’s functions.php.

 function currentPageURL() { $curpageURL = 'http'; if ($_SERVER["HTTPS"] == "on") {$curpageURL.= "s";} $curpageURL.= "://"; if ($_SERVER["SERVER_PORT"] != "80") { $curpageURL.= $_SERVER["SERVER_NAME"].":".$_SERVER["SERVER_PORT"].$_SERVER["REQUEST_URI"]; } else { $curpageURL.= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"]; } return $curpageURL; }

[Via WebCheatSheet.com]
Note: You would think that why I did not put the WordPress permalink function to get the permalink of the post. Actually, the WP function does not work outside the loop.
That’s it! Enjoy the Outbrain related links with thumbnails at any position of your WordPress blog.

Post Tags: Javascript, Related link
Similar Articles from This Blog
How to Optimize and Defer Javascript in WordPress
How to Optimize and Defer Javascript in WordPress
How to Fix 404 Soft Errors in WordPress To Avoid Google Penalty
How to Fix 404 Soft Errors in WordPress To Avoid Google Penalty
How to Display Ads Only on Older Posts in WordPress Blog
How to Display Ads Only on Older Posts in WordPress Blog

Comments

  1. Radomir Basta :

    Great advice guys, I’ve just added Outbrain plugin just where I’ve wanted.
    Now, just one question about adding the code in the functions.php
    On Outbrain website that part isn’t mentioned so I’m a bit curious why is it important or necessary?
    Cheers and tanks!

    Reply
  2. Tanmay :

    Radomir Basta: Yes, it is essential if you want to show the post link at each related post.

    Reply
  3. gbengalex :

    How do you add it to a phpfox site? What do you replace the DROP_PERMALINK_HERE with?

    Reply
  4. Colin :

    This was super useful, thank you! Was about to give up before I found this, the Outbrain plugin is nearly impossible to customize otherwise – and the idea of creating some kind of custom filter melted my head.

    Reply
  5. shiv kumar :

    very very nice and useful information for me. thanks for sharing this

    Reply

Leave a Comment Cancel reply

Your email address will not be published. Required fields are marked *

About Us

Tech Tips App is a technology blog, looking forward to broaden the mental horizons of technical geeks round the web. Striving hard to quench your technical thirst, we have put our best efforts on the line of exhaust to satisfy your versatile technical vocabulary.

Recently Published

  1. Partitioning Hard Drive in Windows 7 Without Formatting
  2. How to Find My Contacts on Google Map
  3. Introducing SMS Organizer by Microsoft is the Best SMS App
  4. How to Fix Windows Update When It Gets Stuck
  5. How to Get Rid of Windows 10 Automatic Repair Loop [Solved]
  6. Best Antivirus for Windows 10 (Is Windows Defender Good Enough?)
  7. Best Facebook Messenger Bots to Get more out of Messenger
  8. How to Fax a Document From Your Smartphone
  9. Top Social Media Platforms You Should Always Know About
  10. Bitcoin vs Altcoin: Where to Invest? – Guide For Dummies

© 2021 Tech Tips App All Rights Reserved  Post Sitemap