Fork me on GitHub

Search

Donat-O-Meter

Make donations with PayPal!
Stats
Goal: $100.00
Due Date: Oct 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00

Learn XOOPS Core

Local Support

Advertisement

XOOPS Code hosted on SourceForge

Cumulus Tag Cloud

- 2 2.5 2.6 3.0 4 6 2013 Abuse adslight Android AntiHarvesting AntiMalUser AntiSpam API Apple Battlefield billige Bootstrap Captcha cell chronolabs Clicks content CĂN demo docek download Dresses evden eve facebook Fat floor Food for free Gateway Google Guide herre Home Honeypot HP Human HỘ IP iPhone jQuery Language Law Legal List log Loss mobile module modules Monster new newbb news NHÀ online PARK phone PHP Prevention profile project Protector publisher Rapid RESIDENCE responsive review Rights rmcommon security Sentry site Smartphone Smoking Solution Spam Studio tags tdmcreate template The Theme themes userlog web weight Wishcraft xoops Xortify

New Users

Registering user

# 137840

ThomasC23

Welcome to XOOPS!




Bottom   Previous Topic   Next Topic  |  Register To Post

(1) 2 3 »


#1 Posted on: 2008/12/2 2:31 Horizontal menu, How? Plz
Hi,

Please tell me how to make an horizontal main menu?

Thank you in advance.



Top

robertelo
Joined:
2008/11/28 13:40
Group:
Registered Users
Posts: 77
(Show More) (Show Less)


#2 Posted on: 2008/12/2 3:48 Re: Horizontal menu, How? Plz
Try http://www.xoopsland.com/xoopsmenus/ from Mr. Reda.

But it looks like it doesn't work right now, so try later

Top


Please support XOOPS & DONATE
Use 2.5.7 | Debugging | Requests | Bugs
Mamba
Joined:
2004/4/23 13:58
From Ohio, USA
Group:
Webmaster
Registered Users
Designer Group
Posts: 8087
(Show More) (Show Less)


#3 Posted on: 2008/12/2 4:55 Re: Horizontal menu, How? Plz
hi,

You could get a full css menu quickly.

1. style.css, add (1st line):
@import url(navig.css);


2. create a navig.css stylesheet in same folder, with this code :
#xo-globalnav {
  
clearboth;
  
border0px;
  
padding-left2.5em;
  
margin0;
  
z-index5;
  
text-aligncenter;
}

html #xo-globalnav {
  
height30px;
}

#xo-globalnav ul {
  
min-height30px;
  list-
style-typenone;
  
padding0;
  
margin0;
  
z-index500;
  
font-family'Trebuchet MS''Lucida Grande'VerdanaArialSans-Serif;
  
font-size1.25em;
  
font-weight700;
}

#xo-globalnav li {
  
displayinline;
  
floatleft;
  
min-height26px;
  
positionrelative;
  
text-alignleft;
  
padding5px 14px 5px 14px;
  
margin0;
  
font-size.9em;
}

#xo-globalnav li ul {
  
width128px;
  
heightauto;
  
top100%;
  
left0px;
  
font-weightnormal;
  
font-size1em;
  
border-top1px solid #000;
  
padding0 2px 0 2px;
}

#xo-globalnav li ul li {
  
text-alignleft;
  
width100px;
  
heightauto;
  
min-heightauto;
  
displayblock;
}

#xo-globalnav li.LargeMenu ul li {
  
text-alignleft;
  
width156px;
  
heightauto;
  
min-heightauto;
  
displayblock;
}

#xo-globalnav ul li a {
  
text-decorationnone;
  
background-colortransparent;
  
font-weight700;
}

#xo-globalnav a:hover {
  
text-decorationnone;
}

#xo-globalnav li li ul {
  
top0;
  
left0;
}

#xo-globalnav li li:hover ul {
  
left150px;
}

#xo-globalnav ul ul, #xo-globalnav ul li:hover ul ul, #xo-globalnav ul ul li:hover ul ul, #xo-globalnav ul ul ul li:hover ul ul, #xo-globalnav ul ul ul ul li:hover ul ul {
  
