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

    Thank you soooo much. Wow, what a nifty way of getting this menu to work. The tutorial you setup ( http://loripsum.co.uk/separated-menu.html ) was so well documented that I was up and running with my menu in no time. I was far from getting it figured out but have spent some time figuring out what you have done and I’m now even more committed than ever in learning how to use MODx for all my future sites. I feel MODx is on a whole new level when compared to the applications I messed with and was discouraged with last year. (ie Joomla)

    Please take a glimpse at http://www.haztufiesta.com/ampi-58.html if you have minute or so. The menu is all setup with the exception of the child menu headings. I attempted correction by adjusting the innerTpl:

    from <a [+wf.classes+] href="[+wf.link+]">[+wf.title+]</a>
    to <li href="[+wf.link+]" [+wf.classes+]>[+wf.title+]</li> and also to <li><a href="[+wf.link+]" [+wf.classes+]>[+wf.title+]</a></li> in an attempt to fine tune it exactly. Didn’t work

    I dropped in your modified .css along with the current present .css (for a few static pages I may drop in the site.)

    So that it now looks like this:
    editing this particular line ( #leftnav ul li { text-align: left; margin: 0 0 0 0; font: normal 1.1em Verdana, Arial, sans; border-top: 1px solid #444; } ) from the .css that was already there.
    #leftnav ul { margin: 0 0 10px 0; padding: 0; border: 0; list-style: none; }
    #leftnav ul li { text-align: left; margin: 0 0 0 0; font: normal 1.1em Verdana, Arial, sans; }
    #leftnav ul li a { width: 175px; display: block; margin: 0;color: #ccc; padding: 8px 5px 8px 10px; text-decoration: none; }
    #leftnav ul li a:hover { color: #fff; background: #444; }
    
    #leftnav .header { margin: 0 0 1px 0; color: #888; text-transform: uppercase; letter-spacing: 0.2em; border-top: 0; padding:12px 5px 12px 10px;  font: normal 1.1em Arial, Helvetica, sans; }
    #leftnav .header a { width: 175px; display: block; color: #888; margin: 0; border-top: 0; padding:0; }
    #leftnav .header a:hover { color: #ccc; background: none; }
    
    /* MODx menu */
    
    #leftnav {
        background: #222222;
        padding: 10px;
        margin: 20px 0;
        border: none;
        width: 210px;
        overflow: hidden;
    }
    #leftnav a { 
        width: 175px; 
        display: block; 
        color: #bcbcbc; 
        margin: 0; 
        border: 0; 
        padding: 6px 5px 6px 10px; 
        border-top: 1px solid #444;
    }
    #leftnav a:hover { 
        color: #fff; 
        background: #444;
    }
    #leftnav h3 { 
        width: 175px;
        margin: 15px 0 8px 0; 
        color: #888; 
        text-transform: uppercase; 
        letter-spacing: 0.2em; 
        padding: 6px 5px 6px 10px; 
        font: normal 1.1em Arial, 
    
    Helvetica, sans;
        line-height: 1.1em;
        height: 1.1em;
    }
    #leftnav h3.first {
        margin-top: 0;
    }
    #leftnav h3 a { 
        width: 175px; 
        display: block; 
        color: #888; 
        margin: 0; 
        border-top: 0; 
        padding:0; 
    }
    #leftnav h3 a:hover { 
        color: #ccc; 
        background: none; 
    }


    Am I missing something?
      • 18253
      • 34 Posts
      Hello Susan,

      I would like to know if you available for hire for this last little .css issue on the template of this post. I have been postponing working on it since I pretty much ran into a brick wall and have too much of a headache to continue. Thank you for all the support in letting me know it is so possible and just steps away from perfection on my site.

      Cordially,

      Marco
        • 28042 ☆ A M B ☆
        • 24,524 Posts
        Actually I ended up with a totally different layout for the menu. But I don’t see the problem with the left menu on your stie. I must be misunderstanding something; if it’s a problem with IE I can’t help much since I don’t have access to IE at this time.
          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
          • 18253
          • 34 Posts
          Actually, very interesting. I hadn’t looked at the site since last week when I was trying to fix the last little font size difference and my whole menu is gone. Everything. I cannot see any menu in either IE or Opera. Is there a way or reason why my whole menu would just disappear? I followed your tutorial and had everything working except a font size on one of the submenus and that was the only thing lacking. Now I’m totally perplexed. Amazing.
            • 18253
            • 34 Posts
            Actually kind of embarrassing but for some reason, I accidently deleted the wayfinder line and now have to get back to where I was. I’ll be back.
              • 18253
              • 34 Posts
              Ok, Sorry about that Susan.

              All back on again. http://www.haztufiesta.com/ampi-59.html

              The issue is that the text (font) on the above link doesn’t match the styling on

              http://www.haztufiesta.com/homes-for-sale.htm for example. It seems like the body .css is not matching or determined and I cannot seem to figure it out.
                • 28042 ☆ A M B ☆
                • 24,524 Posts
                Just add the font styling you need to the #leftnav a item.
                #leftnav a { 
                    width: 175px; 
                    display: block; 
                    color: #bcbcbc; 
                    margin: 0; 
                    border: 0; 
                    padding: 6px 5px 6px 10px; 
                    border-top: 1px solid #444;
                    font: normal 1.1em Verdana, Arial, sans;
                    text-decoration: none;
                }
                
                  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
                  • 18253
                  • 34 Posts
                  Thanks Susan. I went right to work the day you posted and started to adjust the .css and all the while you had already posted it. (: What program would you recommend for .css editing? I use dreamweaver but feel that without knowledge of .css terminology, it is not ideally the best. Menu is complete!!
                    • 28042 ☆ A M B ☆
                    • 24,524 Posts
                    I have used Dreamweaver once, about eight years ago. Ever since I’ve simply coded in a programmer’s editor (to get color-coding and line numbers), usually Crimson Edit for Windows and SubEthaEdit or Smultron for OS X. And VIm in Linux. But that’s my preference. I find that I prefer to understand the nuts and bolts holding my work together, and it’s hard to do that if you’re using some kind of code generator that does what its programmer thinks appropriate, and not what I actually want it to do. I’m sure there will be plenty of others who can suggest other options for you. There is certainly no shortage...

                    http://www.google.com/search?hl=en&q=css+editor+freeware&revid=518779900&sa=X&oi=revisions_inline&resnum=0&ct=broad-revision&cd=1
                      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
                      • 7231
                      • 4,205 Posts
                      I use dreamweaver but feel that without knowledge of .css terminology, it is not ideally the best.
                      This page seems to have some tips for using DW for css development:
                      http://www.adobe.com/devnet/dreamweaver/css.html

                      However the editor that you use is no substitute for an understanding of CSS. This site has a nice set of css/html tutorials that can help get you started: http://www.htmldog.com/

                        [font=Verdana]Shane Sponagle | [wiki] Snippet Call Anatomy | MODx Developer Blog | [nettuts] Working With a Content Management Framework: MODx

                        Something is happening here, but you don&#39;t know what it is.
                        Do you, Mr. Jones? - [bob dylan]