Let’s get started breaking up the page into parts. Looking at the code we transferred from Directive's “index.html”, we have three
<div> elements with
ids indicating that they are unique,
Since the styling of these sections constitutes the main layout of the Directive theme, we keep these as the three sections of our page. Using several of the built-in widgets, we will show how to build up a page to match the original design of Directive. Finally, we will set up a couple of new widgets to handle the content on the the page. Ready? Buckle up, here we go....