CMS Made Simple Forums

Posted: **Sat Jul 12, 2008 9:50 am**

Hi everybody,
I am just starting with CMSmade simple, but so far it is going well.
The only thing I have trouble with is creating a dropdown menu. For some reason I never know exactly what to do.
I created 2 new pages that should appear under the Home button.
But what do I change in the stylesheet then? I read threads on the forum, but I can't seem to understand how it is done.
This is the stylesheet I am using:

Code: Select all

/* Zoe Biz 01 - By Jose Erlino M. Lontok. http://jelontok.com | http://myhedspace.com */

body {
margin:0;
padding:0;
text-align:center;
background-color:#666;
font-family: Arial, Helvetica, sans-serif;
}

h1, h2, h3, p {
margin:0;
padding:0;
font-weight:normal;
}

#wrap {
width:780px;
margin:0 auto;
text-align:left;
}

#header {
height:100px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/header_bg.jpg) repeat-x;
}

#header h1{
font: 30px "Trebuchet MS", Arial, Helvetica, sans-serif;
color:#333333;
text-transform:uppercase;
padding: 20px 0 0 20px
}
#header small{
padding: 0 0 0 20px
}

#topnav {
height:40px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/topnav_bg.jpg) repeat-x;
}

#topnav_list {
float:right;
padding-top:12px;
}

#topnav_list ul {
list-style-type:none;
padding:0;
margin:0;
color:#666666;
text-transform:uppercase;
font:bold 12px Arial, Helvetica, sans-serif;
}

#topnav_list ul li{
float:left;
margin-right:10px;
}

#topnav_list ul li a{
color:#666666;
text-decoration:none;
}

#topnav_list ul li a:hover{
color:#000;
text-decoration:underline;
}

#mid_banner {
height:201px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/mid_banner.jpg) no-repeat;
clear:both;
}

#mid_banner_text {
width:320px;
font:11px Verdana, Arial, Helvetica, sans-serif;
text-align:justify;
position:absolute;
margin: 60px 0 0 20px;
}

#mid_banner_text strong {
color:#2F6182;
}

#content {
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/content_bg.jpg) #FFFFFF repeat-x;
padding:20px 0 5px 0;
}

#content p {
font-size:10px;
color:#333333;
}

#content_box {
width:760px;
border:1px #CCCCCC solid;
background: url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/content_box_bg.jpg) #fff bottom left no-repeat;
margin:0 auto;
}

#content_box h2 {
color:#2F6182;
font-size:18px;
}

#content_box  h2, #content_box p{
padding: 5px 0;
text-align:justify;
}

#content_box_inside {
padding:30px 30px 10px 30px;
}

#footer {
text-align:center;
padding: 20px 0;
}

#footer a{
text-decoration:none;
color:#333;
}

And this is the testsite:
http://www.jomedio.nl/cmsmadesimple/

Edit: this was solved. See thread http://forum.cmsmadesimple.org/index.php/topic,23722.msg115222.html#msg115222

Posted: **Sat Jul 12, 2008 10:46 am**

I do it by

Pages......... add new content...........then in the WYSIWYG editor there is a box to set the "parent"

Posted: **Sat Jul 12, 2008 10:52 am**

Deblus wrote: I do it by

Pages......... add new content...........then in the WYSIWYG editor there is a box to set the "parent"

Thanks. Where exactly is that? Under Options? In what field? And what do I add then?

Edit: I found that and I have the Home as parent there, but that isnot the solution.
I have no dropdown menu in the original stylesheet from this template, so I have to add that somewhere, but I don't know what exactly and where. I always have difficulties with CSS.

Posted: **Sat Jul 12, 2008 2:50 pm**

You need to attach the css stylesheet for the menu to your template and add the javascript for IE 6. Do a forum search for menu not working in IE.

Posted: **Sat Jul 12, 2008 2:56 pm**

Greg wrote: You need to attach the css stylesheet for the menu to your template and add the javascript for IE 6. Do a forum search for menu not working in IE.

Hi Greg,
I did that all, but still not working.

Posted: **Sat Jul 12, 2008 3:06 pm**

I still don't see any menu css - if you did attach it did you clear the cache?
The CSS for the menu should look like the following (this is just the first few lines) ...

Code: Select all

#menuwrapper {
background:#B70100 url(uploads/css/navbkb.gif) center center repeat-x;
border-bottom:6px solid #2D789E;
width:98%;
padding-left: 2%;
}

