Site HTML Code Layout Organization
Site HTML Organization
The above list of areas gave a general outline of how Weaver Xtreme organizes the HTML of a site. It can be useful to have a more specific and technical understanding of site layout.
For more advanced customization of your site, learning how how the various parts of the site are
organized can be essential. Not surprisingly, Weaver Xtreme relies heavily on
the basics of HTML <div>s and the “Cascading” part of CSS. The following diagram illustrates the cascading nesting
of the Weaver Xtreme design.
body
#wrapper
– wraps entire site – no content
– wraps entire site – no content
#header –
header image, header widget area, HTML insertion
header image, header widget area, HTML insertion
.menu-primary
– primary menu
– primary menu
#container
– wraps infobar, content and main sidebars
– wraps infobar, content and main sidebars
#infobar
– breadcrumbs, other info
– breadcrumbs, other info
#content
– the main content – posts and pages
– the main content – posts and pages
#primary-widget-area
widgets
widgets
6 different layouts
#secondary-widget-area
widgets
widgets
#colophon
– footer widget area, HTML insertion, copyright line
– footer widget area, HTML insertion, copyright line