Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Moving Home / Login to main page header?

Moving Home / Login to main page header?

Locked

Views: 6,040

Results 1 to 18 of 18
This thread is locked. New replies are disabled.
22 Jan 2008, 1:40 AM
#1
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Moving Home / Login to main page header?

Hi All,

I'd like to know how to move the Home / Login / Logout / Checkout etc links that are currently at the top left of my logo header, to being in the middle top of my centre box header - where the 'My Account' link for the ezpage is. Is this even possible?

I've scoured the posts but can't find exactly what I'm after. I just want the links to run as follows, where the current link for 'My Account' is;

Home | Login/Logout | Shopping Cart | Checkout

Thanks in advance!
Kathy - www.naturalsoap.com.au

22 Jan 2008, 4:13 AM
#2
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

This is not as big of a change as your question makes it sound. These elements are all part of the same header, and output by /includes/templates/your_template/common/tpl_header.php.

In this file, simply move the code block marked by <!--bof-navigation display--> to just above or below the block marked by <!--bof-header ezpage links-->. This will put the navbar above or below the ez-page links (My Account). If you want them all on one line, you can turn off the header ez-pages menu and add the link to the navMain list like this:```php

<li><?php echo '<a href="' . zen_ez_pages_link(2) . '">My Account</a>'; ?></li> ```replacing the (2) with your ez-page id.
22 Jan 2008, 5:37 AM
#3
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Hi Glenn,

