Design Styl­es

Full Width or Boxed Layouts

Vel­lum offers two pri­ma­ry lay­out styl­es, boxed and full width. The full width style stret­ches from edge to edge while the boxed style crea­tes a nice clean “page” look with a subt­le shadow. In the boxed style you may add cus­tom back­ground colors and images to the page body. Back­ground images can be set to full width, fil­ling the brow­ser and remai­ning sta­tic when scrolling.

Sel­ec­ting a Lay­out Style

The lay­out style can be set in the default the­me opti­ons for your enti­re site by choo­sing “Boxed” as the Lay­out Style under the Design Set­tings area.

Each lay­out crea­ted in the Lay­out Mana­ger pro­vi­des an opti­on to over­ri­de the default lay­out style with a cus­tom set­ting. This method will let you indi­vi­du­al­ly set enti­re sec­tions or just a sin­gle page to an alter­na­te lay­out style. A useful appli­ca­ti­on for this would be having a boxed lay­out for your port­fo­lio or blog to spe­ci­fy cus­tom back­ground images as an added accent or for­cing only the home page to full width high­light­ing the slide show.

To app­ly a cus­tom lay­out style for an indi­vi­du­al page, post or area you can edit the lay­out spe­ci­fic to that loca­ti­on and set the “Lay­out Style” opti­on in the right set­tings column. You can crea­te a new lay­out spe­ci­fic to this style. You can assign lay­outs from the Lay­out Mana­ger or an indi­vi­du­al page/post.

A lot is pos­si­ble using cus­tom lay­outs bey­ond just set­ting a lay­out style. Once you start expe­ri­men­ting with the com­bi­na­ti­ons of dif­fe­rent styl­es and opti­ons you’ll see the power of the Lay­out Manager.

Docked Top Banner

The top ban­ner with your logo and menu can optio­nal­ly be docked to scroll with the page. When the opti­on to dock the top ban­ner is enab­led it will auto­ma­ti­cal­ly appear at the top of the screen once you scroll below the hea­der sec­tion of the page.

The top ban­ner will redu­ce the size of your logo auto­ma­ti­cal­ly. The menus you have sill still func­tion nor­mal­ly. Mega menu and stan­dard drop down menus will show exact­ly as they do in the stan­dard hea­der. The docked top ban­ner opti­on can be enab­led or dis­ab­led optio­nal­ly based on your preference.