Problem with code on EZ-Pages

[areichard]

Let start off by saying that I am fairly new to zen cart but have been working with it for a couple of weeks. Not great with code but am learning. Now on to the problem.

I am trying to create an EZ-Page for a definition list of meanings for some items that I sell. I originally used Aptana 3 to write the code and when I offline posted it to Firefox it works. However same code, no changes, won't use the anchors properly in Zen Cart. They all go back to the home page. I have searched all over the place for a solution. I know my code in general is correct but don't know if something special is required for ZC. Here is a portion of the code I have written. I know HTML but not CSS. The basics of it are I am trying to allow a person to click on "W" and go right to that section and when done can click "Back to Top" and it will take them to the top of the same page. Instead all links take me to the home page. HELP PLEASE!

<a name="top"></a>
<center><h2>Native American Symbols</h2></center>
<hr style="color: black; background-color: black; height: 5; width: 50%">

<center><h3><a href="#A">A</a> <a href="#B">B</a> <a href="#C">C</a> D <a href="#E">E</a> <a href="#F">F</a> G <a href="#H">H</a>
I J <a href="#K">K</a> <a href="#L">L</a> <a href="#M">M</a> N <a href="#O">O</a> <a href="#P">P</a> Q
<a href="#R">R</a> <a href="#S">S</a> <a href="#T">T</a> U V <a href="#W">W</a> X <a href="#Y">Y</a> <a href="#Z">Z</a></h3></center>

<dl>
<h3><a name="A">A</a></h3>
<font size=2><dt><strong>Arrowhead:</strong></dt>
<dd>Alertness</dd>
<dt><strong>Arrow Pointing Right:</strong></dt>
<dd>Protection</dd>
<dt><strong>Arrow Pointing Left:</strong></dt>
<dd>Warding Off Evil</dd></font size>
<h5><a href="top">Back to top</a></h5>
<br>

<h3><a name="B">B</a></h3>
<font size=2><dt><strong>Bear Track/Paw:</strong></dt>
<dd>Good omen</dd>
<dt><strong>Broken Arrow:</strong></dt>
<dd>Peace</dd>
<dt><strong>Buffalo Horns:</strong></dt>
<dd>Success</dd></font size>
<h5><a href="top">Back to top</a></h5>
<br>

[skrillnet]

You have several mistakes in your HTML code, no closing tags, improper closing tags, improper nesting of elements, etc. Also, you can clean it up quite a bit by using CSS for some of your styling.

Here is a new version. Try this, you will need to put the stuff in the style tags into your stylesheet, and make the same modifications to the other letters in your list. But this should get you headed in the right direction. :)

Let me know if you need any more help! :)

<style type="text/css">
h2#ez_page_header {
    text-align:center;
}
hr.page_divider_hr {
    color: #000; 
    background: #000; 
    height: 5px; 
    width: 50%;
}
div#native_nav {
    text-align:center;
    font-weight:bold;
    font-size:1.2em;
}
dt {
    font-weight:bold;
}
</style>
<a name="top"></a>
<h2 id="ez_page_header">Native American Symbols</h2>
<hr class="page_divider_hr" />

<div id="native_nav">
<a href="#A">A</a>
<a href="#B">B</a> 
<a href="#C">C</a> 
D 
<a href="#E">E</a> 
<a href="#F">F</a> 
G 
<a href="#H">H</a>
I 
J 
<a href="#K">K</a> 
<a href="#L">L</a> 
<a href="#M">M</a> 
N 
<a href="#O">O</a> 
<a href="#P">P</a> 
Q
<a href="#R">R</a> 
<a href="#S">S</a> 
<a href="#T">T</a> 
U 
V 
<a href="#W">W</a> 
X 
<a href="#Y">Y</a> 
<a href="#Z">Z</a>
</div>

<h3><a name="A">A</a></h3>
<dl>
<dt>Arrowhead:</dt>
    <dd>Alertness</dd>
<dt>Arrow Pointing Right:</dt>
    <dd>Protection</dd>
<dt>Arrow Pointing Left:</dt>
    <dd>Warding Off Evil</dd>
</dl>
<h5><a href="top">Back to top</a></h5>

<h3><a name="B">B</a></h3>
<dl>
<dt>Bear Track/Paw:</dt>
    <dd>Good omen</dd>
<dt>Broken Arrow:</dt>
    <dd>Peace</dd>
<dt>Buffalo Horns:</dt>
    <dd>Success</dd>
</dl>
<h5><a href="top">Back to top</a></h5> 

Let start off by saying that I am fairly new to zen cart but have been working with it for a couple of weeks. Not great with code but am learning. Now on to the problem.

