How to Create a Link to Files in a Web Folder
Designing and building a webpage can be a complicated and detail-oriented process, especially when you begin to combine multiple languages and technologies to achieve your desired result. The most efficient means of managing all of the files and data that goes into building a website is by creating folders for your element groups, such as an "Images" folder for all of your pictures, a "CSS" folder for your .css files and a "JavaScript" folder for all of your JavaScripts. You can create subfolders and links to the files as well.
Other People Are Reading
Instructions
-
Create Your Directory Structure
-
1
Create a folder that will hold your entire website project. This folder can be anywhere on your computer, but the desktop is probably the easiest place.
-
2
Make a new folder inside the folder that you created for your website project. Name this folder "Documents."
-
-
3
Take the document file that you have, such as a .doc, and put it into the Documents folder.
-
4
In your website folder, right-click and choose "New" > "Text Document." This creates a new text document in Windows. Double-click to open this text document. Choose "File" > "Save As." In the dialog box that opens, change the "File Type" to "All Files." Name the file "index.html" and choose "Save."
-
5
Copy the text below and paste it at the top of your new index.html file. This text simply identifies the page as an HTML (webpage) document and produces the basic opening and closing tags needed for all webpages.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head><body>
</body>
</html>
Create Your Link
-
6
Press "Enter" after the first "<body>" tag you see to start a new line, and type the following:
<a href="documents/myDocument.doc">Here is my document</a>
-
7
Substitute the name of your document for the "myDocument" name in Step 1. The actual document is given relative to where your webpage document is. The command above indicates that there is a "myDocument.doc" file in the "documents" folder of the current directory. Keep the quotes around the document location.
-
8
Change the text "Here is my document" to whatever you would like it to be. It is what viewers of your page will see as a link to click and open the document.
Your completed text file should look like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head><body>
<a href="documents/myDocument.doc">Here is my document</a>
</body>
</html> -
9
Save your new .html file and open it in a web browser (use the "File" > "Open" command) to make sure it is working properly.
-
1
Tips & Warnings
Instead of linking to documents with the "<a href=" "></a>" command, you can also link to pictures, videos or just about any other file on your web server by substituting the appropriate filename and location.
References
Resources
- Photo Credit link image by AGITA LEIMANE from Fotolia.com
