Development

Easy way to make editable Headers and Footers

If you want your clients to edit the footer, and not learn HTML, its sometimes difficult to get things working using a module solution. I've done it with a hidden page and article, which allows you to edit the content (and your client too).

Create CSS Holder Page

  1. Create a unpublished, hidden navigation, non-searchable page called CSS
  2. Create a published article inside the page called Footer (or Footer Article if you like), note the ID number at the top of the edit screen for a later step, e.g. ID=5.
  3. Create Content Elements for each part of your footer, e.g. Image, Table, e-mail links, etc.
  4. Remember to give each part of your footer a special class/ID if you need to style them in a special way

In a similar way, you can add another article for Header as well, with all its content elements inside. Both Header and Footer Articles can reside on the same CSS page (so its not needed to make separate pages).

Add Module

Go to Modules and create a HTML module called Footer. Then in the HTML, write the inserttag:

{{insert_article::5}}

where 5 is of course the article's ID number, noted above.

Now your footer is completely editable with the Article/Content editor and you can provide client access.

In the same way you can create another module called Header and insert it with its own article ID.

Completely Editable

The main reason why I needed this, was to insert e-mail addresses scrambled by TL and also a nice way to insert images and other data that the client could still edit. Client module editing is a big no-no for me.


Tutorial created by thyon 2008-08-04 12:35