CMS Made Simple Forums

Posted: **Sun Jan 02, 2011 9:53 am**

Hi all,

since I don´t have sub-menues I dropped the breadcrumbs from my layout (adjusting "CSSMenu top + 2 columns"- template and attached stylesheets
from the original 1.9.2 CMSMS install).
Now I´m struggling in getting the search field into the menu div right side.
Placing {search} and enclosing div inside the menu div is something I tried, but this does not work.
The search field is still showing below the menu area.

Code: Select all

 ..................
      </div>
{* End Header *}

{* Start Navigation *}
      <div id="menu_vert">
{* stylesheet  "Navigation: CSSMenu - Horizontal" *}
        <h2 class="accessibility">Navigation</h2>
        {menu loadprops=0 template='cssmenu.tpl'}
{* Start Search, the input "Submit" is using an image, CSS: input.search-button *}
              <div id="search">
               {search}
              </div>
{* End Search *}
        <hr class="accessibility" />
      </div>
{* End Navigation *}

{* Start Content *}
      <div id="content">
..............

It seems, as if the menu stylesheet reserves the full page widht but I cannot figure it out.
For the moment I´m "just" working with FF3.6.13.
Could somebody point me to the right direction please?

Thanks.
Pio

Posted: **Mon Jan 03, 2011 11:05 pm**

OK, solved.
After using Firebug, I found, that the embracing div (menu_vert) was not responsible for positioning to the right on the same line, but div#menuwrapper.
This div is attached to the menu template "cssmenu.tpl" which is one of the (and the) default template for menus after installing CMSMS.
To be able to edit this template, I had to open from the admin panel layout->menumanager,
import template "cssmenu.tpl" into the database using the "import icon" on the right side of the line, which asks you for a new name for this copy (e.g. 'mynew_cssmenu.tpl'; the original is still present and read only).
After this I set the copied template as default and cachable.
Don´t forget to call it in your page templates, i.e. replace the original

Code: Select all

{menu template=template='cssmenu.tpl'}

with

Code: Select all

{menu template=template='mynew_cssmenu.tpl'}

I cut (removed) the code for the search field from the original page template "CSSMenu top + 2 columns".
Then I opened template "mynew_cssmenu.tpl" for editing an inserted the search field code just before line <div class="clearb"></div> . Now my template is like:

Code: Select all

{/foreach}
{repeat string='</li></ul>' times=$node->depth-1}
</li>
</ul>

{* Start Search, the input "Submit" is using an image, CSS: input.search-button *}
      <div id="search">
      {search}
      </div>
{* End Search *}


<div class="clearb"></div>
</div>
{* above /div marks the end of div "menuwrapper" *}

Posted: **Tue Jan 04, 2011 5:19 am**

That was not necessary if you had moved the search div above the menu and float:right then took the width:100% out of the menuwrapper div it would have worked, I'm surprised it didn't give you an error...

CMS Made Simple Forums

Move search field from breadrmb to menu

Move search field from breadrmb to menu

[SOLVED] Move search field from breadrmb to menu

Re: Move search field from breadrmb to menu