I have a Github page, which uses, of course, Jekyll. I have already embedded there pdf file that I have in the system with this code:
<object data="img/mypdf.pdf" type="application/pdf" width="1000px" height="800px">
</object>
Now I need to preview the json file in a similar way, but I can`t find a way for it to work. I have already this:
<a href="docs/myjson.json" download>Click to open (or right-click and "Save link as") </a>
I would like to avoid copying the content and pasting it on the page every time. It would be much easier if the content from json file is embedded and it would "preview" on the page every time myjson.json is replaced. Can you help me?
Related
I have a basic html code to preview some pdf
<iframe src="file.pdf" />
But from time to time, should depend on the user browser config the file is downloaded and nothing is displayed in the preview. Is there any way to force the preview ?
I also tried
<object data="file.pdf" type="application/pdf">
<embed src="file.pdf" type="application/pdf" />
</object>
But not compatible on all browser
This is the older way of doing it. Now these methods have started to be deprecated.
Few methods by which you can implement this is:
Google Docs Embed
You can upload the file on google docs and get the embed link from the share option and embed it into the site using iframe.
Pdf.js
This is a library in javascript that helps in dealing with pdf files.
I have a posts page which stores every individual blog. And each blog has a pdf file. I can upload the pdf via the blog page but when I execute my code through the for-loop on posts - post.file_doucment_path it just shows the pdf file location. Do I need to add a seperate js pdf reader package to get it working? Cheers.
HTML5 <object> element can embed PDFs in a page without an external library.
<object data="the.pdf" width="1000" height="1000" type='application/pdf'/>
Just replace "the.pdf" with your file document path with Jekyll syntax.
e.g.
<object data="{{ post.file_document_path }}" width="1000" height="1000" type='application/pdf'/>
<object width="900" height="900" data="https://docs.google.com/gview?embedded=true&url=http://example.com/mydoc.pdf"></object>
I embed PDF on my site using the above code. The GoogleBot does not "see" the pdf embedded. The page has no other visual content on it except a link to download the same PDF. I want the bot to read the PDF and want the page to show up in SERP.
Will it work? If not, what are the options?
Is this possible? Everything I'm google leads me to converting markdown to PDF. But I want to display a PDF image in a markdown file. This is my example:
If i use a regular image, it works just fine. Also I'm aware of converting PDF to image.
Markdown itself doesn't have a mechanism for embedding a PDF. However, Markdown accepts raw HTML in its input and passes it through unaltered. So the question you might want to ask is: How would you embed a PDF in HTML? In other words, what HTML would one use to have a browser display a PDF embedded in an HTML page? You would just include that HTML in your Markdown document.
You can find lots of suggestions in answers to the question: Recommended way to embed PDF in HTML?. For example, this answer provides a nice solution with a fallback for older browsers (all credit goes to Suneel Omrey):
<object data="http://yoursite.com/the.pdf" type="application/pdf" width="700px" height="700px">
<embed src="http://yoursite.com/the.pdf">
<p>This browser does not support PDFs. Please download the PDF to view it: Download PDF.</p>
</embed>
</object>
I have found a better way by using xfun R package.
xfun::embed_file("homework.pdf")
This will embed your pdf file in the output of the Rmarkdown. MOre information can be seen via link.
I hope you will enjoy this.
I wrote this HTML code on the HTML gadget of blogger -
<embed name="2playlist"
src="2playlist.m3u"
width="300"
height="90"
loop="false"
hidden="false"
autostart="true">
</embed>
But it's not working. I have little knowledge of HTML, I found this code online. Any suggestions?
Thank you.
The main problem is in your src="2playlist.m3u". You should set the source by hotlinking the .m3u file, for example: http://example.com/music/2playlist.m3u because blogger have no directory system like WordPress.
This code uses three kinds of files: html, m3u, and mp3. The code you posted loads a music playlist (m3u), which in turn loads audio files (mp3).
Make sure all these files are in the same directory (folder):
your html file containing posted code
2playlist.m3u
all the audio files listed in your m3u file
If you need help creating the m3u file, see step one at http://www.quackit.com/html/codes/create_music_playlist.cfm.
Edit: Since blogger doesn't support directories, you need to put the absolute file path rather than the relative file path. Basically, rather than putting src="2playlist.m3u, you need to have an m3u file somewhere on the internet, and you need to put it's url there instead of 2playlist.m3u.