I am new to html5 and am currently working with the example on the web page listed below:
http://www.mobilehtml5.com/post/371921120/tutorial-your-first-mobile-html5-app-the-basics
To host the html page, I chose to use Google Drive as I already use it for other documents. To set it up, I followed the instructions on this page:
https://support.google.com/drive/answer/2881970?hl=en
I created a new folder under my google drive called 'New Folder' and set the permissions to 'Public on the web'. I created a file called 'index.html' on my local hard drive and put the example html code into it, then uploaded that file into my google drive under 'New Folder'.
The problem:
The page # support.google.com says that to view the html page, one must click on 'preview'. However, when I do that, all I get to see is my code, not the rendered page. Also, the google support page says there is a URL like googledrive.com/host/... but my URL is different. When I click on my index.html file it shows the code and the URL is https://drive.google.com/?tab=wo&authuser=0#folders/....
Please help. I found the google support page very high level.
Cheers
1) Go to your "Public on the web folder"
2) The url should look something like: drive.google.com/?tab=mo&authuser=0#folders/xx_xxxxxxxxxxxxxxxxxxxxxxxxx
3) Instead of the "xx_xxxxxxxxxxxxxxxxxxxxxxxxx" you should have a folder ID (it'll be random letters and numbers)
4) Replace the "xx_xxxxxxxxxxxxxxxxxxxxxxxxx" in the following link with the folder ID from step 3)
googledrive.com/host/xx_xxxxxxxxxxxxxxxxxxxxxxxxx/myHTMLFile.html
5) There's one last step. Replace the "myHTMLFile.html" at the end of this step with the name of your html file name.
See more in picture
https://www.facebook.com/posteryucom/photos/a.503819206368192.1073741827.124941240922659/704847832931994/?type=3&theater
https://www.facebook.com/posteryucom/photos/a.503819206368192.1073741827.124941240922659/704843842932393/?type=3&theater
Related
I've created a very simple website in a Codecademy exercise that I'd like to upload to the Internet using Github Pages. Because you are unable to export your index.html and main.css files from Codecademy, I copy and pasted them into a word document, with the intent to get them in their proper file formats. However, I have been unable to find a source to convert these plain text files to .html and .css formats. Also, I've created an account on Github and a new repository, but the tutorial doesn't cover how to insert these two files into this repository.
How do I convert code from text in a document to .html and .css file format, and then insert these files into a Github repository? Thanks!
You don't need any special tools to convert plain text files to html or css.
You simply do it yourself as well.
Follow the steps to change .txt files to .html or .css:
Right-click on your index.txt or main.txt
Click on Rename from the list of options shown
Then it will take you to editing the file name
Navigate the cursor and delete txt
Type html in txt's place
Press Enter
Then you might receive a prompt asking if you are sure. Click on Yes/use .html whichever is appropriate for your prompt.
Voila! you have your file extension changed
Follow a similar approach to change the files to css as well
*Please note that my screenshots are from Mac OS and may look different from yours depending on the Operating system you are using
Hosting Webpages on Github:
Github pages website gives you a step by step guide with visual illustrations on how to do it.
If you are looking for a more comprehensive guide, then please refer to this page.
Seems nonsense, but after struggling a lot with Github Pages I have tested (and worked):
duplicate your first html file and rename it as index.html
drag and drop it into the /docs folder
drag and drop the remaining html files to the /docs folder (including the one you
have duplicated, of course with it´s original name)
commit changes
Goto Settings / Github pages and
Go down till “Github Pages”
Clic on the down arrow in [None] and select “main”
Clic on the down arrow in [/root] and select “/docs”
Clic on [Save]
After a few minutes you will see in [Settings] / “Github Pages”
Your site is published at
https://your_account_name.github.io/your_repo_name/
When I reference a .pdf in my webpage, the file doesn't open when I click on the link. I referenced the .pdf with the full path and the file is in the www folder.
When I hover over the link online, I can see that the link is to my .pdf on file but it doesn't open.
What am I doing wrong?
Thanks (HTML newbie)
Edit 1 - reference:
Filename
Edit 2:
I tried the local links extension and it still isn't opening. I also tried <a href="http://www.example.com/myfile.pdf"> and I get a 403 Forbidden error.
Modern browsers block links to file:// URLs from pages that aren't themselves on a file:// URL, and in the same directory tree.
This is a security feature. There are workarounds that you can install locally so it works on one specific computer. See this Mozillazine article.
Sorry - I don't have the rep to comment. But it looks like your ref structure could be wrong.
Try something like:
<a href="http://www.example.com/myfile.pdf">
UPDATE: Hmmm?
Have you tried just:
<a href="myfile.pdf">
Also, I found this which (while not directly relevant) has some discussions and links that may assist: How to set height on PDF file when linked to from HTML?
^^ Ignore that - it really is more related to how the pdf opens.
FURTHER:
I am assuming the pdf file name has no spaces in it. I also assume you have a local pdf viewer.
So I had a look at a random website which had a pdf link as an example. When clicked, it opened the pdf in a new tab. I am on chrome.
You may be able to use that to figure out what is wrong.
Here is the page: http://www.staff.uwa.edu.au/procedures/communications/media/uwanews
Looking at the pdf for the first listed file, this was their link:
Issue-10-December-2014 [PDF File, 2.0 MB]
It looks like path should be enough, but you might want to add the target="_blank" to open in a new tab.
Maybe also see this, which shows that users set how a pdf is opened - perhaps the settings on your end need to be set up: How to open link to pdf file in new tab using html
Anyway, I wish you the best. Post your answer when figure it all out.
I have found ways to embed a public folder from Google Drive on my website. This is done like this:
<iframe src="https://drive.google.com/embeddedfolderview?id=FOLDERID#list"></iframe>
You can also link directly to a public file like this:
http://drive.google.com/uc?export=view&id=FILEID
The Google Drive embedded view shows the list of files in that public folder. Clicking on the file you are redirected to Google Drive file preview page, from where you can download then file. I would like to skip this step and allow visitors to my page to click on a file and initiate this download immediately. Is this possible?
Go to where your file is located on Google Drive click on File - top left corner.
Then "right click" on the option named -Download- this will give you the direct link to your file so that you can use it as the download link.
I tried to think about it but I can't find good answers for my website. Let say I have a folder (online) with one PDF file in it. I want to have a link to it, no problem.
Problem :
Now let say somebody else is going to change that pdf file with another one. The first pdf is deleted and the new pdf file has a different name... so my html link is broken.
Question :
How can i create a link that will open the single pdf file in that folder (no matter if the pdf file is replaced and renamed later) ?
I'm open to any solution even javascript or using google drive or don't know what other method. The best would be a link that works like http://mywebsite.com/folder/*.pdf or something like that.
THANK YOU & good luck to find the answer:)
Use a server-side redirect. This wiki page explains this and gives snippets for PHP, ASP.NET and JSP. Where you redirect to is an outcome of enumerating the PDF files in your folder.
The page that executes this code is the published URL to your PDF. E.g. http://mywebsite.com/folder/pdf.aspx.
I have some PDF's sitting in a folder on my computer, is there a way to write a link to open them on to a webpage?
The main idea is when the site goes live the link will be used to download the pdfs from the folder, but obviously at a later stage the folder will be a temp folder on my website.
So at the moment i just want to open the pdfs from a link, and the final goal will be to have the links download them.
Can any one help me?
This is the file path to get to the pdf i want to link to.
C:\Users\Shaun\Documents\FormValue\CS1.pdf
How would i create the link?
If you want to have a link to a PDF, you just have to put the relative path to the file in the href attribute of an a tag. So let's say you had a folder called pdfs, with the file boom.pdf inside it, and folder called site sitting beside it, with the file site.html in it. Then all you'd have to do is put this link in the html file:
Link to a pdf
In most (all?) browsers now a days, that will open the PDF in a new tab. To download it you would right-click it and do the Save Link As thing. Just need to get the path in href right.
UPDATE
If you want to use the full path to the file, you need to prefix it with file://. Then you just put it in the href the same as with a regular link, ending up with something like:
Link to a pdf
This should work with your set up, but if the pdf and the html files are stored near each other, relative URLs are still a good option. A little bit of Google work should show you how to write those.
For each PDF just do what I talk about here.
<object height="950" data="sample-report.pdf" type="application/pdf" width="860">
<p>It appears you don't have a PDF plugin for this browser.
No biggie... you can <a href="sample-report.pdf">click here to
download the PDF file.</a>
</p>
</object>
It works with most browsers and it degrades nicely.
It sounds like youre asking if you can put a link on a web site to a PDF sitting on your computer. You can't. The files have to be either on another web site or on your site's server.
If you are using ASP.NET, you can have the link point to a handler that accepts a query string identifying the file, either by file name or a hash of the file. Then the handler can look in the folder for a file that matches the pattern, read the file as a byte array, and then write those bytes to HttpResponse.