Grid A – Post Timeline

Grid B – Post Block

Grids for Blog & Real Events Main Pages

Below you will find a few examples of stylized grids to be potentially be implemented to the blog and real events main pages. There are a few things I wanted to note before you review these:

  • I am proposing that we create two blog category “filters” – one for real events and the other for our standard blog entries. In terms of the WordPress backend, they are all technically considered “posts” but the way we ensure the appropriate content automatically goes to the correct place is by category filtering. It would just require when posting the blog or real event to choose that category on the WordPress backend before posting.
    • Quick note: this is different than the filtering that you see on the current Real Events and Blog pages. This grid also has the option to add filtering to it, but I felt it was best to decide which layout we like best before I apply the filters. (Since you wanted to remove the filter on the blog page.)
  • For length conservation purposes on this example only, the below grids only include the latest 4 (or in one case, 8, so you can best visualize how it would look). We’re looking here and the functionality and presentation of the blog entries or real events entries. When it is implemented to the correct main pages, I will add functionality that loads more entries upon scroll. (Didn’t do it here because it prevented one from scrolling down this page and seeing the different layouts.) You can see an example of what it looks like by scrolling to the last layout on this page or on District Maven’s blog here.
  • We can adjust the number of posts in a column, the padding between them, the overlay color, etc. So far this program is pretty user friendly so if you have a customization question just ask.
  • The different types functionalities displayed below are called “skins.” There are several of them within this integration, which you can view here. (You must be logged in to view.) There are several more than what I have displayed below, but these are some examples I think would work well and that you would like. Please note:
    • The only types of grids that would display a description, date, etc. as we previously have on the blog are called “masonry grids” which will not automatically cut the photos to align perfectly across. Should we choose one of these, we would just have to make sure the cover images are all cropped to the correct dimensions to remain balanced.
    • There are different set of skins for grids/justified, which don’t offer as much introductory information as what I suggested for the blog pages. (Unless of course you’re looking to abandon that thought process, but wanted to show you a few options.) These are definitely more visual and eye-catching with less textual content, which I would definitely use on the Real Events main page, if not the blog page as well.