Search code examples
javascripthtmltumblrtumblr-themestumblr-html

How to force an external link to open on the same tab in a Tumblr theme?


Due to problems with autoscrolling, I had to replace my blog theme on Tumblr. On this new theme all external links open on a new tab, even after deleting all the target="_blank"> on the code.

When I try the code on the blog itself it puts the target="_blank"> back in the code.

If for example I leave a link like this:

<a href="EXTERNAL-WEB-SITE-GOES-HERE">
                    <svg class="social-accounts-icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 242.8 242.8" enable-background="new 0 0 242.8 242.8" xml:space="preserve">
    <path fill="#AAAAAA" d="SVG-VECTOR-CODE-GOES-HERE"/>
</svg>
 </a>

When inspecting the code on the blog using F12 on Chrome ends up like this:

<a href="EXTERNAL-WEB-SITE-GOES-HERE" target="_blank">
                    <svg class="social-accounts-icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 242.8 242.8" enable-background="new 0 0 242.8 242.8" xml:space="preserve">
    <path fill="#AAAAAA" d="SVG-VECTOR-CODE-GOES-HERE"></path>
</svg>
 </a>

I already tested the blog using both Chrome and Firefox and I get the same result.

You can check the blog code on this pastebin: https://pastebin.com/LpkPMugw

Thanks for reading.


Solution

  • You could use jQuery for that:

    <script type="text/javascript">// <![CDATA[
    jQuery(document).ready(function($){
        $('.site-content a').each(function(){
            if( $(this).attr('href') && 0 != $(this).attr('href').indexOf('#') ) {
                $(this).attr('target', '_self');
            }
        });
    });
    // ]]></script>
    

    If you add that code to your site it will change all links inside of the .site-content container to have a target=_self