Tag underscores

Underscores is a great framework for building WordPress themes. Since the HTML markup can be a little confusing at start, I have made a simple go-to explanation for future projects. The markup might change in the future, but the basic markup has stayed the same for the last years. This markup is from April 2018. Here is a visual illustration of the markup: Here is the same markup in code: So what is going on here? Let’s break it down a little… The body contains the #page DIV which acts as a container for the whole shebang. Inside the #page the site is divided into three parts: .site-header, .site-content and .site-footer. .site-content is basically everything that goes between the header and the footer. In other words; the content. Inside the .site-content DIV we have #primary and #secondary, which are basically just a way of separating the widgets section from the main content. Inside #primary we have another div called #main. I am not completely sure why we have this div yet, but it might function as a way to add padding, margin or max-width to a centered content. Inside #main we get the single post/artigle/page, the post-navigation (previous/next post) and the comments area each in their respectiv divs.