/* Root = Horizontal, Secondary = Vertical */
ul#navmenu {
  margin: 0;
  border: 0 none;
  padding: 0;
  /*width: 500px; For KHTML*/
  list-style: none;
  height: 28px;
}

Posted: **Sat Jul 12, 2008 3:17 pm**

Hi Greg,
You mean the cache in IE I assume? Yes I did that.
This is what I have. This is the
stylesheet:

Code: Select all

/* Zoe Biz 01 - By Jose Erlino M. Lontok. http://jelontok.com | http://myhedspace.com */

body {
margin:0;
padding:0;
text-align:center;
background-color:#666;
font-family: Arial, Helvetica, sans-serif;
}

h1, h2, h3, p {
margin:0;
padding:0;
font-weight:normal;
}

#wrap {
width:780px;
margin:0 auto;
text-align:left;
}

#header {
height:100px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/header_bg.jpg) repeat-x;
}

#header h1{
font: 30px "Trebuchet MS", Arial, Helvetica, sans-serif;
color:#333333;
text-transform:uppercase;
padding: 20px 0 0 20px
}
#header small{
padding: 0 0 0 20px
}

#topnav {
height:40px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/topnav_bg.jpg) repeat-x;
}

#topnav_list {
float:right;
padding-top:12px;
}

#topnav_list ul {
list-style-type:none;
padding:0;
margin:0;
color:#666666;
text-transform:uppercase;
font:bold 12px Arial, Helvetica, sans-serif;
}

#topnav_list ul li{
float:left;
margin-right:10px;
}

#topnav_list ul li a{
color:#666666;
text-decoration:none;
}

#topnav_list ul li a:hover{
color:#000;
text-decoration:underline;
}

#mid_banner {
height:201px;
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/mid_banner.jpg) no-repeat;
clear:both;
}

#mid_banner_text {
width:320px;
font:11px Verdana, Arial, Helvetica, sans-serif;
text-align:justify;
position:absolute;
margin: 60px 0 0 20px;
}

#mid_banner_text strong {
color:#2F6182;
}

#content {
background:url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/content_bg.jpg) #FFFFFF repeat-x;
padding:20px 0 5px 0;
}

#content p {
font-size:10px;
color:#333333;
}

#content_box {
width:760px;
border:1px #CCCCCC solid;
background: url(http://www.jomedio.nl/cmsmadesimple/uploads/images/business/content_box_bg.jpg) #fff bottom left no-repeat;
margin:0 auto;
}

#content_box h2 {
color:#2F6182;
font-size:18px;
}

#content_box  h2, #content_box p{
padding: 5px 0;
text-align:justify;
}

#content_box_inside {
padding:30px 30px 10px 30px;
}

#footer {
text-align:center;
padding: 20px 0;
}

#footer a{
text-decoration:none;
color:#333;
}

This is the
template:

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Zoe Biz01</title>
{stylesheet}
{metadata}

</head>

</__body>




	<!-- start wrap -->
	<div id="wrap">
	
		<!-- start header -->
		<div id="header">
			<h1>Lorem ipsum dolor </h1>
			<small>Your Tagline Goes Here</small>
		</div>
		<!-- end header -->
		
			<!-- start topnav -->
		<div id="topnav">
			<div id="topnav_list">

                                      {menu template='cssmenu.tpl' collapse="1"}
                                 

			</div>
		            </div>
		<!-- end topnav -->


			
                                     
			
		
		<!-- start mid_banner -->
		<div id="mid_banner">
			<div id="mid_banner_text">
				<p><strong>Sed ut perspiciatis</strong> unde omnis iste natus error sit voluptatem 
				accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae 
				ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
			</div>
		</div>
		<!-- end mid_banner -->
		
		<!-- start content -->
		<div id="content">
		
			<!-- start content_box -->
			<div id="content_box">
			  <div id="content_box_inside">
			{content}	  

			  </div>
			</div>
			<!-- end content_box -->
			
			<!-- start footer -->
			<div id="footer">
			{global_content name='footer'}
			<!-- end footer -->

		</div>
		<!-- end content -->
	
	</div>
	<!-- end wrap -->

<__body>
</__html>

And I used the default cssmenu.tpl from the menumanager and the default top menu with 2 colums together with the accessibility and roots.

CMS Made Simple Forums

[solved]How to create a dropdown menu?

[solved]How to create a dropdown menu?

Re: How to create a dropdown menu?

Re: How to create a dropdown menu?

Re: How to create a dropdown menu?

Re: How to create a dropdown menu?

Re: How to create a dropdown menu?

Re: How to create a dropdown menu?