positionabsolute;
  
displaynone;
}

#xo-globalnav li:hover ul, #xo-globalnav ul li:hover ul, #xo-globalnav ul ul li:hover ul, #xo-globalnav ul ul ul li:hover ul, #xo-globalnav ul ul ul ul li:hover ul, #xo-globalnav ul ul ul ul ul li:hover ul {
  
displayblock;
}

#xo-globalnav, #xo-globalnav a, #xo-globalnav a:active, #xo-globalnav a:hover, #xo-globalnav a:visited {}

#xo-globalnav ul li ul li {
  
background-color#3b3b3b;
}

#xo-globalnav ul li ul li:hover {
  
background-color#4b4b4b;
}


3. Place your horizontal menu in theme.html. With default theme :

Replace :
<table cellspacing="0">
    <
tr id="header">
      <
td id="headerlogo"><a href="<{$xoops_url}>/"><img src="<{$xoops_imageurl}>logo.gif" width="150" height="80" alt="" /></a></td>
      <
td id="headerbanner"><{$xoops_banner}></td>
    </
tr>
    <
tr>
      <
td id="headerbar" colspan="2">&nbsp;</td>
    </
tr>
  </
table>


By (to be modify with your own urls):
<table cellspacing="0">
    <
tr id="header">
      <
td id="headerlogo"><a href="<{$xoops_url}>/"><img src="<{$xoops_imageurl}>logo.gif" width="150" height="80" alt="" /></a></td>
      <
td id="headerbanner"><{$xoops_banner}></td>
    </
tr>
    <
tr>

<
td colspan="2">


<
div id="xo-globalnav" class="x2-nl x2-navigation">
<
ul>

        <!-- 
menu in anonymous mode-->
        <
li class="sitemap"><a href="<{xoAppUrl}>" accesskey="a"  title="<{$smarty.const.THEME_HOME_DESC}>"><{$smarty.const.THEME_HOME}></a></li>
        

        <
li><class="news" href="<{xoAppUrl modules/news/}>" accesskey="" title="<{$smarty.const.THEME_MODULE1_DESC}>"><{$smarty.const.THEME_MODULE1}></a>
        <
ul>
                <
li><class="news" href="<{xoAppUrl modules/news/index.php?storytopic=2}>" accesskey="" title="<{$smarty.const.THEME_MODULE1_SUB1_DESC}>"><{$smarty.const.THEME_MODULE1_SUB1}></a></li>
            <
li><class="news" href="<{xoAppUrl modules/news/article.php?storyid=4}>" accesskey="" title="<{$smarty.const.THEME_MODULE1_SUB2_DESC}>"><{$smarty.const.THEME_MODULE1_SUB2}></a></li>
            <
li><class="news" href="<{xoAppUrl modules/news/article.php?storyid=5}>" accesskey="" title="<{$smarty.const.THEME_MODULE1_SUB3_DESC}>"><{$smarty.const.THEME_MODULE1_SUB3}></a></li>        
        </
ul>
    </
li>
        
        <
li><class="mydownloads" href="<{xoAppUrl modules/mydownloads/}>" accesskey="" title="<{$smarty.const.THEME_MODULE2_DESC}>"><{$smarty.const.THEME_MODULE2}></a>
        <
ul>
                <
li><class="mydownloads" href="<{xoAppUrl modules/mydownloads/viewcat.php?cid=1}>" accesskey="" title="<{$smarty.const.THEME_MODULE2_SUB1_DESC}>"><{$smarty.const.THEME_MODULE2_SUB1}></a></li>
            <
li><class="mydownloads" href="<{xoAppUrl modules/mydownloads/viewcat.php?cid=2}>" accesskey="" title="<{$smarty.const.THEME_MODULE2_SUB2_DESC}>"><{$smarty.const.THEME_MODULE2_SUB2}></a></li>
            <
