Clean blog (A Source Plus project)
| 16 Jun 2023
We have released a brand new Source Plus project demonstrating a 'clean' blog layout using Poster 2. There are a couple of additional features that have been added to make this particular project even more special! Read on for more info...
The blog list layout
The main blog list is set to be nice and simple with a solid border at the top of each item along with a subtle drop shadow. The amount of columns shown ranges from 1 to 3 depending on the width of the device.
The blog detail layout
The detail page is where things begin to get a bit more interesting. The heading section repeats the same information from the blog list view but this time splits things out into 2 columns for a striking look. No page / blog header are present resulting in a really clean look for the article.
The main blog content is set to show in a narrower container that is an optimised width for reading articles and is punctuated by images that have been set up (with a little custom css) to expand beyond that width slightly, giving a simple yet interesting feel to the layout.
Auto-generated text for buttons!
A final flourish, that uses a custom code snippet, is to dynamically generate the titles for the Previous and Next post buttons! This is a great way to give the reader a good idea about the content of adjacent posts. This section of the project could be dropped into any other Poster project to achieve the same result.
Fun fact: We are now using this great trick on this Source blog too!! See below.
Conclusion
Clean blog offers you a great pre-built solution for a blog on your website which can be populated with posts created in Stacks and/or via Markdown formatted files held on your server.
What is 'Source Plus'?
Our Source Plus projects showcase the use of various best-in-class third party stacks inside a Source-built project. Source was designed to provide you with a small batch of powerful tools to enable you to build complete web sites. There are times though when you will need/want to add additional functionality to a page - be that a blog, a slider, a gallery, a chart, a quiz etc. The Stacks marketplace is where you will find these additional stacks. The beauty of building sites this way is that dedicated stacks to achieve these things are far better and more flexible than any in-built version of them that a full framework might offer.
Like this post?
Why not share with others that might like it too?!