Archive for the ‘CSS’ Category

Bullet Proof CMS record ordering pattern

Posted in CSS, Code, PHP, cms, mysql

When building a custom backend, quite often a client will ask for the ablilty to order records/posts/images…

Here’s a tried and tested method i use to build this functionality. It will work with or without js. In this example we will order the traditional post records.

1. The Database

Create a table to hold your posts and include a column (int) called order.

2. Adding a new record

Each time a new post is saved, the order column is assigned the auto inc value of the rows id. This prevents records from ever having the same order value.

3. The order view (HTML)

To provide the user with a way to order posts records, i’ll start with the HTML. This process is designed to degrade gracefully when JS is disabled. Dont worry if this process seems a bit clunky to the user, chances are they’ll have js turned on. I have found by restricting yourself to develop for HTML first created better structured and semantic code. Quite often divining straight in there with the javascript will get the job done, but it’ll be a headache to maintain.

Read the rest of this entry »

CSS Typography Template

Tags: ,
Posted in CSS

typography-framed

Here’s a quick HTML template to organise your CSS typography.

Nothing fancy, just an HTML file containing the most common elements to start your CSS, and a basic typography stylesheet. I used the 960 grid system to reset browser CSS and control the template layout.

I find this helpful as a starting point for any site. Before I start knocking a CSS class together to style an element up for a specific page, I refer to the sites CSS template to see if  a similar base element already defined.

I would encourage keeping this typography stylesheet as basic as possible. Then use general css classes to add extra style later on.

Both the HTML and CSS files are included in the zip after the jump.

Read the rest of this entry »