li><class="mydownloads" href="<{xoAppUrl modules/mydownloads/viewcat.php?cid=3}>" accesskey="" title="<{$smarty.const.THEME_MODULE2_SUB3_DESC}>"><{$smarty.const.THEME_MODULE2_SUB3}></a></li>        
        </
ul>
    </
li>
    
        <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_DESC}>"><{$smarty.const.THEME_MODULE4}></a>
        <
ul>
            <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=18}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB1_DESC}>"><{$smarty.const.THEME_MODULE4_SUB1}></a></li>        
                <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=14}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB2_DESC}>"><{$smarty.const.THEME_MODULE4_SUB2}></a></li>
            <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=6}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB3_DESC}>"><{$smarty.const.THEME_MODULE4_SUB3}></a></li>        
            <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=7}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB4_DESC}>"><{$smarty.const.THEME_MODULE4_SUB4}></a></li>
            <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=8}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB5_DESC}>"><{$smarty.const.THEME_MODULE4_SUB5}></a></li>
            <
li><class="extgallery" href="<{xoAppUrl modules/extgallery/public-album.php?id=20}>" accesskey="" title="<{$smarty.const.THEME_MODULE4_SUB8_DESC}>"><{$smarty.const.THEME_MODULE4_SUB8}></a></li>

        </
ul>
    </
li>    
    
    
        <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_DESC}>"><{$smarty.const.THEME_MODULE3}></a>
        <
ul>
            <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/viewcat.php?cid=1}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_SUB1_DESC}>"><{$smarty.const.THEME_MODULE3_SUB1}></a></li>
            <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/viewcat.php?cid=2}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_SUB2_DESC}>"><{$smarty.const.THEME_MODULE3_SUB2}></a></li>        
                <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/viewcat.php?cid=3}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_SUB3_DESC}>"><{$smarty.const.THEME_MODULE3_SUB3}></a></li>
            <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/viewcat.php?cid=4}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_SUB4_DESC}>"><{$smarty.const.THEME_MODULE3_SUB4}></a></li>        
            <
li><class="mylinks" href="<{xoAppUrl modules/mylinks/viewcat.php?cid=5}>" accesskey="" title="<{$smarty.const.THEME_MODULE3_SUB5_DESC}>"><{$smarty.const.THEME_MODULE3_SUB5}></a></li>
        </
ul>
    </
li>
    
    
    <
li><class="flux" href="<{xoAppUrl modules/flux/}>" accesskey="" title="<{$smarty.const.THEME_MODULE5_DESC}>"><{$smarty.const.THEME_MODULE5}></a>
        <
ul>
            <
li><class="flux" href="<{xoAppUrl modules/d3pipes/}>" accesskey="" title="<{$smarty.const.THEME_MODULE5_SUB1_DESC}>"><{$smarty.const.THEME_MODULE5_SUB1}></a></li>
            <
li><class="flux" href="<{xoAppUrl modules/fluxrss/}>" accesskey="" title="<{$smarty.const.THEME_MODULE5_SUB2_DESC}>"><{$smarty.const.THEME_MODULE5_SUB2}></a></li>
        </
ul>
    </
li>

        <
li><class="contact" href="<{xoAppUrl modules/contact/}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_DESC}>"><{$smarty.const.THEME_MODULE6}></a>
        <
ul>
                <
li><class="contact" href="<{xoAppUrl modules/liaise/?form_id=2}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_SUB3_DESC}>"><{$smarty.const.THEME_MODULE6_SUB3}></a></li>            
            <
li><class="contact" href="<{xoAppUrl modules/mylinks/submit.php}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_SUB2_DESC}>"><{$smarty.const.THEME_MODULE6_SUB2}></a></li>
            <
li><class="contact" href="<{xoAppUrl modules/liaise/?form_id=3}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_SUB4_DESC}>"><{$smarty.const.THEME_MODULE6_SUB4}></a></li>
            <!-- <
li><class="contact" href="<{xoAppUrl modules/MadLiens/}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_SUB5_DESC}>"><{$smarty.const.THEME_MODULE6_SUB5}></a></li> -->
            <
