Frequently Asked Questions
Caveat Emptor!
Information is the best defense against purchasing the wrong product.
Please do not buy our products if you have questions for which you can't find an answer here. eMail us or use our contact form first.
About TJK.Templates, in general:
What should I do before buying your product?
First of all, you should read this entire FAQ. Also, in addition, the Templates are fully functional. You should test them to see if the layout you like is really the layout that works for you. Most of our Templates include an "add content" link so you can see how the layout reacts depending on the content.
What are these Templates? Are they different from DreamWeaver™ templates?
Our "Design" Templates are not Dreamweaver™ Templates [.dwt files]. They are valid XHTML documents that create predetermined formats for page layouts. They are designed to be used as a starting point for each successive page within a web site.
Of course, if you've read deconstructing the Templates, you know that our Templates are much more than just some markup and CSS rules...
Do these Templates "work" with DreamWeaver™?
Sure. You can either use them "as-is" or save them as Dreamweaver™ Templates [File > Save as Template] and then create the editable regions you need. Dreamweaver's F1 key should get you started with the basics. If you later get stuck with a particular feature [i,e: Parameters & Expressions], you can always head to DMX-Templates.com.
DW is not a "WYSYWYG" authoring tool. It may have trouble properly rendering some Templates in its Design View panel (check this chart). So, for the convenience of Dreamweaver's users, we are supplying "Design-Time" Style Sheets (DW's help files (F1) tell everything about it). Note that our Templates do not need these Style Sheets in order to "work" in UAs. These .css files are only supplied to help Dreamweaver render the CSS and markup as a browser would.
Do these Templates "work" in every browser?
Our Templates have been tested in more than 15 browsers. 10 of our Templates are NN4.7 compatible; check this chart.
This chart does not include Opera 6.05, but you should know that our CSS disjointed rollovers do not work in this browser and that the layout of at least 3 of our Templates ("Dhtml", "Javascript" and "Blurry") appears broken (as a side note, nobody uses Opera 6.05).
Do the files for the Templates include fonts used in the graphics?
No, fonts are not part of the package, nor are special filters.
What are the "requirements" to edit these Templates? Do I need DreamWeaver™, FrontPage™ or Something else?
Because the files do not contain proprietary markup, you may edit them with a basic text editor (i.e. NotePad), as well as, a full blown authoring tool (Dreamweaver™, FrontPage™, etc.).
Editing the png file requires you to use a "PNG editor" (a program like Fireworks™, Photoshop™, etc.).
I'm a complete beginner. Are these templates for me?
We understand your concerns. We've dedicated a page to address this question.
What should I do following my purchase?
First thing you should do is read this entire FAQ again; then, move to "Basic Install" to check if it does not contain information not included in your package (erratum, etc.).
Once unzipping is completed, you should open "doc.pdf" to get yourself started. You should also read the comments in the .(s)html, .js and .css files to understand what does what and why.
Now, depending on your skill level, you may limit yourself to editing the main content and links or redefining the entire design/layout; it's up to you. Once you feel confortable with the "code", you may remove most of the comments from the HTML and CSS files.
What if I don't "do" XHTML?
Find out how XHTML differs from HTML in this tutorial, or read this page from W3schools.com.
In my opinion, XHTML is the best thing that could happen to a Web Designer/Developer. It helps to follow good coding practice. It is not out there to hurt you but to help you build better web sites. You should be curious about it, and our Templates can be the perfect tool to "test the water".
There is also a link in the head of each Template to help you make the proper decision re: DTDs. You'll be able to "downgrade" to HTML if you wish.
Tableless Layout, does that mean I cannot use tables?
Of course you can use tables, but you should keep in mind that tables are better used for tabular data [where a logical relationship exists between data arranged in columns and rows.] and complex forms.
What is a page with an .shtml extension?
SHTML stands for "Server-parsed HTML". It is used over HTML to identify a document as containing some SSI directives [includes another file, shows date last modified, etc.]. Server softwares parse files looking for SSI directives, and then carry them out.
Is it possible to replace the .shtml extension with .html or .asp for example?
You can use any extension you want as long as the Server is set up to parse documents with such extension. In practice, there is a good chance that that does not happen with files using an .html extension.
What if I'm stuck with plain old html pages?
If you have no choice other than using plain .HTML pages and cannot use SSI - do not worry - our Templates come in two "flavors". We supply a "default.shtml" file that includes SSI directives and a flat "default.html" page in which only JS and CSS files are externals (read "easy maintenance" to find out about the advantage of using external files).
If you decide to go with "default.html", do not forget to change any reference to the .shtml file (for example you'd replace "default.shtml?add" with "default.html?add").
What if my WHC requires me to use "index" instead of "default" as my default page?
You can rename "default" as you please. Actually, using this file as a template to create new ones, you would save them under different names anyway.
I know you're French, so why not have the comments inside the .shtml and .css files in French too?
Pour une raison toute simple: manque de temps...
I've unzipped the downloaded file in my root directory but when I type "http://localhost/" in the browser's address bar I get a page saying: "Directory Listing Denied". Why?
By default - a file named "default.shtml" may not be "seen" by the server as a default document. To pull the page in a browser, you'd have to use that file name in the UA's adress bar (i.e. "http://localhost/default.shtml" vs "http://localhost/"). If you have access to the server you can easily enable this (or ask your WHC to do it for you).
Better yet, if your documents can use an .asp extension, renaming "default.shtml" into "default.asp" does the trick.
About specific Templates (please read):
Is there anything special I should know about the "Motion" template?
In Opera 7.23 the position for the pop ups is not relative to the fixed DIV, but to the document, so they scroll away from the menu.
In MSIE5 Win the left side bar is not fixed. MSIE5 Mac supports position:fixed, but has an anomalous behavior whereby links in a fixed div do not look like links. So in IE5 Mac the SideBar is not fixed either.
The Template "Bubble" is supposed to contain pure CSS popups. Where are they?
These popups are not images, but text. Hovering over the links in the left-hand side of the header (Valid CSS, Valid XHTML and Section 508) will trigger the popups.
What are these strange spots that appear over the navigation links in the Templates "Cobra" and "Blurry" in NN4 Mac ?
When using list-style-type:none to hide bullets in a Lists, NN4 Mac displays question marks where the bullets "should not be". To minimize the visual impact of such bug, I am blending the "?" with the background color. Because these "?" overlap the links, it may create some "spots" over a few letters.
In this Template, position:absolute is used to display the disjointed rollovers, so they are slightly "off" when the user increases/decreases text-size in his/her browser.
Is there anything special I should know about the "JavaScript" template?
In MSIE 5 & 5.5 Win, the sidebar is not fixed.
MSIE5.0 Mac has a weird bug that makes the link areas inside a fixed DIV scroll with the page. This is invisible to the user but it makes the links un-clickable when the page is not in its original y-position (this does not occur with MSIE5.2 on OSX). Both MSIE Mac versions do not change the cursor shape when the user hovers over the links inside the fixed DIV.
If you're planning to support version 5.0, my advice is to not put links inside such DIVs or use an external style sheet specific to IE5 Mac, to not make that element fixed.
In Opera 7.23, at one point, the nested DIV inside the fixed container scrolls.
Is there anything special I should know about the "Elsa" Template?
In NN6, clicking on the icons inside the sidebar toggles the sub-menus, but does not reveal the sub-icons. This does not happen if the user clicks on the text links next to the icons.
Is there anything special I should know about the "Season" set of Templates?
Tabbing navigation through the CSS dropdown menu menu is not possible in some browsers.
With my Template from your "Season" set, weird things happen in MSIE5 Mac re: the pure CSS Dropdown menu. Top Level and/or Sub Level links are either all mixed up or spread apart. Is there a way to fix this?
MSIE5 Mac can be very sensitive when it comes to the position in which the HTML tags appear in a document. In some cases, it is very important for this browser to have a particular closing tag appear first on a line. Try to break the string of closing tags in the code. For example, you'd split "</li></ul>" to make sure "</ul>" starts a new line. Unfortunately, this strange MSIE5 Mac's behavior doesn't seem to have a rule of its own, so you'll have to play with the closing tags to fix the problem (the infamous trial and error thing). BTW, the same thing is true with closing DIV tags.
About Presentation (CSS):
What about all these "?" that appear at the left hand side of some list items in NN4/Mac?
NN4/Mac doesn't "get" list-style-type:none right. Such a declaration makes it show a question mark in lieu of nothing at all.
For this reason, I've created a few Templates using Anchor or Paragraph elements instead of List Items. It's not as good re: semantic but at least it makes the "?" disapear.
Why didn't you include the pseudo-class ":hover" in some of the Style Sheets?
NN4 Style Sheets do not include this pseudo-class as it is not supported by this browser.
What about "almost" empty Style Sheets?
In a set of Templates, to show different "branching" techniques, I included an IE5 Mac specific Style Sheet. Some Template layouts do not require any particular rule for this browser but IE5 Mac takes a very long time to load an empty [blank] linked style sheet [interesting IE Mac bug]. This is why some ie5mac.css files contain nothing more than a comment. If you don't have the use for this CSS file, it is better to remove the link to the file [@import] than "emptying" it.
What are these HEIGHT:0 declarations? May I delete them?
These declarations are there to "take care" of IE5 Win. That "trick" is to prevent a "shrink wrap" effect around links (allowing to apply padding to the element); if you remove them, bad things can happen.
I know that most of the people use HEIGHT:1px instead of HEIGHT:0 but, AFAIK, the latter does the trick and is 2 caracters shorter.
What are these PADDING-BOTTOM:1px declarations? Does 1px make a difference?
Some CSS rules may include such declarations. It is to prevent "collapsible margins". In some cases, margin declarations can be "ignored". You may want to read this great article about margin collapsing or visit our page on CSS oddities.
After changing a heading, my text moved way up and right. Why?
Headings, as most elements, can be used to clear floats. If you've changed this:
<h1 class="clearLeft">Heading</h1>
for this:
<h1>Heading</h1>
you've left the float[s] uncleared; and depending on the flow of the elements, strange things can happen.
I noticed in a Style Sheet that there is a link to a transparent gif, how come?
There is a good chance I used such background declaration to help NN4 to obey a text-align property.
Why are you using selector names as "indent", "small", "red" etc.? These are not "good" names for CSS selectors. So what's your excuse?
You're right, selector names should describe what elements represent out of a visual context. If I've used such names to create the Templates it is because it was easier for me to rely on visual elements. Feel free to change the names you think are meaningless out of a visual environment.
About Disjointed Rollovers (Pure CSS POP UPS):
Do these pure CSS pop ups work in all browsers?
Check this chart to see which browsers these CSS rollovers have been tested in (a "-—" means that the browser does not reveal any "hidden" SPANs).
How come my pure CSS disjointed rollovers are working on and off when I hover over the links, even depending on the menu item I am on?
Make sure that the nested SPANs (the ones that pop up) do not overlap the navigation links.
I have a problem with MSIE Win and my pure CSS disjointed rollovers or popups. When I hover over the links that are supposed to trigger the effect, nothing happens. What's wrong?
There is an IE bug that prevents this browser from "playing nice". To avoid such behavior, make sure there is a a:hover rule specified in your style sheet and make sure also that there is a swap of color or backgound between the 2 rules: a {...} and a:hover {...}.
How come the background image for my pure CSS disjoint rollovers is truncated?
This is undoubtedly because you've removed "!important" from the width declaration inside the rule for #backpopup. This is easy to spot because the background image shrinks to the exact same width as the list items.
How come the first list item in my UL does not get styled like the others in IE?
You must have set a width declaration for the UL instead of the List Item. Move that declaration from the UL rule to the LI one to correct the problem.
How come the pop up images do not display onmouseover?
Make sure you're not setting the position of the nested SPANs outside of the visible area of the UA.
Hint: always test using "top:0" and "left:0" with a high "z-index" value.
How come the pop up images of the "Cobra" Template are slightly "off"?
In this Template, I'm using position:absolute for the pop ups. So they are misplaced if the user increases or decreases text-size in his/her browser.
About Behavior (DOM):
How come if I try to navigate the templates using keyboard navigation (Tabbing Navigation), I cannot get past your link to the validator (it spawns a new window)?
To ensure that event handlers are input device-independent, the w3C recommends (section 12.4) providing redundant mechanisms, as specifying two handlers for the same element; for example using "onclick" with "onkeypress". Unfortunately, as far as I know, this technique is counter productive in browsers that trigger onkeypress values when the Tab key is pressed (in MSIE, the user needs to use the Enter key once the link has focus). This is a serious issue that puts an end to Tabbing Navigation as soon as the user reaches such link. I'm aware of the problem, but decided to go "by the book" and follow the W3C recommendation.
How come my page opens in the popup AND the main window at the same time?
This may happen for two reasons. Either you're calling TJKpopup()directly instead of using return TJKpopup(), or there is something wrong with the script (make sure you didn't "corrupt" the JS function after editing the settings).
How do I change the size of the pop up window?
The custom JavaScript function included in "basic.js" (in the JS folder) accepts 3 parameters. You're supposed to supply only the two last ones, the width coming before the height. You'd use "return TJKpopup(this,800,600)" to open a pop up window that is 800px wide and 600px high.
This function is well commented; it allows you to use custom settings for the following attributes: scrollbars, toolbar, location, menubar, status and resizable.
How come the comments in the Javascipt files start and end with "//"?
The "extra" pair helps me to remove all comments from these files before I upload them to the server. You may remove the "closing" pairs if you want.
URL parameters "Client-Side". What do you mean by that and why should I care?
Usually, when we talk about URL parameters, we talk about parts of the string in the browser's address bar. The most common way to grab a particular "value" is to use some Server-Side scripts. For example, with ASP, using Request.QueryString("name") would get "john" from an URL such as http://www.mysite.com/mypage.asp?name=john. There are times when a Web Designer may need to relay or pass some kind of information from one document to another and sometimes one cannot rely on Server-Scripts. That's what the Templates show, a simple JavaScript solution. They use a short and very basic script to write some text to the document, "on the fly". To see what I'm talking about, visit one of our Templates and click on "add content below"; once you've clicked the link, watch the URL in the address bar.
URL parameters. I like the idea but I don't need it. How do I remove that script from the page?
Do not delete the file itself, simply remove <script type="text/javascript" src="js/addcontent.js"></script> from the markup.
How come the "Add content" link shows in my browser, but does not appear in Dreamweaver's Design View?
The behavior attached to this link needs script support, so I decided to use JavaScript to write that 'Add content" link to the document (the page); because such a link would have no purpose in a JavaScript-challenged UA.
Does the "Print this page" script work in NN6?
In NN6, the script opens the "Print Window" but if the user clicks on "Cancel" instead of "OK", the browser loads the href value found in the anchor.
Does the "Print this page" script work in MSIE 5.5 (Win)?
No, it doesn't. In IE5.5 Win, the script returns a script error ("permission denied").
In Safari (Mac), how come the popup window does not close when it loses focus?
I have no idea. It should close.
About Structure (Markup):
I have a link that appears at the top of my page, which says "SkipNav". How can I get rid of it?
Make sure you have a correct path for a clear.gif image. The link you see corresponds to the alt attribute's value for that image in the Skip Navigation link.
In MSIE Win, I see a gap between my navigation links (the List Items that compose my menu). How can I fix that?
That's another IE "bug"; white spaces between your LI tags can render in MSIE as spaces between your link blocks. Make sure there are no empty spaces between your closing and opening tags.
Does the form in the Templates actually perform a search?
There is no "behavior" attached to that form. It's up to you to make it function.
I have changed the Accesskey value from "U" to "8" and it doesn't work anymore. What should I do?
If you're using digits for Accesskeys, make sure you're not using the number pad on your keyboard.
How come you are using "acronym" for "CSS" (hey! You just did it again) when CSS is an abbreviation and not an acronym?
The "abbr" tag is not supported by MSIE 6 so I decided to use "acronym" instead of a semantically meaningless span tag. If you're a purist, you can always switch tags.
I've noticed in some Templates that the navigation menu uses anchors not in a List. Don't you know that anchors by themselves are semantically meaningless?
Most of the time, if I decided to build navigation menus without using a List, it is because of NN4. Using Lists with this browser may be problematic. For example, it is impossible to hide bullets in NN4 on Mac.
Rule 6.3.1 of Section 508 says that "Anchor elements are required not to use javascript for the link target when the NOSCRIPT element is not present in the document". So why don't you use it in every Template?
A simple noscript tag pair can break apart a CSS-P layout in NN4. Unfortunately, there is no fix I am aware of.
The markup in some Templates show a certain amount of DIVitis (in short: extra containers). Is there a good reason for that?
60% of the time, it is to please NN4, 30% of the time it is to use 2 background images at once and 9% of the time it is to dodge the Broken Box Model by not mixing, in the same rule, padding an/or border with width or height declarations.
The remaining 1% is my mistake.
You're saying that the Templates code is well commented (CSS and Markup), but I peeked at their source code and didn't see ONE single comment, what gives?
For obvious reasons, the Templates you can browse on this site do not contain any comments; but be assured that the package you receive contains HTML and CSS files that do include comments.
In the Template I purchased, there is a HTML comment right after the navigation menu; it contains the words "this is to prevent a bug, do not remove", may I shorten it?
Yes, you may empty it if you want (i.e. <!-- -->), but you should not remove the comment itself.