I am trying to create an EZ-Page for a definition list of meanings for some items that I sell. I originally used Aptana 3 to write the code and when I offline posted it to Firefox it works. However same code, no changes, won't use the anchors properly in Zen Cart. They all go back to the home page. I have searched all over the place for a solution. I know my code in general is correct but don't know if something special is required for ZC. Here is a portion of the code I have written. I know HTML but not CSS. The basics of it are I am trying to allow a person to click on "W" and go right to that section and when done can click "Back to Top" and it will take them to the top of the same page. Instead all links take me to the home page. HELP PLEASE!

<a name="top"></a>
<center><h2>Native American Symbols</h2></center>
<hr style="color: black; background-color: black; height: 5; width: 50%">

<center><h3><a href="#A">A</a> <a href="#B">B</a> <a href="#C">C</a> D <a href="#E">E</a> <a href="#F">F</a> G <a href="#H">H</a>
I J <a href="#K">K</a> <a href="#L">L</a> <a href="#M">M</a> N <a href="#O">O</a> <a href="#P">P</a> Q
<a href="#R">R</a> <a href="#S">S</a> <a href="#T">T</a> U V <a href="#W">W</a> X <a href="#Y">Y</a> <a href="#Z">Z</a></h3></center>

<dl>
<h3><a name="A">A</a></h3>
<font size=2><dt><strong>Arrowhead:</strong></dt>
<dd>Alertness</dd>
<dt><strong>Arrow Pointing Right:</strong></dt>
<dd>Protection</dd>
<dt><strong>Arrow Pointing Left:</strong></dt>
<dd>Warding Off Evil</dd></font size>
<h5><a href="top">Back to top</a></h5>
<br>

<h3><a name="B">B</a></h3>
<font size=2><dt><strong>Bear Track/Paw:</strong></dt>
<dd>Good omen</dd>
<dt><strong>Broken Arrow:</strong></dt>
<dd>Peace</dd>
<dt><strong>Buffalo Horns:</strong></dt>
<dd>Success</dd></font size>
<h5><a href="top">Back to top</a></h5>
<br>

[gjh42]

Because Zen Cart uses a <base href= > (so that relative links will work without writing out the full URL in the code every time), the special case of jump links to move on a page do have to be written in full, with the exact URL to the current page. For an ez-page, that will be unchanging, so just go to the page in question and copy the URL in the address bar.

There are forum threads discussing this in detail for other page type situations.

[skrillnet]

didn't know that. Good info, thanks!

[areichard]

Thank you everyone for your prompt help. I wound up re-writing the sections of code so that the URL would direct them to the right places. This is the same code as above but with the changes in effect.

<center><h3><a href="index.php?main_page=page&id=1#A">A</a> <a href="index.php?main_page=page&id=1#B">B</a>
<a href="index.php?main_page=page&id=1#C">C</a> D <a href="index.php?main_page=page&id=1#E">E</a>
<a href="index.php?main_page=page&id=1#F">F</a> G <a href="index.php?main_page=page&id=1#H">H</a> I J
<a href="index.php?main_page=page&id=1#K">K</a> <a href="index.php?main_page=page&id=1#L">L</a>
<a href="index.php?main_page=page&id=1#M">M</a> N <a href="index.php?main_page=page&id=1#O">O</a>
<a href="index.php?main_page=page&id=1#P">P</a> Q <a href="index.php?main_page=page&id=1#R">R</a>
<a href="index.php?main_page=page&id=1#S">S</a> <a href="index.php?main_page=page&id=1#T">T</a> U V
<a href="index.php?main_page=page&id=1#W">W</a> X <a href="index.php?main_page=page&id=1#Y">Y</a>
<a href="index.php?main_page=page&id=1#Z">Z</a></h3></center>

<dl>
<h3><a name="A">A</a></h3>
<font size=2><dt><strong>Arrowhead:</strong></dt>
<dd>Alertness</dd>
<dt><strong>Arrow Pointing Right:</strong></dt>
<dd>Protection</dd>
<dt><strong>Arrow Pointing Left:</strong></dt>
<dd>Warding Off Evil</dd></font size>
<h5><a href="http://adamsappletn.com/zencart/index.php?main_page=page&id=1">Back to top</a></h5>
<br>

<h3><a name="B">B</a></h3>
<font size=2><dt><strong>Bear Track/Paw:</strong></dt>
<dd>Good omen</dd>
<dt><strong>Broken Arrow:</strong></dt>
<dd>Peace</dd>
<dt><strong>Buffalo Horns:</strong></dt>
<dd>Success</dd></font size>
<h5><a href="http://adamsappletn.com/zencart/index.php?main_page=page&id=1">Back to top</a></h5>
<br>