EECMS with no channels

So last week I sent this Tweet in relation to a site I was building.

So last week I sent this Tweet in relation to a site I was building.

my original tweet

If you haven't used Low Variables before, check it out. 

I would typically use this particular add-on where I have small snippets of information that don't fit into a specific EE channel. In years gone by, I would probably have used the @boyink method of creating a 'misc content' channel and storing those snippets in there.

However, that doesn't give as much flexibility because those snippets are only ever text. LV gives a plethora of fieldtypes available to us like:

Low Variables fieldtypes within ExpressionEngine

The site in question

An event site for a tech conference taking place in Belfast next week. The timeline was pretty short on this build and I opted to use Zurb's excellent Foundation framework for a production site (I don't normally do that but that's another post) to help speed development, particularly for the responsive goodness it has.

Lack of channels

Why? Channels and field groups are the biggest features of ExpressionEngine for me - outside of our great community that is. This site needed LV regardless because of the various snippets the client would need to edit. So my main reason for not using any channels was that I wanted the client to edit everything from one single interface. 

Given this is an event site, its shelf-life isn't going to be very long, a few weeks at most - so "building for growth" wasn't going to be a major obstacle. 

The approach

Within LV, I created some variable groups to match my EE template groups (which act as the first url segment for the uninitiated). 

Low Variable groups for each template group

As you can see above we have 2 additional groups - I'll come to those later.

For the most part, these variables are just Redactee WYSIWYG fields, a few text inputs, file selector (for client to switch out images). If you look at the ProgrammeExhibitors or Elevators pages you'll see we have looping content.

Typically that would have been a channel with a field group per channel. However, we have LV and Matrix at our arm so we can combine the 2 to give us

Now the client can add as many workshops as they want and see them all on the same page. Pretty neato! We took the same approach with the Exhibitor and Elevators pages.

What I was most surprised at about this approach was that the query count was much lower than using a channel entries tag. So there's an immediate performance win. I imagine though that with enough Matrix rows, that win would go out the window - but for **this build **that's not something this site will ever incur.

Registration

What event website would be complete with a registration process? This was a good bit simpler than other event registration websites we've built in the past because it was a free event. On this occasion, we rolled with Freeform  (free version was good enough here), adding all the fields we needed, added jQuery validation as well as Freeform validation too.

We then used LV to allow the client to choose where the registration emails should go by adding the email address and customising the content of the email the user should get on registration (thanks Dennis).

So yeah, this approach worked on this particular site. It would definitely run into limitations if the site grew, particularly if I wanted to anything relational (relating a speaker to a workshop as an example).

Other LV uses

Even although this was a pretty unique build, here's something you can definitely do with any build using EE:

{exp:low_variables:single
var='lv_html_head'
preparse:body_id='home'
preparse:page_title='Home'
}

this is a textarea LV called 'lv_html_head' which contains

<!DOCTYPE html>

<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

<head>
    <meta charset="utf-8" />

    <!-- Set the viewport width to device width for mobile -->
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>{page_title} | {site_name}</title>

    <!-- Included CSS Files -->
    {exp:minimee:css}
    <link rel="stylesheet" href="/assets/css/app.css">
    {/exp:minimee:css}

    <script src="/assets/js/foundation/modernizr.foundation.js"></script>
</head>
<body id="{body_id}">

and allows us to pass the page title and the body id into the template to be parsed by the browser.