View Full Version : Problem Referencing Files....

11-22-2007, 04:30 AM

This is getting frustrating trying to figure out how to organize my files and link them all together and make it easy to find them, too much staring at a computer screen.

click to see the website in question (http://www.deborahbrakeley.com/)

My problem is that I have a main directory with all my files in them, and within that directory or folder, I then have folders like "css", "articles", "books", etc. I keep all my css files in the "css" folder, my articles in the "articles" folder, and a bunch of pages I have that list books in the "books" folder.

In the document <head></head> of each file, I have no problem linking my style sheets since I either put

<link rel="stylesheet" media="all" href="css/content.css" type="text/css" /> if the page is in the main directory
<link rel="stylesheet" media="all" href="../css/content.css" type="text/css" /> if the page is located in a sub-directory.

The problem is I have a menu bar that has drop-down lists with links to all the pages of the site that displays below the header image on each page of my site, (most of which are in the main directory). But since my articles and book pages are all in sub-folders, all the links in the menu become broken when displayed in these pages since the <a href> attributes are written as if the file is located within the root directory. And It would be a lot of work to go through the code for the menu bar in each page located in a sub-directory and fix all the addresses so they know to jump up a level to the root directory to access the files.

On top of that, if you take a look here at an earlier post of mine (see here (http://www.codingforums.com/showthread.php?t=128151)) where I asked how to insert a section of code that gets repeated throughout the site, if I use the include command with php and insert my menu code on each page....how do I correctly link to the pages in the menu code if some of the pages I am inserting this code into need extra commands to jump up a level to access the files since they are in a sub folder?

Can anyone help me with this, even offer some suggestions on a better way to organize my whole site or ways they have found that worked....


here is the menu bar code:

<div class="menu">
<li><a class="hide" href="index.html" title="Deborah's home page">Home</a>
<!--[if lte IE 6]><a href="index.html">Home<table><tr><td><![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->

<li><a class="hide" href="#nogo">Counselling</a>
<!--[if lte IE 6]><a href="couns-mai.html">Counselling<table><tr><td><![endif]-->
<li><a href="couns-mai.html">Overview</a></li>
<li><a href="couns-app.html" title="various approaches">Approaches</a></li>
<li><a href="couns-emd.html" title="therapeutic techniques">EMDR</a></li>
<li><a href="couns-eft.html" title="therapeutic techniques">EFT</a></li>
<li><a href="couns-art.html" title="counselling handouts">Articles</a></li>
<li><a href="couns-boo.html" title="counselling books">Books</a></li>
<li><a href="couns-fee.html" title="counselling fees">Fees</a></li>
<li><a href="couns-lin.html" title="for more information on counselling and therapy">Links</a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->

<li><a class="hide" href="#nogo">Collaborative Divorce</a>
<!--[if lte IE 6]><a href="collab-mai.html">Collaborative Divorce<table><tr><td><![endif]-->
<li><a href="collab-mai.html">Overview</a></li>
<li><a href="collab-div.html" title="deborah's services as a divorce coach">Divorce Coach</a></li>
<li><a href="collab-chi.html" title="deborah's services as a child specialist">Child Specialist</a></li>
<li><a href="collab-par.html" title="parenting plans (printer-friendly)">Parenting Plans</a></li>
<li><a href="collab-agr.html" title="collaborative agreements (printer-friendly)">Agreements</a></li>
<li><a href="collab-art.html" title="collaborative divorce handouts">Articles</a></li>
<li><a class="hide" title="Recommended Books">Books
<img style="border: 0px solid ; width: 8px; height: 8px; padding-left: 85px;" alt="" src="images/arrow.gif" /> </a>
<!--[if lte IE 6]><a class="sub" href="#nogo" title="Recommended Books;">Books<span style="margin-left: 89px;">></span><table><tr><td><![endif]-->
<li><a href="books-col.html" title="books on collaborative divorce">Collaborative Practice</a></li>
<li><a href="books-res.html" title="books on conflict resolution">Conflict Resolution</a></li>
<li><a href="books-sep.html" title="books on separation and divorce">Separation &amp; Divorce</a></li>
<li><a href="books-cop.html" title="books on co-parenting">Co-Parenting</a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]--> </li>
<li><a href="collab-fee.html" title="collaboration fees">Fees</a></li>
<li><a href="collab-lin.html" title="for more information on collaborative divorce">Links</a></li></ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->

<li><a class="hide" href="#nogo">Background</a>
<!--[if lte IE 6]><a href="back-mai.html">Background<table><tr><td><![endif]-->
<li><a href="back-mai.html">About Deborah</a></li>
<li><a href="back-pre.html" title="presentations deborah has done">Presentations</a></li>
<li><a href="back-aca.html" title="deborah's academic background">Academic</a></li>
<li><a href="back-emp.html" title="deborah's employment background">Work Experience</a></li>
<li><a href="back-vol.html" title="deborah's volunteer backgroundt">Volunteer</a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]--> </li>

<li><a class="hide" href="#nogo">Latest Postings</a>
<!--[if lte IE 6]><a href="post-mai.html">Latest Postings<table><tr><td><![endif]-->
<li><a href="post-art.html" title="helpful articles">Articles of Interest</a></li>
<li><a href="post-ins.html" title="approaching life">Inspiration</a></li>
<li><a href="post-eve.html" title="upcoming events">Upcoming Events</a></li>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
<!--[if lte IE 6]></td></tr></table></a><![endif]-->

11-22-2007, 09:38 AM
absolute links:

11-22-2007, 06:12 PM
Or, if you're looking for it to be a little more dynamic, use a forward slash at the beginning of your HyperText reference. This also makes it harder for typos to be made. A forward slash character signifies your website root.

For example, instead of href="css/mystyles.css", try href="/css/mystyles.css". Here the first slash denotes http://deborahbrakeley.com/ (http://deborahbrakeley.com/), and any page on your server will recognize and be able to use this.

11-22-2007, 06:30 PM
Thanks for both your replies...

CyanLight... if I use that forward slash does it mean the both the files in the main directory and files in sub directories both will understand how to find the proper file?

also, what do you mean by this being more dynamic?


11-22-2007, 06:31 PM
also that makes sense for css files which I didn't have much of a problem with. How do I make proper links for the html files in the menu bar?

11-22-2007, 06:40 PM
1) Yes, any file.
2) This is more dynamic because if you copy your site to another domain, for whatever strange reason, you don't have to do a mass find & replace (which can be tricky if you're not using the right tools.)
3) Set the <a />'s href like this:
<li><a href="/pages/collab-mai.html">My Page</a>
Or use /articles/ or whatever directory you've stuck 'em in. Yayyyyy!
This is especially useful if you're using different folders for your content and it's just a really tricky mess. Huzzah.

