Welcome to Template7

Welcome to Template7 a blog template for ExpressionEngine. If you are in need of a Search Engine Optimized blog for your website then look no further. We have taken every consideration into account from the Semantic HTML to the Order of Content to the Title Tags. Just look at this unstyled page to get a glimpse of what Search Engines will see when they come to a site built using this template.

There are many other features that we outline below. But more importantly if I were wanting to learn how to use EE this is the site I would do it with. Every custom site I build has some aspect of a blog or news releases portion on it. The code we used for this template could be used as part of a larger site and would save hours of time coding a scouring the forums for that little nugget of code.

Anyway, continue reading for more details…

Features

Export HTML using a WYSIWYG? No Way!

Again, we hand code all of our templates. We are big fans of the 960 Grid System (see next point). Template7 validates HTML 4.01 Strict and valid CSS 3. We used semantic HTML for the template so the Business Name in the header is an H1. The tagline is an H2. The navigation is a unstructured list and so on. All of the Titles of the Articles are links to the articles and they are also H2s. It should be a great template for a site that values SEO.

We see grids everywhere!

We use the 960 Grid for just about everything now. It is a lightweight CSS framework that was written by Nathan Smith. The 960 grid system is extremely helpful as it helps with cross browser support. Meaning this site should look the same whether you are using Opera, Safari, Firefox 3, or Internet Explorer 7. Technically speaking we don’t support IE6 anymore but the code should still work. Also, if you need to make changes then that should be a breeze as the 960 grid system is quite easy to learn.

ExpressionEngine

By using ExpressionEngine to build this template we are able to make it easy for fairly non technical people to update everything on the site from the Name and Tagline in the header to the content in the footer and contact page. We use a new feature of EE2 called Snippets for displaying the following:

• Company Name - updates the name in the header and anywhere else the {companyname} variable is used
• Tagline - updates the tagline underneath the company name in the header and anywhere else the {tagline} variable is used
• Email Address - updates the email address in the footer and on the contact page and anywhere else the {emailaddress} variable is used
• Phone Number - updates the phone number in the footer and on the contact page and anywhere else the {phone} variable is used
• Fax Number - updates the fax number on the contact page and anywhere else the {fax} variable is used
• Street Address - updates the street address on the contact page and anywhere else the {streetaddress} variable is used
• City - updates the city on the contact page and anywhere else the {city} variable is used
• State - updates the state on the contact page and anywhere else the {state} variable is used
• Zip Code - updates the zip code on the contact page and anywhere else the {zip} variable is used
• Social Media Links - Twitter, Myspace, Vimeo, Youtube, Facebook and LinkedIn are all configurable from the path.php file
• Side Bar Ads - If you want to display Ads in the side bar you can either use EE to manage those or just drop your code into the .ads template and your ads will appear below the navigation. But a simple yes or no enables this feature in the path.php file
• Side Bar Functionality - Same goes for About the Author, the links for the Membership portions of EE, the Calendar, Syndication Links and the Mailing list. Don’t want a Calendar? Just type no in the field in the path.php file and it goes away. Want your RSS feed to show up? Type a yes in the field next to that variable and it will appear.
• Titles - We all know that Titles and Content are the Holy Grail for SEO. So we made the Titles of the Blog Entries the Titles to the page. So when someone clicks on the comments for a particular article then the Title tag will grab and display the title of the article they are viewing. This goes for Robot for Search Engines too. But, the titles for the more static pages we made configurable so we have spaces in the path.php file where you fill in the title tag information for the About, Contact, Category List and Archive List pages.

Having these variables defined helps in maintenance of the site. To update any of these variables across the site all you have to so is change the value in snippets for the phone number (for instance) it updates both the contact page and the footer on all pages. So you don’t have to hunt through the HTML in the Templates to make that change.

Freeform

We think freeform rocks. So much so that it was our first Module Review. While we don’t create the fields for you in Freeform we do provide the front end form and style it. Freeform is arguable the best form module available for ExpressionEngine. And it is free.

Searching… Searching… Searching….

We went ahead and styled the search results page for you. Your welcome!

The includes from PHP are Embed…

Embeds make maintaining a website a whole lot easier. We use embeds to isolate everything from the head, css files, script files, analytics and navigation (and more) so that if you need to make a change you can do so quickly and know that the change will populate across the site.

I like pretty pictures

The images that you embed into the Blog will be styled if you just add a class name to them. So if you add the class name imgright (class=“imgright”) the image will float to the right and have the appropriate amount of margin on the top, left and bottom sides. If you use imgleft (class=“imgleft”) then the image is styled by floating it to the left and given the appropriate amount of margin on the top, right and bottom sides. And if you use imgcenter (class=“imgcenter”) the image will center in the container and have margin on the top and bottom.

Plugins that we’ve plugged in

You will need to download Freeform from Solspace for use with this template. They are all free. We just did not want to step on any toes by passing on versions of each of these cool add-ons for ExpressionEngine. Once you have installed them the Freeform module will need a firstname, lastname, email, and message field.

RSS what? and Emily Lewis

Emily Lewis recently wrote an article on getting the formatting up to par in the RSS2 template for ExpressionEngine. She took the time to outline various changes that she made to her RSS feed and why. We found those changes to be pretty kick butt so we incorporated them into the RSS template for Blog-ee.

Related to whom?

I love having related posts on my blog so I went ahead and made that a feature on Template7. This will make it much easier for your readers to find other articles that are similar and ultimately keep them on your site.

Lists Lists everywhere

Want your visitors to be able to see what you have been writing? Well we make it easy for them to view your articles by Category or by Date. Handy!

A chance we’ll have to take

We don’t support IE6. Nuff said….

Typography

Blog-ee is a blogging template for ExpressionEngine

Heading One

Heading Two

Heading Three

Heading Four

This is paragraph text. The rest of the text is merely a placeholder to let you see what paragraph text will look like. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

This is a blockquote text. The rest of the text is merely a placeholder to let you see what this blockquote will look like.

This is a link

• Unordered List Item One
  • Unordered List Sub Item One
  • Unordered List Sub Item Two
  • Unordered List Sub Item Three
• Unordered List Item Two
• Unordered List Item Three
• Unordered List Item Four

1. Ordered List Item One
   1. Ordered List Sub Item One
   2. Ordered List Sub Item Two
   3. Ordered List Sub Item Three
2. Ordered List Item Two
3. Ordered List Item Three
4. Ordered List Item Four

• Checklist Item One
• Checklist Item Two
• Checklist Item Three
• Checklist Item Four

Code

What do you get?

In the package

In this template package you will receive a zip file that contains 3 folders:

• A Themes folder with the template in it
• A CSS folder which should be uploaded to the root of your site
• An image folder that should be added to the image folder you uploaded for ExpressionEngine

The installation of Template7 is easy… Upload EE. Upload the CSS folder. Upload the contents of the images folder we provide into the images folder for EE. Upload the template from themes/site_themes into the corresponding folder on your server. Upload the files for Word_Limit and FreeForm. Walk through the install process and select Template7 when you get to the configuration screen.

After you have installed Template7 I suggest that you download Deeploy Helper from Hop Studios and make sure to change all of the paths and specific data from the site. It may cause confusion in the future. Make sure to tip those guys too. Their software is great and they deserve it.