CMS101 - Content Management System Design - Basic CMS With PHP Includes

I know i'm reviving a dead post here, and sorry, but I looked around and found nothing past this point. I did pretty much the same thing, but just included a standard include file, and created functions to display each blocks of html code.
This just keeps it simple for me by instead of having a directory full of .inc, .php, or .html files, I can just open that single file to edit the header, footer, and menu. Obviously the content pages displayed in my #MAIN div are seperate .inc files. I was wondering about more of the CSS aspect of it, and ideas on design. I've read many tutorials and examples on css, but when trying to design a menu using a list object, internet explorer just gave me way too many problems. Eventually I used a free css approach for the menu.

Anyway, what I was wondering is where do you go from here? I guess more of a template (style) approach for each of the sections. Should they displayed in a table as the example above, or is CSS more effective?

Again, sorry to revive this post but I'm very interested in this thread.

 

 

 

Comment/Reply (w/o sign-up)

Thank you for your interest in this subject. I am always willing to discuss most aspects of website design. I consider CMS and template use to be the backbone of a good website.

I originally started this tutorial as a beginners guide to the PHP used to start a simple template based website. The next step I would have gone into was the use of some type of database to generate various parts of the website. A database table or file would be the best way to store the information needed to build a more advanced, easy to edit menu.

It would seem that there is more of a desire to discuss layout and design when using a template system so I'll try to help with that.

---

I really think anyone intersted in website layout and design should read many sources before deciding on their website's look. Having said that, here are my thoughts.

I like keeping the most used links in a tool bar near the top of the page but keep other useful links in a menu on the left side of the page. Neither navigation aid should detract attention from the main content of the page. The tools should look good and be easy to find as long as they match the rest of the website.

Various modules can be used throughout the website but some modules need not be on every page. For example, you don't need a latest news module shown on the news page of your website. The log in module doesn't need to be on the log in page. The simplae search module doesn't need to be on the advanced search page.

These are the kinds of things that stick out in your visitors minds as being redundant or even confusing. These are also common sense things that we tend to overlook because we are so busy looking at our new layout and not reading our own content.

---

People always want to know how they should output their HTML. Should we use CSS only and get the validation or should tables be used. That question is nearly impossible to answer. Since not all of the web browser designers choose to follow the so called industry standards for web page validation and they can't seem to make all of the browsers display the same web page in the same way, it isn't really easy to figure out how to code your pages.

I use tables! I like tables and I don't care about validation. I do my best to make my pages look the same in every web browser. CSS has such varying support among the browsers, I have a lot of trouble getting it to work properly in all browsers. Best case senerio is that things look a little different but the general feel of the website is intact. The worst case senerio is that I need multiple CSS files, each dealing with a different browser.

I use CSS to control my tables and I usually add variables to the tables to allow for dynamic variations on the fly. For example, I sometimes like to eliminate the right column of my website if I feel that the content needs more room. If I wrap a forum system in my website I can make the template provide a wider area for the bulletin boards.

Remember, you can always use CSS inside of your table cells and then just use the table to keep things lined up corectly. I alway design my templates to be variable width.. This way the page uses all of the space on the monitor's screen. I never understood leaving 150 pixel margins on either side of a website. I figure at the very least, stick an ad their to maybe generate some income.

As far as placement of modules and design tips, you really need to consider more than what works for me. I'm not a very good designer. I focus more on the scripting aspect of web design. You personal preference will be the most important factor in deciding what your page will look like in the end. Hopefully, if you write a good enough CMS sytem, you'll be able to try various layouts with little effort. Afterall, that is the whole point isn't it, being able to manage your content easily. I will, when I get a chance, go into more advances scripting for a simple CMS or template based system.

If you have more specific questions related to this topic, please feel free to post them. The design and content is such a broad aspect of the system I can't really get into everything in a signle topic.

I don't know if I answered any of the questions but I will try my best to answer any of the follow up questions.

vujsa

 

 

 

Comment/Reply (w/o sign-up)

Thank you, it was a very interesting read. Let's start off with a header. I'm not that great at photoshoping much of anything, but I have a basic understanding of how to use a graphics editor. What should the header consist of? For me, it's something that basically describes what the page is going to be about, and some flashy graphics or colors to signify that this is the beginning of the page (top). The graphics should be kept to a minimum size however, and I've noticed a lot of graphics have pieces now days. I think there's two reasons for this. This allows the user to actually see something being produced to the page while the content is loading, which makes them more interested. Secondly it allows your images to be less likely to be stolen or used without your permission.

Color choice for a header is something that stands out and has a little stronger than the colors used in the rest of your document. I'm just curious on how you would handle colors. Would you use flashy colors or keep it simple with like no more than 3-5 colors.

I am focused on the design aspect, as I have been scripting a lot lately. I starting to feel comfortable with basic scripts, but there's always something out there that confuses me, that's just programming for you. I just wanted to be able to produce a simple website, and make it look nice, hence css. I'm not good @ all with design, so by using a CMS I figured I could control the design and make it a simple yet elegant site without too much effort.

As for the footer I was thinking just a horizontal rule or something, then small text signifying the data, and if technical issues contact the webmaster.

I dont' know what type of menu I would prefer. The site I'm going to be working on only has a few links and isn't filled with a lot of content. I think that single menu would be sufficient, although if I had more than an admin login in it to add content, I would definately take into consideration of having a hozitonal menu, and a veritcal menu. I think I like the horizontal menu, but it seems harder to implement. I was looking into a drop-down menu, and finally got a vertical menu to work in ie6 and firefox (and i think ie5). I worked with it for hours then followed a tutorial. I understand about 40% of what I did. IE6 presents a lot of errors with CSS, so I see your viewpoint with tables.

I would like your thoughts on the header, footer, and menu creation and what types of colors to use. Simple or flashy?

Comment/Reply (w/o sign-up)

Well, I'm not real good with the design aspect of web developement either but here is template I am currently developing for Mambo / Joomla.

http://www.vwone.com

It still needs a lot of work but the basics are already there.

I think you can get more design tips in the website design forums.

vujsa

Comment/Reply (w/o sign-up)

This Content Management is very useful and i like how it is im going to customize and study off these scripts that you have provided

Comment/Reply (w/o sign-up)

Hi Vujsa,

Thanks so much for the clear explanation in your tutorial!

I have used this method for my client to be able to update a news panel along the side of his website. However, he has requested to be able to go to a password protected url/admin page that he could enter the information, click 'submit' and have it update on his site.

So I suppose in other words, is it possible to create a form with the ability to update the appropriate .php with a submit button?

Any advise would be MUCH appreciated!

Regards,
Yu-Li

Comment/Reply (w/o sign-up)