11-22-2007, 08:20 PM
Thanks CyanLight,

I will do this. Just to confirm this makes my links not work when I am browsing my site locally correct? (if I address them with the forward slash)

11-22-2007, 08:26 PM
That's right. Use relative links & replace them before you publish it.

NB: The slash does technically work, but it references the C:\ drive of your computer.

11-22-2007, 08:45 PM
that makes sense now.... finally starting to get a handle of this site.
thanks for your help so far.

will likely have more questions later

11-23-2007, 06:35 AM
You mentioned changing the links to absolute links before I publish but that would be a lot of work to do. The alternative is not being able to link between pages when I am browsing locally. Is there any way around this. Is there a command in dreamweaver that can change all your links in a current site with one click??

11-23-2007, 03:50 PM
If you use Dreamweaver templates then your href/url problems can be solved, provided that all such href/urls are in the template. In the template, you specify the url to be relative to the location of the template. When Dreamweaver applies a template to a saved file, it adjusts the url to that appropriate to the location within the folder tree.

For an href/url not in the template, then Dreamweaver does offer a global site search and replace.

I avoid the absolute url (beginning with "/") for the very reason you mention, that this will not work when testing your files locally.

John Rostron

11-23-2007, 05:03 PM
Of course it could. Just design in the C:\ drive of your computer. I do, and when I'm done I stick it in a subfolder