How to remove the top menu if not on homepage

Is it possible to only show the top main menu only on the frontpage... if so how?

topmenu.jpg

ok i have remove the menu system from the template on the top. I am using the car magazine template. What i am attempting to do now is insert a module ari ext menu in that exact same position. I also want to insert a logo on the end of the menu bar. I am fairly aware of how to insert module positions and ive learned with your help positioning but im having little trouble getting it into that specific location. Id like to create two module positions on the menu bar thats in blue.

updated menu.jpg

?

Hi

Sorry this is a customization request which we do not support. Please write ADD_POSITION in search field. This will lead You to post where instructions on how to create new positions will be given.

I found a link in the search
advsearch.html?q=ADD+POSITION&exactname=1&childforums=1&limit=5&start=20

associated with an old post attempting to do something very similar to what i am attempting to do. I have added two modules positions. The only question i have is does the css need to be added to the template? or the module? I want it so that the position is at specific locations and that i will be able to change the module in or out just like any other module position. WHen i add the css what do i call?

my module position is called ariextmenu

in your example you tell the user to use this code




#gk-top {
overflow: visible;
position: relative;
}

#top_search {
position: absolute;
right: 68px;
top: 62px;
}


where is this code added and in that search is the module what importance is the top_ in front of it

The generic elements of the css would normally go in a common css file such as the default/main template css file. If you have colour options etc. then you would include the colour specific elements in different style sheets eg. style1.css style2.css.

template.css (positioning and other fixed attributes).
style1.css and style2.css (colour and unique styling attributes which are not generic).

The fragments you have mentioned are generic and could go in the templates main css style sheet.

#top_search

# = a css id which normally means it only occurs once on a given page.

. = a class and can be used on more than one element on a page.

The top_ is only there to distinguish that search styling from another if you added more. For example you might add a side bar search which would be #left_search or whatever makes sense to you. The id name can be whatever you want it to be...#my_search it's just a name to identify the css target. What you need to look out for are the reserved classes and ids, because if the joomla core uses #search and you use #search, you will be in conflict with the core styling. Which ever styling came last in the cascade would win the css battle. You can also use the joomla override techniques to style core features.

good and bad news... .after searching and trying i was able to get two module positions as i wanted and also position them exactly where i wanted. BUT in google chrome its fine but IE its not position correctly. Can anyone help me with this last part






index.php


<div id="ariextmenu1">
<jdoc:include type="modules" name="ariextmenu1" style="raw" />
</div>

<div id="rightlogo">
<jdoc:include type="modules" name="rightlogo" style="raw" />
</div>







********************************
template.css

div#ariextmenu1{
width:600px;
height:80px;
float:left;
margin-top: -87px;
padding-left:2px;
}



div#rightlogo{
width: 155px;
height:17px;
float:right;
margin-top: -50px;
padding-right:75px;

is there any possible way to get help with this last part. Its a very important site that needs to completed. Ive done all the search in how to create a module position and also to position that module. I have gotten to the point where i have everything set and position the only issue i have is with the code in IE not align correctly. All other browsers show it correctly.......any help would be greatly appreciated

Maybe you should try using absolute positioning.

Example

Code: Select all

#div-yourdiv {
   position:absolute;
   top: -25px;
   right:100px;
   width:150px;
}


More detailed explanations here and here.

Hi

From start here a basic idea:

On templateDetails.xml add position for your menu:

Code: Select all

<position>newmenu</position>

Them open index.php and remove this line:

Code: Select all

<a id="logo<?php echo ($logo_as_image) ? '' : '_styled'; ?>" href="./">
            <?php if($logo_as_image) : ?>
            <img src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template?>/images/style1/logo.png" alt="Logo" />
            <?php endif; ?>
         </a>


and find this fragment:

Code: Select all

<div id="wrapper_menu<?php if($menu_type != 'moomenu') echo "_std"; ?>">
         <div id="wrapper_menu2">
            <div id="horiz-menu">
               <?php echo $main_navigation;?>
            </div>
         </div>   
      </div>


replace it with

Code: Select all

<div id="wrapper_menu">
         <div id="wrapper_menu2">
            <?php if ($this->countModules('newmenu')) : ?>
               <div class="module_wrap">
                     <jdoc:include type="modules" name="newmenu" style="gavickpro" />
                </div>
            <?php endif; ?>
         </div>   
         
         <a id="logo<?php echo ($logo_as_image) ? '' : '_styled'; ?>" href="./">
            <?php if($logo_as_image) : ?>
            <img src="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template?>/images/style1/logo.png" alt="Logo" />
            <?php endif; ?>
         </a>
      </div>


Now add this code on template_css.css file:

Code: Select all

#wrapper_menu {background-color: #396EA4!important}
#wrapper_menu2 .moduletable {background: none;margin: 0; padding: 0;overflow: hidden}
#wrapper_menu2 .moduletable_content {margin: 0!important;}
#wrapper_menu2 {background: transparent!important }
a#logo {position: absolute; top:77px;right: 0}


Publish your extension on that position and this should be the result:

screen_2011-06-29.png

This is the basic idea.
The rest is up to you.

Cheers