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.
Related
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.
I have created a custom tab for a Facebook page. Everything is displaying, the only issue happening is none of the link in that tab is working. Is there a special code that I need to add for Facebook Tab page in order to make the links work?
This is the facebook tab.
https://www.facebook.com/AstellasUS/app/2475799012460272/
And the links I have used basic HTML below
<li>Twitter: twitter.com/astellasus</li>
<li>LinkedIn: linkedin.com/company/astellas-pharma</li>
<li>YouTube: youtube.com/user/AstellasUS</li>
<li>Website: astellas.us</li>
They are “not working”, because those sites forbid being displayed inside a frame on a different domain, via the X-Frame-Options header.
Trying to open those sites inside the app iframe doesn’t make that much sense to begin with - so simply add target="_blank" to those links, so that they open in a new window/tab.
I'm writing some documentation using GitHub's built in wiki (using Markdown syntax).
The problem I have had with anchor tags is that once I have clicked that anchor once, manually scrolled down to it again, and try to click it, it won't work anymore.
a) The place where the anchor links jump to.
##<a name="listofactions">List of Actions</a>
b) An example of an anchor link
[Back to List of Actions](#listofactions)
I also tried html in markdown syntax
Back to List of Actions
And even tried linking to the full url with the # and anchor appended.
Back to List of Actions
They all work, but when I manually scroll down to the anchor link again and click it, it doesn't bring me back to (a) anymore. Unless I click on a different anchor link.
How can I write it such that the anchor links can work regardless?
There is nothing wrong with your Markdown. This is simply how browsers work. The first time you clink the link (when viewing the same page), the URL in the address bar of your browser changes from http://example.com/path/to/your/page to http://example.com/path/to/your/page#someanchor. As that is a different URL, the browser will navigate to the new URL by scrolling to the appropriate position on the page. However, as you read the page and scroll to a different position, the URL remains the same. Finally, the second time you click the link,the URL is already http://example.com/path/to/your/page#someanchor so there is no change in the URL and as far as the browser is concerned, you are already there so no navigation happens and the page does not scroll.
There may be some JavaScript tricks you can use to trick the browser into behaving as you want, but those won't work on GitHub as they won't let you include any JavaScript in your pages for security reasons.
What you could do as a workaround (assuming you have a long page and want to easily find the specific location again) is first click the [back] button (taking you back to http://example.com/path/to/your/page) in your browser's navigation bar and then click the [forward] button (returning you to http://example.com/path/to/your/page#someanchor) which should trigger the browser to navigate to the location and scroll the page.
Try this:
...
<a name="listofactions"></a>
## List of actions
Mind the blank line between the HTML tag and the markdown markup.
Then call it via [link-to-anchor](#listofactions)
Should work.
Hope to have helped!
Add the attribute target="_self"
I am attempting to link from my website to an outside website but the information that relates to the user is in the middle of the outside page. Can I make the link take them to there?
Thank you in advance
If that outside page has an anchor tag in or near the content you wish to link to, yes.
<a name="releventContent">
If the above code (or something like it) is present in the outside page, you can link to it from your site like so:
clicky
I can suggest you a dirty trick that might work or not too. Steps
Open the new link in an IFrame.
Create a javascript function that will accept the string to search as parameter.
On the bodyload call that function that will search for the text in the source file.
Some SO links
Filling an IFRAME with dynamic content from JavaScript
Read IFrame content using JavaScript
I've created a toolbar in html that I need to be able to load of any given webpage; I'm thinking of loading it on the page through the use of a bookmarklet but I can't quite get my head around how I go about doing it.
An example of what a need to happen is as follows.
I navigate to any webpage on the internet, I click the bookmark for my toolbar and it appears at the bottom of the page without affecting any of the content on the page, it will stay fixed even when scrolling.
I've added a picture of how the toolbar will look, any suggestions on how I can implement the required functionality?
http://d.pr/bVeM
Many Thanks
What you will need to do is use CSS to keep it at the bottom. Basically you stick your toolbar html code in a <div> tag and then use CSS to keep it at the bottom. Try reading this link or this link on how to do it
Create a script file that you can host somewhere (if it's just for you, you can use localhost). In that script build the toolbar. Your bookmarklet will look something like this:
javascript: document.body.appendChild(document.createElement("script"))
.src = "http://myserver/myscript.js"; void 0;
It wraps here for readability. It won't wrap in your bookmarklet.
The javascript: tells the browser you are executing a script. The void 0 at the end prevents the page from navigating to the return value of the JavaScript.