We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 17083
    • 11 Posts
    Hi Guys,

    I have just discovered this wonderful cms and as it seems as a very friendly community was wondering if anyone could give me and the rest of the community a hand and convert the following opensource template to modx. its truley amazing but i dont have the skills to do a full conversion embarrassed

    You can see and download the template here http://www.mollio.org/ i think the community would love this one!
      • 33337
      • 3,975 Posts
      I think its really easy.

      Here is a quick step-by-step:

      -1) Download those template files.
      -2) Open up them in Notepad or any HTML editor you use.
      -3) Clear all the demo text.
      -4) Put [*content*] in main content div.
      -5) Put [!DropMenu!] in sidebar div.
      -6) Put {{footer}} in footer div.
      -7) Hit SAVE.
      -8) Now create a chunk named {{footer}} from resources section, save it.
      -9) Create new/existing document, select the "NewTemplate" from template drop down list.
      -10) Hit Save.
      -11) Click Refresh Site from Site menu.
      -12) Launch site.

      Hope it helps.

      regards,

      zi
        Zaigham R - MODX Professional | Skype | Email | Twitter

        Digging the interwebs for #MODX gems and bringing it to you. modx.link
        • 17083
        • 11 Posts
        Wow.... is it really that easy shocked I will give it a shot!!!! thanks for the reply! laugh
          • 33337
          • 3,975 Posts
            Zaigham R - MODX Professional | Skype | Email | Twitter

            Digging the interwebs for #MODX gems and bringing it to you. modx.link
            • 29988
            • 89 Posts
            Wow, this is really cool template!

            I think we should really be up-to-date in webdev technologies, so i would suggest 2 modifications - probably they talk about them somewhere in teh documentation (not checked yet)

            - let’s convert the center column (in 3 column variant) to fixed but changeable width, that would work both with pixel and em units - this would provide imho max usability and it’s equal with todays recommendation

            -lets move the top navigation panel more down in the code (absolute positioning) - this is good for seo and retarded browsers (pdas, phones...)

            -it does not have "jump to navigation" or "jump co content" link (<a href="#nav"> or <a href="#cont"> ) - this should be in hidden div, so non-css browser can see it

            -can down there be a bottom panel with 100% width, that would be always at the bottom, even when side-panels are long?

            But I must say that the desing and typography is really, really nice.
              • 28042 ☆ A M B ☆
              • 24,524 Posts
                Studying MODX in the desert - http://sottwell.com
                Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
                Join the Slack Community - http://modx.org
                • 3586
                • 27 Posts
                Quote from: liaison at Mar 16, 2006, 02:36 PM

                Wow.... is it really that easy shocked I will give it a shot!!!! thanks for the reply! laugh
                Yes, it seems like being so easy. You just have to pass several classes to the DropMenu as parameters, then it will work. Have a look at my page.

                Here is my template:
                <!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">
                <!--
                Copyright: Daemon Pty Limited 2006, http://www.daemon.com.au
                Community: Mollio http://www.mollio.org $
                License: Released Under the "Common Public License 1.0", 
                http://www.opensource.org/licenses/cpl.php
                License: Released Under the "Creative Commons License", 
                http://creativecommons.org/licenses/by/2.5/
                License: Released Under the "GNU Creative Commons License", 
                http://creativecommons.org/licenses/GPL/2.0/
                -->
                <head>
                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
                
                <title>[(site_name)] | [*pagetitle*]</title>
                <link rel="stylesheet" type="text/css" href="[(base_url)]assets/templates/mollio/main.css" media="screen" />
                <link rel="stylesheet" type="text/css" href="[(base_url)]assets/templates/mollio/print.css" media="print" />
                <!--[if lte IE 6]>
                <link rel="stylesheet" type="text/css" href="css/ie6_or_less.css" />
                <![endif]-->
                <script type="text/javascript" src="[(base_url)]assets/templates/mollio/js/common.js"></script>
                <script type="text/javascript" src="spgm.js" type="text/javascript"></script>
                <script type="text/javascript" src="spgm/contrib/overlib410/overlib.js" type="text/javascript"></script>
                <!--base href="[(site_url)]" /-->
                
                </head>
                <body id="type-d">
                <div id="wrap">
                
                	<div id="header">
                		<div id="site-name">[(site_name)]</div>
                		<!--This is the same as the Dropmenu, just renamed it, don't remember why-->
                                   [!MollioMenu? &hereClass=`active` &topnavClass=`nav`!]
                
                	</div>
                	
                	<div id="content-wrap">
                		
                		<div id="content">
                                  [*content*]
                		</div>
                		
                		<div id="sidebar">
                			<div class="featurebox">
                			<h3>Über mich</h3>
                			<p>{{AboutMe}}</p>
                			</div>	
                
                			<div class="featurebox">
                			<h3>Danke an</h3>
                			<p>{{Danke}}</p>
                		       </div>	
                		</div>
                	</div>
                	
                </div>	
                </body>
                </html>


                I only have problems with the menu-items at the first level. And because I’m not so familiar with good css-coding, I don’t get rid of it.

                My problem is, that pages which are at root-level (like "Startseite") have a wrong design in the menu. How I want it is like when you open a sub-page (like "Software"->"MODx for SPGM"), then the root-element is displayed correctly.
                Maybe some css-guru got a hint for me how to do this?

                Thanks,
                bll0
                  • 2762
                  • 1,198 Posts
                  try to post here your menu ccc style, i think it’s only a padding/margin issue in menu.li style
                    Free MODx Graphic resources and Templates www.tattoocms.it
                    -----------------------------------------------------

                    MODx IT  www.modx.it
                    -----------------------------------------------------

                    bubuna.com - Web & Multimedia Design
                    • 3586
                    • 27 Posts
                    Ok, here you go:

                    	/* NAV - top horizontal nav */
                    	#nav, #nav ul {padding: 0;margin: 0;list-style: none}
                    	#nav {font-weight:bold;height:2.09em;font: bold 96% arial;margin: 0 105px 0 40px}
                    	#nav li {position:relative;background: #999;float: left;width: 10em;display:block;margin: 0;border-bottom: 3px solid #666;border-right: 3px solid #252525;padding:0}
                    	#nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active {text-decoration:none;cursor:pointer;color:#fff;display: block;padding: 4px 10px 2px;border-bottom:none;}
                    	#nav a:hover {color:#000}
                    	
                    	#nav li ul {border-left: 1px solid #c00;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%;width:15.8em;font-size:90%;margin-top:3px;position: absolute;font-weight:normal;left: -999em}
                    	#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999}
                    	
                    	#nav li li {background:none;float:none;border:none;border: 1px solid #999;border-top:1px solid #fff;border-right:none;border-left:none;padding-left:0}
                    	#nav li li.last {border-bottom:none}
                    	#nav li li a, #nav li li a:link, #nav li li a:visited, #nav li li a:hover {color:#000;padding: 3px 10px 2px;width:14em}
                    	#nav li li a:hover {color:#fff;background:#c00}
                    	
                    	#nav li.active {background: #c00;border-bottom: 3px solid #c00}
                    	#nav li.active ul {border:none;background: #c00 url("images/featurebox2_bg.gif") no-repeat 100% 100%}
                    	#nav li.active a:link, #nav li.active a:visited, #nav li.active a:hover, #nav li.active a:active {}
                    	#nav li.active a:hover {color:#000}
                    	
                    	#nav li.active li {border:none;border-top: 1px solid #c15c5c;border-bottom: 1px solid #870000}
                    	#nav li.active li.last {border-bottom: none}
                    	#nav li.active li a:link, #nav li.active li a:visited, #nav li.active li a:hover, #nav li.active li a:active {color:#fff}
                    	#nav li.active li a:hover {background: #666 url("images/sprites.gif") repeat-x 0 99%;color:#fff}
                    	
                    	#nav li.active li.active a:link, #nav li.active li.active a:visited, #nav li.active li.active a:hover, #nav li.active li.active a:active {color:#fff;font-weight:bold;background: #666 url("images/sprites.gif") repeat-x 0 99%}
                    
                    	/* hide from IE mac \*/
                    	#nav li {width:auto}
                      • 3586
                      • 27 Posts
                      Would someone please have a look on the template with Internet Explorer? There seems to be a strange behaviour with the menu, but I can’t proof it because I’m using Linux only.

                      Thank you!

                      bll0