CMS help

So I’m pretty knowledgable about creating websites with HTML/CSS and using php includes. I’m now dipping my feet into making my sites responsive and using fluid grids. I just read a great article on how the Boston Globe was redesigned using media queries, responsive images, etc.

I can do that. But my problem is… when it comes time to making a website where a CMS is needed and/or required, my design skills and creativity start to lack. Up to right now, if I need to use a CMS I just use WordPress along with Thesis. But I don’t want to do this. It’s way too complicated and I end up in the Thesis forums asking questions on how to do this and that every step of the way - hell the forum moderators that help me may have well designed the site instead of me when its all said and done.

So when I design a site using Thesis, my whole design ‘mindset’ changes and I begin designing my sites while thinking in the back of my head how hard it would be to “make it work” in Thesis.

I’m not a programmer. I really don’t know much about PHP except from what I copy and paste from Google searches for my Includes. But where I work am the sole web designer/developer so I’m kinda forced to know it all.

I just want to design something really nice and use HTML/CSS to make it happen. Is there a simple CMS I can use to plug into my pages that makes it pretty simple to edit later?

I’m looking into Perch right now which looks promising. To those who do use Perch - is it easy to integrate a Blog/News type of section?

I would use some of these simple CMS’s where you just make certain regions editable but then what about really large sites I need to maintain, with news stories, etc?

Any help would be greatly appreciated. I just feel like if I can jump over this hurdle of CMS and content management, I can really start to advance with my website design and what I can offer to clients.


I adore Perch. It’s a very simple—and therefore beautiful—solution. When any of the major options would be a sledgehammer to crack a nut, it’s lovely and it lets me craft a site how I want to, all OCD-style. You can set up a weblog easily enough: if the default edit tags are not enough, there is a weblog plugin from Perch.

But it’s not really right to use just one CMS unless you always have similar briefs. For bigger projects, you need something that can scale, like Drupal (with which I have a love/hate relationship: I love it, but it hates me!), Expression Engine (never used it because of the high cost), or whatever the next twenty-five developers swear by.

Edit: And how the hell do you get this site to accept HTML entities…

I hate to break this to you, but at the stage you’re now coming to, I don’t think you have much choice but to learn some PHP.

It looks like you’ve already taken yourself about as far as you’re going to get with with the whole HTML/CSS thing. Like you said, your’e more of a front-end designer rather than a back-end developer. Yet, you’re being asked to do back-end development … which requires some knowledge of back-end programming like PHP, mysql, apache, etc. All that stuff you front-end guys dread, basically. :smiley:

As good as some of the CMS systems are … I can’t honestly say there’s a single fool-proof one. The day you find one that you can just install on any system and just have it work right off the bat and be predictable in every situation … is the day you should run out and buy as many lottery tickets as you can. At some point you’re going to have to get your hands dirty when dealing with this stuff.

If being a front-end developer is what you love to do, then nothing wrong with that. Don’t think that you have to do “everything.” Just that if front-end is what you do, make sure you’re really really good at it. :smiley:

CMS Dude,

You couldn’t have said it better. I really do ‘dread’ that type of stuff :lol:

Could you point to me some good resources/books/etc to learn begin learning PHP and CMS development and help me smooth my transition into developing my websites for content management.

Also, I’m wondering (and this is also because of my lack of knowledge in the CMS department) about the ‘workflow’ of creating a website in HTML/CSS and gliding that into a CMS, such as WordPress… what does that process look like?

For example - for a simple yet large site - is every page handcoded in html/css and then taken into the CMS (however that works… ) or are just the main pages, such as the home page, and the basic secondary page coded?

I’m just wondering how the process works and I obviously need to do some reading about all of this. I just don’t know which direction to go!

Off Topic:

It doesn’t. You can insert the em dash with Shift + Alt + Hyphen (might be CTRL + Hyphen key on Windows)

I think it’s different for everyone and depends on how you learn. Since you’re a front-end developer, then you’re probably more of a visual learner. In which case, you might look at Some good beginner tutorials there. For me, I tend to be more of a book learner, so I just loaded up on books, but honestly … my learning really accelerated when I started watching Youtubes. Yea, that’s not a typo either. You can find a ton of beginner PHP tutorials all over the youtube-o-sphere if you just do some searches. And it’s pretty easy to separate the good ones from the bad – the better ones almost always have the most views.

That’s a good question, and I don’t want to over-simplify it but I don’t want to bombard you with too much either. The simple answer is … you’re essentially starting with a template that looks a lot like your regular, static HTML page. And from there, you’re just designating regions. Some regions might be static, like the header image and the menus. Those might just be regular static HTML. But the idea is to identify the areas or regions that you want to be dynamic … i.e. … “this block, right here, I want the user to be able to enter the content from the Content Management System (usually a WYSIWYG editor).”

… And for that block or region, you will have some sort of funky and extremely ugly code to stick there. And that funky and ugly code just says “Right here, inside this div, I want dynamic content, identified by ‘X.’” And that dynamic region will usually be identified in some way from within the CMS. In the case of Joomla, it would be a module position. In the case of Drupal, it would be a “block.” And in the case of wordpress it would be a post. Or a page. But either way, the “chunk of content” you are asking for will be identified by a number or name (number in wordpress).

So in simplified terms, the function you would put in that div would go something like this:

<?php {grab a chunk of content identified by "X" and place it here} ?>

And that ugly chunk of code there is simply placed within your regular-looking HTML that makes up your page … and inserted where you want your dynamic chunk of content to appear. The CMS then goes through your page and renders it as normal … but when it sees that ugly chunk of code within the opening <? and closeing ?>, it goes in to it’s database and pulls the content chunk that your ugly code is asking for, and spits it out, right there where you stuck your piece of code. And then, it continues to render the rest of your HTML as per normal - until it reaches another one of those ugly chunks of code asking for another region. And that’s essentially what most CMS’s are doing, in an overly-simplfied manner. Now for the non-simplified explanation:

Lots of frustration, followed by searching through multiple forums, Q&A sites, instructions videos, and blogs. Followed by lots of coffee, more visits to sitepoint … searching for books, followed by more google searches through more forums and tutorials … catch a couple hours of sleep at your chair, and repeat. Eventually it gets better, though. But not much.

You could also try MagicEdit (I’m the co-founder, full disclosure). If you want an editable block of text you just do something like this:

<magicedit><p>Text you want to make editable.</p></magicedit>

When edited, the changes are stored in the database and dynamically replaced when the page is requested (the special tags are removed). Other than that, it’s out-of-the-box HTML/CSS. There’s also support for rich or plain text, images, new pages, forms, and links all using the same philosophy. The workflow is just adding the CMS stuff at the end; design the site using standard techniques including templates for editable regions and pages, then add the editability in after. Login and editing happens directly on the site, from the site.

Other similar (erm, competing) systems are CushyCMS, PageLime, and maybe Webpop.