How to properly separate layout and content?

#1

I am unsure on how to best approach the following:

I would like to create my layout templates with slim, but create the content in (github flavored) markdown, utilizing markdowns ability to format links, include images and code blocks.

How can I ensure that I end up with a proper separation of concerns, i.e. limiting slim to only its templating role and using markdown to format the sites text content?

#2

Come on. 15 views. Someone must be able to help here.
My question can’t be that difficult…

#3

Well, the question seems to be philosophical :slight_smile: that’s why it’s difficult (or too easy) to answer. Just make a page template in Slim/ERB/whatever suits your mood, packing all the automation there (inserting proper title/descr. tags, OGP tags (if you use), inserting partials based on frontmatter’s options, etc. Then the real content of your site would be put in pages created in Markdown. This seems to be simple and obvious, maybe that’s why nobody cared to answer. The problem would be if your pages need more complicated content, with many varying partials, divs to format content, using graphical grid, etc. Markdown is not well suited for this.
If you want more elaborate answer, you need to provide us more information – what kind of content are you going to use (mainly textual with illustration or more graphical with varying design using HTML markup to position content) and what presentation (simple pages or maybe grids and all bells and whistles).

#4

This is where testing your setup would work. Throw together a basic slim layout and create a “blog” page with your markdown content and see what it produces. :wink:

#5

Thank you @komor72 and @dikaio for trying to help!

So how did I approach my first project, which is a single page site?

I have a layout.slim template which contains all the markup common to all pages, including the partials _header.slim and _footer.slim, e.g.:

doctype html
head
...
body
  .container
    =partial "partials/header"
    =yield
    =partial "partials/footer"

Then, and here I have most likely made things too complicated, I have an index.slim which contains the main layout css classes, which control the grid (susy), headline and text formatting, e.g.:

article.l-content
  section.l-cnt-grid
    h2.beta Headline
    =partial 'partials/intro'

  section.l-right-grid
    h2.beta Headline2
    p 
      | some shorter text

    div.l-infobox 
      p.textbox
        |  some other text
....

As you can see, I have some text paragraph directly inside the slim template - this is mainly since I did not find a way to apply specific css rules to those elements, while some content is contained inside markdown partials, e.g. partials/intro.

So, maybe I should rephrase my question a bit:

How could I move all text content into markdown files, while still retaining the possibility for advanced formatting through css?

This might be really easy and obvious, but I simply don’t see the solution to that problem.

#6

I’ve always been pragmatic to this. All those DRY rules, content/presentation separation rules – all of this is to help, not to distract you from your work. I mean, I use all those rules only when they help. Which is most of the time, but not always.
Your case seems (to me) to be the case, when there is no practical good to separate content from presentation. Maintaining separate .md files for all those boxes (included with partials in Slim) is impractical to me. On the other hand trying to reproduce the DIVs in the Markdown is difficult, if possible. I would stick with the Slim file as presented above and move on.