li><class="contact" href="<{xoAppUrl modules/liaise/?form_id=1}>" accesskey="" title="<{$smarty.const.THEME_MODULE6_SUB1_DESC}>"><{$smarty.const.THEME_MODULE6_SUB1}></a></li>
        </
ul>
    </
li>
    
            <{if 
$xoops_isadmin}>

        <!-- 
additional link if I am administrator -->
        <
li><a href="<{xoAppUrl admin.php}>" accesskey="" title="<{$smarty.const.THEME_ADMIN_DESC}>"><{$smarty.const.THEME_ADMIN}></a></li>

        <{/if}>
  
  </
ul></div>


</
td>


    </
tr>
  </
table>


Not tested but hope it helps



Top


Still learning CSS and... english
Burning
Joined:
2006/8/22 14:44
Group:
Registered Users
Repository Group
Posts: 1109
(Show More) (Show Less)


#4 Posted on: 2008/12/2 5:17 Re: Horizontal menu, How? Plz
Doesn't multimenu have also an option for horizontal menus?

Top


The art of asking questions.
ghia
Joined:
2008/7/3 14:19
From Belgium
Group:
Registered Users
Posts: 4946
(Show More) (Show Less)


#5 Posted on: 2008/12/2 10:59 Re: Horizontal menu, How? Plz
but multimenu isn't stable on 2.3.x yet

Top


Never let a man who does not believe something can be done, talk to a man that is doing it.
sailjapan
Joined:
2005/11/16 5:27
From Osaka
Group:
Registered Users
Posts: 1667
(Show More) (Show Less)


#6 Posted on: 2008/12/2 14:52 Re: Horizontal menu, How? Plz
Mastop Publish has a horizontal menu. It has some basic css configurability (color, background-color, border, etc). Works fine in 2.3.2a

Top

dbman
Joined:
2005/4/28 0:15
From Cape Breton, Nova Scotia
Group:
Registered Users
Posts: 169
(Show More) (Show Less)


#7 Posted on: 2008/12/2 18:34 Re: Horizontal menu, How? Plz
BURNING Thank you i tried your code but it did NOT work.

DBMAN can you please give me a link to download MASTOP PUBLISH as i couldnt find it :(


PS: It is a pity that multimenu isn't compatible with 2.3.2



Top

robertelo
Joined:
2008/11/28 13:40
Group:
Registered Users
Posts: 77
(Show More) (Show Less)


#8 Posted on: 2008/12/2 18:45 Re: Horizontal menu, How? Plz
hi,

sorry... may you have some css conflicts in style.css about ul {...} or li {...} ?

What's your theme ?

Top


Still learning CSS and... english
Burning
Joined:
2006/8/22 14:44
Group:
Registered Users
Repository Group
Posts: 1109
(Show More) (Show Less)


#9 Posted on: 2008/12/2 20:43 Re: Horizontal menu, How? Plz
Mastop Publish: http://www.mastop.com.br/conteudo/ope ... stop-publish-english.mstp

You should also post which theme you are using as Burning has suggested. His solution should work as well.

Multimenu (v1.9) does work with 2.3.2 and there is a horizontal dropdown menu type available from the block configuration form.

Top

dbman
Joined:
2005/4/28 0:15
From Cape Breton, Nova Scotia
Group:
Registered Users
Posts: 169
(Show More) (Show Less)


#10 Posted on: 2008/12/2 21:14 Re: Horizontal menu, How? Plz
Thank you I will try all of your suggestions, i use lotr_v2 theme, i sent a pm to Burning, i hope he will read it.

I will let you know.

Top

robertelo
Joined:
2008/11/28 13:40
Group:
Registered Users
Posts: 77
(Show More) (Show Less)




(1) 2 3 »



You can view topic.
You cannot start a new topic.
You cannot reply to posts.
You cannot edit your posts.
You cannot delete your posts.
You cannot add new polls.
You can vote in polls.
You cannot attach files to posts.
You cannot post without approval.
You cannot use topic type.
You cannot use HTML syntax.
You cannot use signature.
You cannot create pdf.
You cannot get print page.

[Advanced Search]