Home Customization Individual Page Restyling

With JEZ Rego, you can create individual styling for entire page, not just the component output, using Page Class Suffix defined for associated menu item.

Please follow links in the left column to see demo.

As you can see, all menu items in the left pointing to just same page but applying difference Page Class Suffix. For each Page Class Suffix applied, the entire page layout is changed.

To create individual styling for each Page Class Suffix, all you need to do is prefixing CSS selector(s) with body.individual-page-class-suffix . See example stylesheet below for details:

/* 2 equal width columns layout */
body.two-equal-width .gr2 #jezMain {
	margin-left: 486px;
	width: 448px;
}
body.two-equal-width .gr2 #jezLocal {
	width: 448px;
}

/* swap position of 2 columns layout */
body.swap-position .gr2 #jezMain {
	margin-left: 26px;
}
body.swap-position .gr2 #jezLocal {
	float: right;
	margin-right: 30px;
}