Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Open links in new tab inside of an iframe? WordPress

  • SOLVED

I have embeded some content using iframe on my wordpress site. Inside the content there are sever links to the parent site but I couldn't find a way how to open this link in new tab/parent just like we did for a normal target="_blank"

See the page here so it will be clear to you http://crownandgloryltd.com/mongolian-hair/
Click on product thumbnail it should open in a tab not on the iframe window.

Thanks !

2014-01-08 by Jihan Ahmed

Answers (3)

2014-01-08

Hariprasad Vijayan answers:

Try this method

Add <strong>id="iframe"</strong> for your iframe. And use the following script.

$(document).ready(function () {
$("#iframe").load(function () {
var ifr = document.getElementById("iframe");
var anchors = ifr.contentDocument.getElementsByTagName("a");
for (var i in anchors) {
anchors[i].setAttribute("target", "_blank");
}
});
});

Let me know if you need any help in this.

Jihan Ahmed comments:

no luck what your email or skype so if you can help me with this. I can give u admin access to the site.

Hariprasad Vijayan comments:

I had sent my skype in PM. Please check.

Hariprasad Vijayan comments:

Above code won't work. Because ajax calls to a cross domain won't work due to security issue.(I found this from some threads).

Jihan Ahmed comments:

Thanks for your time !

2014-01-08

Sai kumar answers:

Hi,

Please try this in javascript


function iframeRef( frameRef ) {
return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument
}

var inside = iframeRef( document.getElementById('iframeID') );

var links = inside.getElementsByTagName('a');

for (var i = 0 ; i<links.length ; i++){
links[i].setAttribute('target','_blank');
}

Just put an Id to your iframe and replace the name of id with iframeID in var inside = iframeRef( document.getElementById('iframeID') );

Hope it will helps you
Thanks

Jihan Ahmed comments:

I added this inside the head and <script type="text/javascript">

function iframeRef( frameRef ) {

return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument

}

var inside = iframeRef( document.getElementById('cs-01') );

var links = inside.getElementsByTagName('a');

for (var i = 0 ; i<links.length ; i++){

links[i].setAttribute('target','_blank');

}


</script>

if you check the sourcode u'll see the script is in head http://crownandgloryltd.com/cambodian-hair/

then on page

<div style="border: 0; overflow: hidden; margin: 15px auto 0; max-width: 736px;">
<iframe scrolling="no" src="http://victoriacole.co.uk/cambodian-hair/" id="cs-01" style="border: 0px none; margin-left: -196px; height: 2528px; margin-top: -481px; width: 780px;">
</iframe>
</div>

but with no luck .. what should i change.

2014-01-08

Balanean Corneliu answers:

Read this Jihan :
http://blog.futtta.be/2010/03/03/5-tips-to-tackle-the-problem-with-iframes/

maybe can help you with the iframes.