Thanks for coming to my rescue again! :D I've got them below the logo now, and centered so that's a start. I a lot of space below them now, I've looked at all the padding amounts in the CSS but I can't find any that should be affecting it :(

I'm wanting to now move the login / shopping cart / my account etc upwards to being in the nav cat tabs line - is it a matter of moving the code again in the header tpl file?

Thanks in advance!

Kathy - https://www.naturalsoap.com.au

22 Jan 2008, 6:28 AM
#4
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

I fixed the issue with the extra space showing under the home/login - I turned off the coding for the search function in the header and it righted itself.

Still trying to figure out how to move the Home / Login / Checkout etc up into the nav cat tabs space though :(

Cheers,
Kathy - https://www.naturalsoap.com.au

22 Jan 2008, 9:06 AM
#5
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

If you still want to shrink the navbar, these declarations all take up some space:```
#navMain {
margin-top: 2px;
margin-bottom: 2px;
}

#navMain ul, #navSupp ul, #navCatTabs ul {
margin: 0 .5em;
padding: 0;
list-style-type: none;
position: relative;
}

#navMain ul {
float: none;
}

#navMain ul li, #navSupp ul li, #navCatTabs ul li {
display: inline;
position: relative;
}

#navMain ul li a/, #navSupp ul li a/ {
padding: 0.5em;
margin: 0;
background-color: #393939;
border-top: 1px solid #222222;
border-left: 1px solid #222222;
border-right: 1px solid #222222;
border-bottom: 1px solid #222222;
}


I'm not sure it is a good idea to move the navbar links into the cat-tabs line. They would fit to start, but when you get a my account link or shopping cart & checkout links, they would be crowded and probably not fit on one line (in 1024x768 monitors). They would also become less distinctive.

But if you want to do it, you would need to get a bit more aggressive with the code and merge or insert part of the navbar code into the cat-tabs code.
22 Jan 2008, 10:09 AM
#6
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Hi Again :)

I'd be removing the category tabs if I can move the login / home links to the same spot. I personally don't like cat tabs, but want the break between logo header and main page that they give.

What coding could I tweak to allow this?

Thanks in advance yet again!

Kathy - https://www.naturalsoap.com.au

22 Jan 2008, 10:21 AM
#7
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

No tweaking is needed - just turn off cat tabs in Configuration > Layout Settings, and if you want a visual separation between header and body, you can change the styling of #navMain to match #navCatTabs.

22 Jan 2008, 8:37 PM
#8
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Oh golly - my brain was so drained from searching I didn't even realise how easy ti was lol! I've got it right now, but one last thing. How can I change the seperators to being :: like in between breadcrumbs. Currently I'm using the left border command to get line seperators, but would prefer the ::

Thanks once more, you've been a lifesaver Glenn! :D

Kathy - https://www.naturalsoap.com.au

23 Jan 2008, 8:39 AM
#9
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

Since navMain is a list generated explicitly in tpl_header.php, you can just add the colons to the HTML output in the items that need it, like this:
(This is the view source, so the actual PHP file will look a bit different.)```php

<!--bof-navigation display--> <div id="navMainWrapper"> <div id="navMain"> <ul class="back"> <li><a href="http://www.naturalsoap.com.au/shop/">Home</a></li> <li>::<a href="http://www.naturalsoap.com.au/shop/index.php?main_page=login&zenid=7838747313e8f13d1b8b778c929d1154">Log In</a></li> </ul> </div> ```<li>::<a href="...

Insert the colons after the <li> for each item except the (first) home link.

24 Jan 2008, 7:34 AM
#10
kathsta avatar

kathsta

New Zenner

Join Date:
Nov 2006
Posts:
53
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Hi Glenn,

THANKYOU, THANKYOU, THANKYOU!!!!
It's now exactly as I want it after tweaking sizes etc.

clap

Cheers,
Kathy - https://www.naturalsoap.com.au

27 May 2008, 4:17 PM
#11
harveee avatar

harveee

New Zenner

Join Date:
May 2008
Posts:
12
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Hi all.

Another newbie question on the same lines. I am trying to move my home / login the same as Kathsta, but when I apply the changes suggested by GJH42 I get a white space between the bottom of the logo and above the home / login bar.

I've looked at the css but I am not too surewhat to adjust.

Any help would be really appreciated.

Many thanks in advance.

Harveee

27 May 2008, 4:46 PM
#12
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

Can you post a link so we can see what your output code is doing?

27 May 2008, 9:49 PM
#13
harveee avatar

harveee

New Zenner

Join Date:
May 2008
Posts:
12
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

hi gjh42

I have made an error and have posted the same question here as well as another thread. Should i carry on in this thread or both or close one?

My apologies as I'm not used to forums and thought I'd lost my post.

My site will be up on Wednesday night, UK time, as I have been creating it on a local server. There will be no products at the moment as i'm still getting used to customising the shop.

I Hope that this is ok, and thank you for your help.

27 May 2008, 9:59 PM
#14
harveee avatar

harveee

New Zenner

Join Date:
May 2008
Posts:
12
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Hi GJH42

I have upped the site to https://www.tempr.co.uk

many thanks for having a look for me.

Harveee

28 May 2008, 1:58 PM
#15
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: Moving Home / Login to main page header?

There is a <br class="clearBoth" /> after your logoWrapper code in tpl_header.php which is causing the space.
If you add this to your stylesheet:

#logoWrapper+.clearBoth {display: none;}

you will see the space disappear (except in IE6).

To permanently eliminate it, edit /includes/templates/your_template/common/tpl_header.php and comment out that <br class="clearBoth" /> or change it to

<div class="clearBoth"></div>
28 May 2008, 4:39 PM
#16
harveee avatar

harveee

New Zenner

Join Date:
May 2008
Posts:
12
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

Many many thanks Glen for your patience and help.

That is absolutely wonderful. I have put in your suggestions and it has helped tremendously.

Kindest regards

Harveee

28 May 2008, 6:39 PM
#17
harveee avatar

harveee

New Zenner

Join Date:
May 2008
Posts:
12
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

I'm sorry to bother you one more time, but is it possible to centre the text / links as well.

I have found the css to change the font size, colour, a link colour etc, but cannot seem to be ble to centre it.

Many thanks once again.

Harveee

27 Aug 2010, 8:34 PM
#18
airsoftoutfitter avatar

airsoftoutfitter

Zen Follower

Join Date:
Dec 2009
Posts:
244
Plugin Contributions:
0

Re: Moving Home / Login to main page header?

I had EZ Pages links below my header image, but I recently turned this feature off, and moved my "navigation links" below my header image. However, I just wanted to see if anyone had suggestions as to EZ Pages link placement and "navigation links"

I do have my EZ Pages links at the footer of the site but I am torn as to the best way to set this up. Thank you in advance.