"Custom" template for MODx

Hi guys.

I am a graphic web designer, and i am not so good at coding.
So I have never setup my own designs for MODx or any other CMS system.

I would like to know, how i could do my own template into a CMS template.

HOW.


- Joakim

btw. sorry for my English - i am not so good at it.

I am from Denmark :’(

This might help: http://bobsguides.com/porting-your-site-to-modx.html

Welcome to MODx.

Getting your template into MODx is not difficult at all. Some other resources that might come in handy:

http://wiki.modxcms.com/index.php/Beginner%27s_Guide_to_MODx
http://www.sottwell.com/how-templates-work.html
http://codingpad.maryspad.com/2009/03/31/building-a-website-with-modx-for-newbies-part-3-working-with-templates/

Have fun!

Can some of you personally help me, i am totally lost in the tutorials.

How do i begin, starting koding my template first? then add the codes from til tutorial?
Its this template, i want to make "MODx" able.
http://img24.imageshack.us/img24/7549/backgroundvz.gif

Can u please help me?

Do you know how to code HTML/CSS? That’s where you need to start. If you have PSD (photoshop file) version of your template (as opposed to gif) you can hire someone to slice it and code it for you in HTML/CSS. Then you take that code and use the tutorials to convert it to a MODx template.

Check out http://www.w3schools.com/ as an excellent place to start if you’re not familiar with HTML/CSS.

I know the basics, for HTML such as:

<html>
<title>


<p>
<h1>
<h2>
<h3>
<strong>
link to stylesheet
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
link to picture
<img src="MAPPE/BILLEDMEDFILTYPEBAGEFTER.png" width="150" height="138" />
link to mail.
<a href="mailto:[email protected]" class="style8">
Link to jQuery files.
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/custom.js"></script>

And so on, i have microsoft expression to help me - if i have problems.

A MODx template is simply a Web page, HTML and CSS. The difference that makes it a template comes in the use of MODx tags for the dynamic content. For example, the main content area for each page is inserted with [*content*] tags, and the results of PHP code (such as a dynamic menu generated from documents in the database) are inserted with [[Wayfinder]] or [!Wayfinder!] tags, using the name of the snippet.

There are several articles and tutorials that walk you through the creation of a template, explaining what the various MODx tags are and how to use them in the template. Mine is found at http://www.sottwell.com/how-templates-work.html

I was thinking, ehh, i have 3 coloms, and a few points, in each site, if u understand..

Quote from: kOLDSQ at Jan 27, 2010, 01:16 PM

I was thinking, ehh, i have 3 coloms, and a few points, in each site, if u understand..

You can set it up however you want with HTML and CSS and you’ll be able to pull that easily into MODx using placeholders, chunks and TVs. Your first most crucial step is to code this correctly in HTML, test it and make sure it works, and then the easy part will come, porting it into MODx.

Quote from: sottwell at Jan 27, 2010, 12:30 PM

There are several articles and tutorials that walk you through the creation of a template, explaining what the various MODx tags are and how to use them in the template. Mine is found at http://www.sottwell.com/how-templates-work.html

Linked to your tut in my post above