How to link files in a different folder

It's actually more simple than what it seems those sites you looked at made it out to be, and I have to admit, I haven't heard the terms "Main" folder ... "Secondary" folder used often in programming. The "Main" folder would be the Root Folder. In your example this would be your "Tunnel Vision Fitness" folder. It is the Root folder where every browser will look for the index.html (or index.php) file.

If you have many files / pages / stylesheets / scripts / ect. and you want to keep a neat File Tree, all other files would be in folders inside of the Root folder. So, you could have a CSS folder for all the CSS files. A JavaScript folder for all your scripts. Or, in your example, a page folder with the files for that page. Let's call these "page1.css" and "page1.html" (to save me typing ).

To access, think of it just like you would say it... "Page1.css is in Page1's folder which is in TunnelVisionFitness' folder, so the access would look like TunnelVisionFitness/Page1/Page1.css.

I hope this helps :)

Keep in mind, however, that as you move through the course, the organizational structure of the File Tree will become much more apparent as the the complexity of the instruction and pages increase. So, the how (and why) is coming.

Keep Coding! :)

Ok, i'm not 100% sure if this is the answer for your question but I'll try :p.

Let's start from the basics, we have a project folder with:

• style.css
• javascript.js
• index.html

1) To link them you have to use the link tag and the script src attribute, inside your index.html insert:

• For style.css (CSS Files)

  <link rel="stylesheet" type="text/css" href="style.css">
  

• For javascript.js (JS Files)

  <script src="javascript.js"></script>
  

2) Now, if your style.css and javascript.js files are inside custom folders like:

• css
  • style.css
• js
  • javascript.js

• index.html

• For style.css (CSS Files)

  <link rel="stylesheet" type="text/css" href="css/style.css">
  

• For javascript.js (JS Files)

  <script src="js/javascript.js"></script>
  

Thanks for your feedback. Yes I also heard the term root folder several times when looking but I am still having trouble. Like I said all my files are in the folder "Tunnel Vision Fitness" and I plan to put the pages for one of my pages into the folder "ebookdescriptions" which is a folder I have within Tunnel Vision Fitness". Within the "ebookdescriptions" folder I plan to have the files "advancedmensdescription.html" and "advancedmensdescription.css"

To link the css file "advancedmensdescription.css I set it up like this- <link rel="stylesheet" href="TunnelVisionFitness/ebookdescriptions/advancedmensdescription.css"> This still does not link "advancedmensdescription.css" to the HTML file. What am I doing wrong?

Yes I tried this. I dont known if the issue is I have all the files in another folder. Right now I have a folder titled "coding" which I keep all my different css and html files for different projects in. The site I am working on now is in a folder within this called "Tunnel Vision Fitness". Up until now I have had all the files in the folder "Tunnel Vision Fitness" but now I want to organize them and have a separate folder called "ebookdescriptions" within the "Tunnel Vision Fitness" folder. Inside the "ebookdescriptions" folder I plan on having the files "advancedmensdescription.html" and "advancedmensdescription.css". The problem is once I take these two files out of the "Tunnel Vision Fitness" folder into the "ebookdescriptions" folder it is not linked anymore. I have tried the methods mentioned so far but still nothing is working.

Yes this is what I wrote originally when I had the files in the folder "Tunnel Vision Fitness" When I made a new folder "ebookdescriptions" and placed "advancedmensdescription.html" and "advancedmensdescription.css" in it the page did not work. I tried <link rel="stylesheet" href="TunnelVisionFitness/ebookdescriptions/advancedmensdescription.css"> but that did not work either. I just cant see where I am going wrong.