How can I re-arrange the top links and boxes?

Developers Frontend
1

Hi,



Need your help! My problem seemed like a simple fix but can’t figure it out.



If you go to www.dentsoll.com, I have Search boxes and Cart Status right underneath the logo. On the right hand side, I have “sign in/out” and “currency” box, right above the “my account” box.



So currently it looks like:

left side -------------------- right side

Search box------------------sign in/out

Cart status ------------------Currency



I want to change it to look alike:

Sign in/out -----------------Cart status

Search box-----------------currency



How can I fix this?

Thank you in advance!!!

2

In Admin>blocks simply pick up and move them!



BarryH

3

BarryH,



Thank you for replying.

I can’t do this using the block feature. Block feature only lets me control the blocks underneath, like Category or My accounts, not anything above that. Just like I can’t control quicklinks through blocks.



Any other way?



Thank you.

4

Hello art_kim,



drag-and-drop doesn’t work?



For example, you can’t “Drag-and-drop” on “head” of block?



Which browser do you use?



Is JavaScript in ON?







Lee Li Pop

5

Drag-and-drop does not work since these elements are not blocks.



You will need to rearrange things in /skins/YOURSKIN/customer/top.tpl. Each of those items is in a div. You should be able to move those divs around and adjust the CSS to get what you want.



Bob

6

Hello Bob,



Oooops…



You’re right, but move “Cart status” from left to right AND “sign in/out” from right to left, only with CSS is quite difficult…





Lee Li Pop

7

[quote name=‘Lee Li Pop’]You’re right, but move “Cart status” from left to right AND “sign in/out” from right to left, only with CSS is quite difficult…[/QUOTE]

As I said above:

[QUOTE]You will need to rearrange things in /skins/YOURSKIN/customer/top.tpl.[/QUOTE]

Each of the items is in a separate div and can be moved easily within the TPL. The CSS can then be adjusted as needed.



Bob

8

The top.tpl code I have is listed below. What do I need to change? I played around with left and right divs, but can’t get what I need. Especially for the cart checkout link, which wraps to the next line when I move to right.



{* $Id: top.tpl 7412 2009-05-04 08:03:01Z angel $ *}




{$settings.Company.company_name}


{include file="top_quick_links.tpl"}

{include file="top_menu.tpl"}







{assign var="escaped_current_url" value=$config.current_url|escape:url}
{if !$auth.user_id}
{$lang.sign_in}
{$lang.or}
{$lang.register}
{else}
{$user_info.firstname} {$user_info.lastname}
({include file="buttons/button.tpl" but_role="text" but_href="$index_script?dispatch=auth.logout&redirect_url=`$escaped_current_url`" but_text=$lang.sign_out})
{/if}

{if $settings.General.secure_auth != "Y"}


{$lang.sign_in}


{include file="views/auth/login_form.tpl" style="popup" form_name="login_popup_form" id="popup"}


{/if}


{include file="common_templates/search.tpl"}








{include file="views/checkout/components/cart_status.tpl"}

{if $localizations|sizeof > 1}

{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"lc=" items=$localizations selected_id=$smarty.const.CART_LOCALIZATION display_icons=false key_name="localization" text=$lang.localization}


{/if}

{if $languages|sizeof > 1}
{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"sl=" items=$languages selected_id=$smarty.const.CART_LANGUAGE display_icons=true key_name="name" language_var_name="sl"}

{/if}

{if $currencies|sizeof > 1}

{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"currency=" items=$currencies selected_id=$secondary_currency display_icons=false key_name="description"}


{/if}


9

Hello art_kim,



Not this file, Bob says to us “only CSS”.



So he changes something only on this file:



styles.css



I do it for myself with a lot of painful, and WITHOUT languages drop down menu and WITHOUT currencies drop down menu (I use only one language and only one currency) and with fixed width.



Sorry, it’s too difficult for me to help you.



But, Bob is good in CSS, he could help you,







Lee Li Pop

10

Sorry I was only referring to BLOCKS!!!



BarryH

11

[quote name=‘Lee Li Pop’]Hello art_kim,



Not this file, Bob says to us “only CSS”.



So he changes something only on this file:



styles.css



I do it for myself with a lot of painful, and WITHOUT languages drop down menu and WITHOUT currencies drop down menu (I use only one language and only one currency) and with fixed width.



Sorry, it’s too difficult for me to help you.



But, Bob is good in CSS, he could help you,

[/QUOTE]

Lee Li-



You have misquoted me TWICE!



What I said is that he will need to move the DIVs around in top.tpl AND to adjust the CSS accordingly.

12

art_kim-



Have you adjusted the CSS after you moved the DIVs? There appears to be unnecessary code (in red, below):

```php



[COLOR=“Red”]

[/COLOR]

```
You may need to create your own class for some of these items (if the class is used elsewhere and cannot be simply adjusted).

Sorry but I do not have the time right now to spend on this. However, if you can post a link to your site, perhaps some others can help you.

Bob
13

Hello Bob,


[quote name=‘jobosales’]Lee Li-



You have misquoted me TWICE!



What I said is that he will need to move the DIVs around in top.tpl AND to adjust the CSS accordingly.[/QUOTE]



Bob, I offer my apologies.



You are much smarter (and certainly more productive) than me.



I always try to change the CSS, with a lot of painful…



You shown me that by changing only the TPL’s, work is MUCH simpler and MUCH faster!



Sorry for this code, line 48:






But, it’s too long to find another good solution…



Works on Opera Linux, and FireFox Linux.



I keep this solution for myself…



Thank you Bob :wink:







Lee Li Pop



Art_kim, here is the [COLOR=“Blue”]top.tpl[/COLOR] file modified:


```php {* $Id: top.tpl 7412 2009-05-04 08:03:01Z angel $ *}




{$settings.Company.company_name}


{include file="top_quick_links.tpl"}

{include file="top_menu.tpl"}







{assign var="escaped_current_url" value=$config.current_url|escape:url}
{if !$auth.user_id}
{$lang.sign_in}
{$lang.or}
{$lang.register}
{else}
{$user_info.firstname} {$user_info.lastname}
({include file="buttons/button.tpl" but_role="text" but_href="$index_script?dispatch=auth.logout&redirect_url=`$escaped_current_url`" but_text=$lang.sign_out})
{/if}

{if $settings.General.secure_auth != "Y"}


{$lang.sign_in}


{include file="views/auth/login_form.tpl" style="popup" form_name="login_popup_form" id="popup"}


{/if}


{include file="views/checkout/components/cart_status.tpl"}








{include file="common_templates/search.tpl"}

{if $localizations|sizeof > 1}

{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"lc=" items=$localizations selected_id=$smarty.const.CART_LOCALIZATION display_icons=false key_name="localization" text=$lang.localization}


{/if}

{if $languages|sizeof > 1}
{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"sl=" items=$languages selected_id=$smarty.const.CART_LANGUAGE display_icons=true key_name="name" language_var_name="sl"}

{/if}

{if $currencies|sizeof > 1}

{include file="common_templates/select_object.tpl" style="graphic" link_tpl=$config.current_url|fn_link_attach:"currency=" items=$currencies selected_id=$secondary_currency display_icons=false key_name="description"}


{/if}


```