No-Module-Required Static Content in ExpressionEngine

Here’s a “back to basics” tutorial for newcomers to ExpressionEngine - how to build a static portion of a website, with no plugins, extensions, or modules required.

While this has always been possible in EE, I think the popularity of Mark Huots “Tome" Module or the availability of the native EE Pages Module has mislead some folks into thinking that these modules are required for presenting static content in EE. 

Nothing could be further from the truth - and in fact there are some advantages to sticking with native EE functionality for static content.

 
Download the EE Code for No-Module-Required Static Content in ExpressionEngine

This tutorial is meant in no way to disparage the Tome module - I’ve used it and do appreciate many aspects of it including the site-map based UI, the easy breadcrumbs and nice URL’s.  I also appreciate the authors contribution to the EE community and will readily confess that his coding skills are on another plane from my own…

Having said that, using native EE code for building a static section of content has a number of advantages over the Static Page module.  I’ll cover those after taking you through how to build a static content section using the native EE code approach. I do also want to note that there is an entry on the EEWiki regarding static content outside the Pages Module, but I felt it could be improved upon - especially for newcomers to EE.

When finished with this build approach adding a page to this section of a site is just a matter of publishing a new post to the designated weblog.  Need to delete a page?  Just delete that post and the page is gone from the site.  Want a page to show up on a certain date?  Just publish the entry with a Entry Date set to the future date required.

OK - with the disclaimers out of the way let’s proceed.  In the following tutorial I’ll show how to build a simple static section with a default Index page and some subpages.  I’ve posted both a working example of this approach so you can see it in action.

For this native-EE static content approach you’ll need a new weblog, field group, content, and a new template.

Note on Links/URL’s
Here on Train-ee.com “courseware” is my renamed EE index.php.

Weblog Setup

  • In the EE control panel, navigate to Admin > Weblog Administration > Weblog Management
  • Click the “Create a New Weblog” button and create a weblog to hold the content.  I’ve called mine “Static”.

Field Group Setup

  • In the EE Control Panel, navigate to Admin > Weblog Administration.  Click on “Custom Weblog Fields”, then the “Create a New Weblog Field Group” button.  Name your new field group - I’ve created one called “staticpage”.
  • Now click the “Add/Edit Custom Fields” link by your new Field Group and add a new field.  I have just one field in the group, called “static_page_content” - which is a textarea with 12 rows.  This assumes my static pages are very simple, with a title and paragraphs of text.
  • Now back under Admin > Weblog Administration > Weblog Management, click the “Edit Groups” link by the “Static” weblog.  Assign the new field group to the weblog and save.

Content Entry

  • Index Content
    This approach assumes the the Index page (or section default page) content is entered first - so click the Publish tab and choose your new weblog.  Enter your Index content and save the entry.
  • Subpages
    The next posts entered in the new weblog will become our sub-pages, so create a new post for every sub-page you’ll need. I’ve entered 6 posts for six subpages.

No worries if you enter the content out of order - you can always tweak the publish dates to push the Index content to be the oldest entry.

Template Coding
For the purposes of this tutorial, I’ve created a new template group and called it “static”.  All we’ll need is the index template that EE provides by default.  For reference, download the text version of my template.  Copy/paste anything you need - just tweak for any path or name differences.

The template uses two weblog:entries tags—one to build the left navigation, and one to display the page content. 

  • Left Navigation
    For left navigation we want links to all the sub-pages, but not a link to the Index page.  This is done by using the “sort="asc" parameter to put the oldest post (our Index content) last, then using the “offset="1" parameter to drop that one from the list.  The “dynamic="off" parameter is important here - if you don’t use it you will lose the subnavigation as soon as you click one of the links to a sub page.  Note that using a date-sort on this tag means the left navigation list can be ordered in any way just by tweaking the pubish date of the entries.
  • Page Content
    A second weblog:entries tag brings in the page content.  The “limit=1” parameter ensures that we will only see content from one post. The “sort="asc" parameter ensures that, if no url-title is passed to this template by one of the subnavigation links (like a link from your main navigation bar), the Index content will be loaded.

That’s really all there is to building a simple, two-level static section of content with ExpressionEngine.  And this is just one approach - as with anything ExpressionEngine there are always multiple ways to achieve your goals.

Advantages
There are a few advantages of using this approach over the Tome module:

  • An obvious one - no additional software to install or update, or worry about when upgrading EE
  • Adding subpages is easier - all you (or your clients) need to do is publish a new entry to the Static weblog and it will immediately appear in the subnavigation.  No creation of categories is required.
  • Removing pages is easier - you can either close out pages (great for content that’s being edited) or just delete the post from the weblog.  No deleting categories requried.
  • All native EE segments and conditionals are available for more advanced template coding.

Category Navigation

Next Entry >>

 

Add Your Comment

Comment on this Post

  

Unless otherwise stated all content is © Michael Boyink of Train-ee.com & Boyink Interactive. Please don't steal - I've got kids to feed...