I am developing a website where user can upload multiple files (pdf,doc,xlsx....)
later i display the available files list to user ...When he/she clicks on the file name i want to open the file as a popup.
What I tried using iframes
https://docs.google.com/viewer?url=http://example.com/files/pages.doc
I am getting nothing..Can anyone Provied exact way to do it??`
<iframe width="560" height="315" src="https://docs.google.com/viewer?url=http://example.com/files/pages.doc" frameborder="0" allowfullscreen></iframe>
`
Just provide a link to the document like this:
Open document http://example.com/files/pages.doc
And let the browser work out how to launch it, it will either use a viewer, or launch an app to display it
Related
I want to display a PDF inside a Dialog of a Google Spreadsheet Add-on Dialog.
more about apps script dialog can be found here
https://developers.google.com/apps-script/guides/html/
<iframe id="iframe" src="https://www.w3docs.com/uploads/media/default/0001/01/540cb75550adf33f281f29132dddd14fded85bfc.pdf" frameborder="0" height="500px" width="100%"></iframe>
When I inspect, I see the message Resource interpreted as Document but transferred with MIME type application/pdf: "https://www.w3docs.com/uploads/media/default/0001/01/540cb75550adf33f281f29132dddd14fded85bfc.pdf".
Answer:
You can embed the Google viewer to display the PDF using an <iframe>.
Code:
<iframe src="https://docs.google.com/viewer?url=https://www.w3docs.com/uploads/media/default/0001/01/540cb75550adf33f281f29132dddd14fded85bfc.pdf&embedded=true" height="1080" width="1920"></iframe>
Just make sure to change the height and width attributes of the <iframe>.
Good afternoon, I will explain the problem in details. I'm connecting the TinyMCE editor version 4.6.4 to my site. It has plugins in the Media plugin through which you can insert media files into the editor.
Thus, I add video to the editor. Actually, you can add a video in different ways, and one of them is to give the editor a direct link, and I do so.
There is a parameter media_live_embeds in the initialization of the editor, which can be inserted into the position true or false, and if the parameter is inserted into true, then, the added video can be played directly in the editor.
The problem is that if I give a link to a video from my site (vvv.mp4 example), then, it does not play (as if the parameter is inserted in media_live_embeds: false).
But if for example I add a video link from youtube (example https://www.youtube.com/watch?v=q6_yRWPd4Yc) then it works.
Here on the screen there are 2 videos, the first one with youtube link, and the second with a link from the site, the first one is played directly from the editor, and the second one is not.
What's my mistake? Who had this problem?
Here is the editor, you can test yourself.
The name of the property is media_live_embeds so this will permit to played directly in the editor embeds media. When you insert a video URL, tinyMce construct embed video code integration :
<iframe width="560" height="315" src="https://www.youtube.com/embed/LIMYj5mpMM4" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
But when you insert a video from your website without create a url access to content video or from local files, tinyMce will create a html element : <video><video>. So you couldn't play it in the editor since it wasn't and embeds media url.
I trying to display my ppt with long time where the screen should run continuously in web page where the file is in my local folder but it is not showing in web page. The code is below :
<!DOCTYPE html>
<html>
<body>
<iframe src="lp.ppt" width="800px" heigt="600px" name="iframe_a"></iframe>
</body>
</html>
can anyone help to display ppt in html page.
You can use Google Docs to serve as your document viewer. You just need to upload your file and use the share link as the iframe src.
You can get the embed code by uploading your file and opening it in google docs (in this case, Google Slides) then click the file tab and click the Publish to the Web. From there you can copy the embed code. Make sure that the file is public! :)
<iframe src="https://docs.google.com/presentation/d/17nlO95lz91-shRep16UiJl-3EAxv-MnOFH718ku2gtw/embed?start=false&loop=false&delayms=3000" frameborder="0" width="960" height="749" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
<iframe src="https://docs.google.com/presentation/d/17nlO95lz91-shRep16UiJl-3EAxv-MnOFH718ku2gtw/embed?start=false&loop=false&delayms=3000" frameborder="0" width="960" height="749" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
Hope this helps!
I'm adjusting a website with twitter bootstrap display for mobile devices, I'm trying to add a button like this one, so that when a user would click on it, it would open up "google maps" or "Apple maps" with the address respectfully.
How can I go about achieving this?
I'm currently using google maps html embed snippet, like this.
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d405691.57240383344!2d-122.3212843181106!3d37.40247298383319!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808fb68ad0cfc739%3A0x7eb356b66bd4b50e!2sSilicon+Valley%2C+CA%2C+USA!5e0!3m2!1sen!2sca!4v1450487299459" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
however end user need to copy and paste the address on his phone, and its time consuming.
Any ideas?
Thanks
I have a new smart phone and simply using the content from the link "View Larger Map" the one provided by Google inside the Google iframe automatically calls a navigation request and I can then select Google Maps and then set as default to it always does this.
simply enclose inside
I'm on Android 5.1, but I bet it works on IOS.
Give it a go, it worked for me :-)
I used embed tag to show a pdf file on my html page and it is displaying the pdf file very well on a desktop and laptop browser but that is not showing the pdf file on moblie and talbets , is there any way I can make them appear on mobile as well .
Here is the concerned code :
<embed src="assets/img/jimbosmenu.pdf" width="900" height="900">
Here is the link to live page .
http://jimbosjoint.com/menu
You need to use object, not embed
<object data="filename.pdf" type="application/pdf" width="100%" height="100%">
<p>Your web browser doesn't have a PDF plugin.
Instead you can <a href="filename.pdf">click here to
download the PDF file.</a></p>
</object>
show it from google docs like that:
<object width="900" height="900" data="https://docs.google.com/gview?embedded=true&url=http://jimbosjoint.com/assets/img/jimbosmenu.pdf"></object>
The <embed> tag is outdated. Consider using the <object> tag. However, it might be a better option to link to the PDF file, so the mobile user can view it in full screen.
<object> tag will not display pdf on mobile chrome; The solution is to use <iframe>:
<iframe src="filename.pdf" title='SOME_TITLE' />