We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 28042 ☆ A M B ☆
    • 24,524 Posts
    Here’s what I usually do:

    1. Create a sample web page, exactly as you want it to look. Use whatever tools you want to do this (Rapidweaver, text editor, however you are most comfortable creating a web page). HTML/javascript/css only; no PHP allowed here.

    2. Copy this to a new template in the MODx manager, set up the correct file structure for css files and such (usually in assets/templates/templatename) and adjust the paths for these in the template.

    2. Create a document and set your new template as its template.

    3. Start replacing the dynamic parts of the template with the appropriate MODx tags (document variables such as [*content*], TVs, snippets for PHP code, etc).

    Once you get it all set up, then you can set your new template as the site default in the Configuration.
      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
      • 16148
      • 84 Posts
      I’ve made a example, can u tell me:
      http://www.megaupload.com/?d=Z2NTW5FZ
      Is that right?
      Or what did i do wrong?
        • 28042 ☆ A M B ☆
        • 24,524 Posts
        If you can open it and it looks the way you want it to in your browser, then you can use it.
          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
          • 1169
          • 312 Posts
          Take a look at http://www.sottwell.com/andreas00.html
          http://modxcms.com/forums/index.php/topic,44157.0.html

          both of these are 3 column templates and could be developed to include your design.

          sottwell converted first link and I converted second link.

          do either of these seem of use to you.

          I can advise on second.

          First is downloadable from http://www.sottwell.com/andreas00.html

          I did look at your code you need to get images into HTML first
            DEVELOPMENT ENV:- Ubuntu 12.04 | MODx Revolution 2.2.8 | LAMP 2i Apache 2.2.22 | Php 5.3.10 | Mysql 5.5.31 MySQL client version: 5.5.31
            • 16148
            • 84 Posts
            My buttons and so on? but i every thing right then?

            Where should i but my "images" to on the FTP server, template/topslemvig ?
            TopsLemvig is the name of my file.

            BTW.
            I have allmost codede my template, but i want to make a search engine, i havent done any buttons or some thing, should i do that or how does it work?
              • 1169
              • 312 Posts
              Have you loaded MODx to your server/host yet?

              If so where you place your images is your choice if small site can be in root (not agood idea in my view)
              but your XHTML must reflect path.

              Possible other paths

              assets/images
              assets/templates/images
              assets/templates/yourTemplateName/images

              modxRULES http://modxrules.com/articles/where-to-keep-your-css-and-template-images suggests :-
              assets/comp

              assets folder is created with MODx install.

              Looking at your files you will need seperate images for header and content.
              Not one as you have.
                DEVELOPMENT ENV:- Ubuntu 12.04 | MODx Revolution 2.2.8 | LAMP 2i Apache 2.2.22 | Php 5.3.10 | Mysql 5.5.31 MySQL client version: 5.5.31
                • 16148
                • 84 Posts
                My content and header, is placed together, so its not possibel to copy the template unless u take a screenshot or something..

                What about the buttons? - I can not just make some random buttons, because i would like that oppintunity to EDIT my buttons if possibel.

                So how do i do that? Make som empty buttons??
                  • 18913
                  • 654 Posts
                  If I were you (and I was at one point) I would go to the the tutorials at "codingpad" and follow along with those, using the example provided. You’ll very quickly see how things can be put together.

                  As far as your particular template goes (and leaving styling issues/techniques on the side of the road for now) you should be able to get to something as seen in the attached MODx screenshot, which is the result of about and hour-and-a-half of trying to make sense of the tagging and comments in your template.

                  Here’s a hint : the template in MODx for the screenshot looks like this, using the template-creation process outlined in the "codingpad" tutorials. Seriously - go through all of them carefully.

                  {{topslemvig_header_chunk}}
                      <div id="masthead">
                        <div style="position: absolute; width: 847px; height: 108px; z-index: 1; left: 662px; top:0 px" id="layer1">
                          <img src="assets/templates/topslemvig/images/Header.jpg" alt="headerimg" title="headerimg" />
                          <div id="masthead">
                            <div class="clearing">
                              <div style="position: absolute; width: 471px; height: 577px; z-index: 1; left: 187px; top: 173px" id="layer2">
                  
                            <h1>
                                            <span class="style1">[(sitename)]</span>
                            </h1>
                            <h2>
                                                <span class="style1">- [*longtitle*]</span>
                            </h2>
                                <span class="style4"><span class="style1">[*content*] <!-- end main --></span></span><br />
                                Lorem<br />
                                ipsum<br />
                                dipsum...<br />
                              </div>
                            </div>
                          </div>
                  {{topslemvig_rightside_chunk}}
                      </div>
                  
                  {{topslemvig_leftside_chunk}}
                  {{topslemvig_footer_chunk}}
                  
                  


                  MattC
                    • 1169
                    • 312 Posts
                    I would second that last comment by mconsidine.

                    I have learnt a lot from The Coding, Pad Bobs Guide’s and Susan Ottwell’s Tutorials.

                    I think from your repies that a better understanding of the system is required on your part.

                    I found the podcasts at the Coding Pad made sense once I had read the Tutorials.

                    I think you should get your template sorted out before worring about the buttons that can come later...

                    Have you a localserver running with MODx???
                      DEVELOPMENT ENV:- Ubuntu 12.04 | MODx Revolution 2.2.8 | LAMP 2i Apache 2.2.22 | Php 5.3.10 | Mysql 5.5.31 MySQL client version: 5.5.31
                      • 16148
                      • 84 Posts
                      My own server? - no, its from One.com - if thats is what u mean