Tag Archives: css

Custom CSS in Movable Type 5

As I covered in my last post, I have two subdomains: one for the CaSt blog and another for linked items (actually, there’s a third for archives).

Each subdomain has its own css file. For my purposes, all three use the same code and I was trying to manage updates on all three. It struck me what a waste of effort that is when I glanced at the beginning of the default styles.css document where the main css elements are imported into the file like so:

@import url(http://carryingstones.com/mt-static/themes-base/blog.css);

My latest discovery led me to pull all of my custom css into a single file—cast.css—and import it into the root styles.css in the respective directories.

Note that you can make those changes in your text editor of choice and upload them using your preferred file transfer methods; however, you have to save and publish each of the updated pages through the Movable Type dashboards. Find the appropriate files to republish under Design → Templates, then select the Stylesheet template (styles.css).

My apologies to anyone who may be rolling their eyes at this MT newbie. I’ll move on to other more entertaining items soon. I am writing about such basics because I had such a difficult time finding helpful tutorials, and hope to help others with articles like this one.

Movable Type css with subdomains

***Update:** I spoke too soon. My initial fix did not work (see strike below. The fix that actually worked for me follows. –elb 2012-09-17 12:21:24*

Adding subdomains to my new Movable Type 5 website screwed up the links to my css stylesheets.

The fix is easy and I think it will hold up over template changes and updates, but as an MT newbie it took me a while to track down.

First, my setup here on my site looks something like this:


In the template governing the html head, the links to the stylesheets were pointing to the relative domain. This worked fine at the root level, carryingstones.com, but broke when it moved to a subdomain (blog., and linked.).

Updating the styles.css at the root level seemed to fix my formatting problem. I changed from this:

@import url(/mt-static/themes-base/blog.css);
@import url(/mt-static/support/themes/professional-blue/professional-blue.css);

…to this:

@import url(http://carryingstones.com/mt-static/themes-base/blog.css);
@import url(http://carryingstones.com/mt-static/support/themes/professional-blue/professional-blue.css);

OK, I got it. I was on the right track but in the wrong place. It ended up being a huge MT rookie oversight that was quickly repaired by updating mt-config.cgi with urls instead of relative directory paths. Now, it looks like this:

StaticWebPath http://carryingstones.com/mt-static/
StaticFilePath http://carryingstones.com/home/carrying/public_html/mt-static

…and so far so good. I’ll let you know if I find anything else.