How to make a Link inside an iframe open in new tab - html

so I have a web page I've been working on that uses embedded Google Docs in an iFrame to keep it updated without having to hard code notices/updates.
I came across a problem, where if you were to click on a link it opens in the iframe instead of opening in a new tab, which is preferable. I've tried things like:
<base target="_blank" />
Any ideas on how to accomplish this? (Note that with Google docs I can't find a way to change the way links are handled, so I'd need to do that on the end of the main page.)

Related

Adding href link in google sites through embedded code

There are three pages in my sites.google.com named (index.html, data.html, test.html). I created the three files using "Full Page Embed" option in Pages section. I am having issue with adding hyperlink of data.html inside index.html
I tried
Data
Data
while trying the above ways, a link automatically adding up like https://2004xxxxxx-atari-embeds.googleusercontent.com/embeds/16cb204cf3a9d4d2xxxxxxxxxxx/data.html and giving 404 error while accessing it.
I also used the direct link Data but many browsers blocking it, saying its external
Anyway to add hyperlink to the page inside the pages through embedded code itself
I am able to use target="_blank" which opening the links in new tabs but is there a way to show in the same tab (I used target="_self" but it blocking)
It sounds like Google is using frames that live in a completely different context for this full page embed feature. Since that is the case, I think you need to use absolute URLs to link to the other pages on your site from that location:
<a target=_top href="https://example.com/data.html">Data</a>
The target=_top makes the link apply to the whole window, not just in the frame.

target="_blank" opens in new tabs in firefox but not chrome (Svelte)

I have a small single page application with a few internal links and a few external links. I want all of the external links to automatically open in a new tab and so I have set the html as follows:
<base target="_blank" />
This works great in chrome. When I click links on my navbar, my site navigates within the same tab, and when I click on an external link it dutifully opens in a new tab.
However, when I visit my website with firefox (several versions tested), every single link, even the internal ones on my navbar, opens in a new tab.
How can I correct this so that only external links open in new tabs on all browsers?
Thanks
The static solution would be to be explicit on internal links, that is, adding target="_self" to those.
If you don't want that, Javascript might also be able to help, depending on your setup.
Assuming your internal links are all relative or at least server-absolute links, and assuming your page is static (like links are not added to the page after DOMContentLoaded), the following Javascript snippet would solve the task:
document.addEventListener('DOMContentLoaded', () => {
for (const externalLink of document.querySelectorAll('a[href^=http]'))
externalLink.target = '_blank';
})
Google
Some internal link
As another dude has pointed out, of course this only works if your links are accessible from the document (not if they reside inside a shadowDOM).
As per #connexo's comment, I solved the issue by explicitly stating
target="_self"
in the navbar links.
You need to set the target specifically for external links, if you want to override browser default functionality. Make a link component that does this.

Disabling target="_blank" in iframe from opening new window? (or possible work arounds)?

I have an issue-
I'm creating an html 5 app and including external websites in with an iframe. Inside the external website some of the links have
target="blank"
When clicked, this exits out of my app and opens up and entirely new window. Ideally, I want to keep them inside the iframe which allows them to use my app navigation (and is the point of an app).
Unfortunately I don't think I'm going to be able to achieve this with frontend technology alone. I'm looking for ANY solution. What I need is to basically get the "iframe" to act as its own window and my nav to be an entirely separate piece.
My current code base is html5, css, javascript, php (but possibly looking into integrating in node.js).
Here is a fiddle showing the issue: http://jsfiddle.net/zmx9e/

How do I make a link for jumping to another section of the page?

I'm making an apps script on a Google site, and I'm embedding it with a gadget. I would like to make a link within the gadget that can jump down to another section of the page, but I have not found a way to do this. I found the anchor command, but it opens the link in a new page by default.
Is there any way to jump to a specific section of a page using apps script without re-loading the page in a new window?
Thank you
What you are looking for is an anchor tag. Check this reference: https://developers.google.com/apps-script/class_anchor

Automatically open external links with iframe?

I am working on a WordPress site that has a lot of authors. The stories often contain external links, and I am looking for a way that we can automatically have external links open with a small header that has a "Back to our site" link, along with a close button.
Ideally this would be done automatically, but we'd also like to be able to create links manually that open in this same sort of iframe with our header. How can I go about setting this up?
I suggest you build this via Javascript, so you could easily turn it off/on as needed and it will be kind of portable too and you can use it on other site as well.
steps to do:
Go through all the anchor links and if the href is external link, add attribute target blank, and change the href links
if(external_link){
a.target = '_blank';
a.href="http://example-ownsite.com/iframe_holder/?page=" + a.href;
}
Then take a look at my page on http://fedmich.com/works/odesk/
so you could provide a vertical scrollbar on the iframed page.
Im using a function called resizeIframe() there
Note: some sites dont want to be placed inside iframe and they will breakaway from the topframe.