How to place logo under Main Menu

Hi,

The main menu, I had to add more items to it, but it walks now with items over the logo, is it possible to change that that the logo appears under the main menu? or above? and to create at the right of the logo an extra module position for a slideshow function?

Regard Ronnie

For a start follow below to push main menu block to appear underneath the logo

Find file "templatesgk_myfoliolayoutsdefault.php"
Edit Line: 45 to 54 which is as below

Code: Select all

           <div id="gkPageTop" class="clearfix">
              <?php $this->loadBlock('logo'); ?>
             
              <div id="gkMainMenu">
                 <?php
                    $this->menu->loadMenu($this->getParam('menu_name','mainmenu'));
                     $this->menu->genMenu($this->getParam('startlevel', 0), $this->getParam('endlevel',-1));
                 ?>
              </div>
           </div>


Change it to as below:

Code: Select all

           <div id="gkPageTop" class="clearfix">
              <?php $this->loadBlock('logo'); ?>
           </div>
           <div id="gkPageTop" class="clearfix">
              <div id="gkMainMenu">
                 <?php
                    $this->menu->loadMenu($this->getParam('menu_name','mainmenu'));
                     $this->menu->genMenu($this->getParam('startlevel', 0), $this->getParam('endlevel',-1));
                 ?>
              </div>
           </div>


Also if you want to main menu to start from left hand side enable CSS Override feature from template features and add below into override.css which is in "templatesgk_myfoliocssoverride.css"

Code: Select all

/* Moves Menu to float Left Side */
#gkMainMenu {
    float: left;
}


As for your slideshow i dont think there will be enough height for slideshow module where the logo and menu is. Just dont forget this is a portfolio template. if you still insist i can create slideshow module position which runs underneath the main menu which you can enable perhaps on certain pages.

Thnx for your help, I will place a screenshot after the changes, is better to explain without words

Code: Select all

/* Moves Menu to float Left Side */
#gkMainMenu {
    float: left;
   padding-top: 30px;

I have added padding-top 30px to the code and comes now under my logo, thnx.

I = where can I find that to create the space less?
II = slideshow possibility with wide pictures at the right and the logo show on top of it. I only don't know if that would be possible there. Just subtile photo's a cut out of a project and to let people click on when they wonder what it is. I like to trigger people.

Schermafbeelding 2011-09-30 om 11.27.45.png

Empty space is actually placeholder for joomla system messages.
If you still want to reduce it apply below css into override.css and change 40px to lower value.

Code: Select all

#mainContent > div {
    margin-top: 40px;
}