Where to keep your css and template images

Almost any (x)html website will require some images and a css file. Placing those files in the modx(evolution) directory structure is a matter of preferences.

Images(template components)

In my opinion the images you use for your templates, like arrows, shadows, rounded corners, should be placed outside the assets/images folder. You don't want other users messing with those files. Because I consider those images components of the template I like to create a comp folder in the assets folder.

The main reason I do this is because I can access those files pretty easy via FTP. Imagine putting these files 2 levels down into the folder structure. Eg: assets/templates/mytemplate/images. You would have to click a few more times to get to the files.

CSS file

I like placing the site's css file directly in the assets folder. The reason I do this is because it saves time when typing paths for the above images(template components).

My css paths look like:

background:#D9E5CD url(comp/bg-top-1.png) repeat-x scroll 0 0;

I only need to type comp in front of the image and I'm done.

I would love to here other opinions. Please leave a message if you have one.

Write a comment

• Required fields are marked with *.

Name:
Email:
Subject:
Comment: *

Help prevent spam - enter security code above:
 

Michel
Posts: 4

Comment
Reply #6 on : Wed February 17, 2010, 02:24:37

---

I agree that it does save a lot of time. But it also creates other problems, as your site grows it will need structure or else everything will quickly become rather chaotic. I would rather have to click through a few folders then to search an entire folder with more then 1000 files for the right file. That is pretty annoying, especially when you use some FTP client and have no way to preview images for example.

cipa
Posts: 2

Re: Where to keep your css and template images
Reply #5 on : Wed February 17, 2010, 06:46:56

---

Hi Michel,
You have a good point.
Most website don't have more then 20 images that are used for design purposes and most of your images should be in sprite. If you code your site correctly you can easily get away with only 1 sprite image; in this case your image can sit anywhere.
Using comp helped me a lot on developing big corporate websites with more than 50 images that weren't put in a sprite.
I guess it's up to you to decide what is best for you and what works in the long run for your website.
Thank You for your comment

Anton Kuzmin
Posts: 4

Re: Where to keep your css and template images
Reply #4 on : Tue March 30, 2010, 22:32:39

---

I work with files used in template via ftp-client. Therefore, for more neat paths I keep all these files (css, images, js and other) in special folder named 'tpl', that located in root (like assets and manager).

Microcipcip
Posts: 4

The CSS Path
Reply #3 on : Tue June 15, 2010, 15:51:51

---

Hi Cipa, I have never seen this website before! There are a lot of useful information. About the css path, usually I add the <base> tag and so I don't need to care much about the background url:
background: black url(../img/bg.jpg);

However, you're right about the FTP and the time that it takes when you write the javascript and css path.

cipa
Posts: 2

Re: Where to keep your css and template images
Reply #2 on : Tue June 15, 2010, 15:57:14

---

Lately I've been using the following paths to save my files

assets/templates/mysite
assets/templates/mysite/css
assets/templates/mysite/js
assets/templates/mysite/images

So I think I might update this post.

Last Edit: June 15, 2010, 15:57:29 by cipa  

Kaspar
Posts: 4

dynamic CSS
Reply #1 on : Thu August 26, 2010, 05:06:57

---

Once I learned that best way is to just create a text/css document into root in MODx manager I only use that. Dynamic CSS gives lot more options and less restrictions cutting PSD to HTML as for example image files I want to let users to change can be easily in CSS.

Just make the URL alias whatever.css and link it to your template.