I need to display a PDF on a website and have it embedded inline.
The following code works if the data attribute is local, but not remote. I just get a large grey box in place of the PDF. I'm open to any solution as long as it works in all browsers. We are using Rails 3 and jQuery.
<object data='https://remotesite.com/uploads/pdf/5/mypdf.pdf' type='application/pdf' width='100%' height='100%'>
<p>
It appears your Web browser is not configured to display PDF files.
No worries, just <a href='https://remotesite.com/uploads/pdf/5/mypdf.pdf'>click here to download the PDF file.</a>
</p>
</object>
And i try this code
<iframe src="http://people.seas.harvard.edu/~chong/pubs/oopsla04.pdf" width="100%" height="300">
<p>Your browser does not support iframes.</p>
</iframe>
But not work with Arabic file like " ملف المتسابقين.pdf"
Thanks,
Related
I want to embed pdf files in my html ( either using the embed tag or the iframe tag ).
I've tried the following two. All work well on firefox but not on chrome, chromium and android browsers.
<embed type="application/pdf" src="myfile.pdf"></embed>
<iframe class="embed-responsive-item" src="myfile.pdf" allowfullscreen></iframe>
I've also tried reading the pdf file with php and then using an iframe to display it like this
header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=".$_GET['pdf']);
#readfile($CONFIG['PDF']."/".$_GET['pdf']);
Again, this doesn't work on chrome / chromium and mobile browsers. It only works on desktop firefox.
I'm not sure if this is important information but I've also Set the X-Frame-Options "ALLOW-FROM mydomain.com"
Here you will find an example of what the issue is.
Is there any other way that I can embed a pdf file on a web page?
The Chrome browser on Android no longer supports PDF embeds. You can get this by using the Google Drive PDF viewer:
<embed src="https://drive.google.com/viewerng/
viewer?embedded=true&url=http://example.com/the.pdf" width="500" height="375">
You can also use Google PDF viewer for this purpose. You need to upload your PDF somewhere before and just use its URL:
<iframe src="http://docs.google.com/gview? url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>
I have a page on my site in Magento where the files inside it are shown.
The images with my php code show them without problems.
The pdf, ai, eps and svg files do not show them and do not allow me to see any preview.
How can I do?
Thanks
P.S. I don't want to use Imagemagick and iframe for this
You can do this using HTML object tag :
<object data="http://www.africau.edu/images/default/sample.pdf" type="application/pdf" class="pdfview" width="700" height="600" >
<p>Alternative text - include a link to the PDF!</p>
</object>
<img src="http://localhost/research/coding-challenge/SampleSVGImage_23kbmb.svg" />
But for .ai and .eps no option to preview. You can do only thing convert that into .pdf or image format
I have pdf link file coming from cloud server and i put it into iframe to show it but when i open the page, it direct to download this pdf file and didn't show the file itself, also i used embed and object and it doesn't appear anything.
<iframe src='{$finalurl}' width='1000' height='1000' align='center'></iframe>
Are you required to use an i-frame?
And do you just want to show it, or download it to your 'own' server and show it? That's a big difference.
If you just want to show it (and keep it where it is):
<embed src="http://cloudservice/yourpdf.pdf" width="1000" height="1000" type='application/pdf'>
Good luck
<body>
<iframe src='howto.pdf' height='800px' width='500px'> </iframe>
</body>
This code works fine(show iframe)when i just simple open howto.php in a browser. But when i open this php file in localhostserver it doesn't show the iframe, idm poup and say us to download the file. (( i save this file as howto.php ))
if your pdf has a public url you can use google pdf viewer in this way
<iframe src="http://docs.google.com/gview?url=yourPdfUrl&embedded=true" style="width:800px; height:500px;" frameborder="0"></iframe>
replace yourPdfUrl with your real pdf url e.g. http://www.example.com/myDoc.pdf
Currently I am using the standard way to embed an pdf to the browser, however, the built-in pdf viewer for my target browser is not working as expected. I would like to force (Chrome, Firefox and IE8 (if possible, but IE9+ is also ok)) to use the adobe reader. The problem is , I can only change this option manually. Is there any way to change the option in HTML/ JS/ PHP ? Thanks.
<OBJECT data="YourFile.pdf" TYPE="application/x-pdf" TITLE="SamplePdf"
WIDTH=200 HEIGHT=100>
shree
</object>
I try to find the solution and someone suggested header, not working unfortunately e.g.
Content-Type: application/pdf
Content-Disposition: inline; filename.pdf
You can use Google PDF viewer to embed pdf files on to your website. Use this link https://docs.google.com/viewer
Example:
<iframe src="https://docs.google.com/viewer?url={HTTP PATH OF THE PDF FILE}&embedded=true" width="600" height="780" style="border: none;"></iframe>
https://docs.google.com/viewer?url=http://research.google.com/archive/bigtable-osdi06.pdf
Check out PDFObject which is a Javascript library to embed PDFs in HTML files. It handles browser compatibility pretty well and will most likely work on IE8.
In your HTML, you could set up a div to display the PDFs:
<div id="pdfRenderer"></div>
Then, you can have Javascript code to embed a PDF in that div:
var pdf = new PDFObject({
url: "https://sample.pdf",
id: "pdfRendered",
pdfOpenParams: {
view: "FitH"
}
}).embed("pdfRenderer");
Cheers
Trick Chrome and Firefox (and maybe other browsers) into displaying the PDFs using the Adobe Reader plugin (for full PDF Open Parameters support among other benefits) by using one of the following 'Adobe PDF in XML Format' types in your embed code:
application/vnd.adobe.pdfxml
application/vnd.adobe.x-mars
This works fine as of my answer today and I'm hopeful it will continue to work fine. I'm using it currently with standard PDF files as a workaround for embedding PDF files in the browser that need to use the Adobe PDF plugin rather than the browser's built-in PDF rendering. Even though my PDF files are standard (non-XML) files, they appear to load just fine with this new application type parameter.
<OBJECT data="YourFile.pdf" TYPE="application/vnd.adobe.pdfxml" TITLE="SamplePdf"
WIDTH=200 HEIGHT=100>
shree
</object>