Placing Template Files in Subdirectories

If you are creating sub folders or directories in your template folder to place additional pages or .js files this may cause link problems with your menus and HTML pages. This is not recommended or supported by Allwebco Design, however, the following information will give you some guidelines.

Basic Linking Into and Out of Folders:
To create a link that links to a page inside a folder, add the folder name in front of the page name like the following:

<a href="foldername/about.htm">

To link up out of a folder add ../ in front of the page you are linking to:

<a href="../index.html">

Quick Solution For HTML Pages:
This solution is for an entire template placed inside a folder, or some template HTML pages placed inside a folder. In cases like this you can use the HTML "base href" tag on your pages. See HTML base tag at w3schools for details and use of the "base href" tag. This an example of this tag.

<base href="http://www.your-web-domain.com">

You can view an example "base href" tag in use at http://clickhereonlinemarketing.com in their WordPress blog.

Subfolder Notes:
  1. You must edit all the website pages that you intend to put in the new folder to make them work with the images and .js files that may be "up" a folder in your template.
  2. You may need to edit all .js files so they will work with files in the folders and also in the sub folders.
  3. You may need to hard code your text into the Flash header. See "Advanced users and the variables" on this support page.

EXAMPLE: Step A:
Make a sub folder of your website folder on your local hard drive.

Step B:
Put the HTML pages (or .js files) you want in the new folder.

Action:
Open any page you put in the sub folder in your browser. You can drag it into your browser to open it. You will notice that you will see no images and no header and the entire page is missing areas. This is because all the support files are up one folder. There are three ways to deal with this.

Fix Option #1: (Not Recommended)
Copy all the .js files and .swf files and the flash.txt and your "picts" folder into the new folder. The problem with this is that some links will no longer work and you will need to maintain two sets of everything.


Fix Option #2: (Somewhat Recommended)
You must tell every page you moved where all the support files are. You will need to put this: "../" in front of all of the support file calls. Images, .js files and .css files and links. The problem with this is the menu links will not work unless you maintain two menus. One with "../" in front of every link for the pages in the subfolder. The two dots and a dash tell the pages to look up one folder.

Here is an example: You will have something like this now for the .css file call in your HTML pages. (near the top)

<link rel=StyleSheet href="coolstyle.css" type="text/css" media="screen">

Add the code indicated in red:

<link rel=StyleSheet href="../coolstyle.css" type="text/css" media="screen">


Fix Option #3: (Highly Recommended)
This is what is known as Absolute Mode. First, upload your support files to your server using FTP software. Be sure to upload the "picts" folder and all the .js files, the .css file and the flash.txt. The page you are reading now is done in absolute mode. You can do a "view", "view source" to see how we have done this page.

After you have uploaded, edit one of the html pages on your local drive in the subfolder you created (see note above). You will put "http://your-domain.com/" in front of all the .js files, the .css files, the links and in front of every image. Here is an example (code in red has been added).

<link rel=StyleSheet href="http://your-domain.com/coolstyle.css" type="text/css" media="screen">

Now the page will know to look at your domain for the "coolstyle.css". You must do this with every picture and every file that is up one folder. You must also edit your menu.js and put "http://your-domain.com/" in front of all the links and images and also you may need to edit all the .js files to add your domain. You will need to do a lot of editing to your pages to make this work properly. Also, you may need to copy the "flash.txt" into your subfolder, or use a graphic logo for the protected pages.

You may want to do your menu.js totally in absolute mode, replacing for example: "index.html" with "http://your-domain.com/index.html" and the spacers "picts/spacer.gif" with "http://your-domain.com/picts/spacer.gif".


Note:
In most cases, using your domain (absolute mode) for calling files is more dependable. Be sure to edit the .js files with your domain as well as the .css files. (as seen above in red)

Allwebco Template Support


Allwebco Website Template Support


Allwebco Web Templates
Complete websites with built in scripts.
AllwebcoDesign.com
Web Template Support
Free Javascripts
Free scripts for any website or template.
Allwebco-Templates
Business Web Templates
Business Website Templates
HTML business website template designs.
AllwebcoDesign.com
Web Template Support
Shopping Cart Templates
Professional templates with built-in Paypal.
AllwebcoDesign.com



Website Template Support
Website Template Support