I AM LISTENING TO
|

WHAT I LIKE

Using Web RTC in your web application How to include webfonts cross browser
Design     Development     Visual Composer     WordPress    

WordPress, WPLMS, Visual Composer and full width content



30. October 2014

wplms

I am working on a new website for a customer and we are using the WPLMS (WordPress Learning Management System) as a foundation. The packaged theme is based on Bootstrap.

The theme provides its own page-builder, but we prefer to use Visual Composer, as we built some custom VC-Addons to ease future page updates for our customer and custom content integration. Visual Composer provides some nice full-width addons, which are not working with the current theme layout. I decided to use a custom page template to allow Visual Composer to take over, where needed 🙂

ADDING A NEW PAGE TEMPLATE

New page template: page-vc-template.php

Copy this to your WPLMS theme directory and select the template on page setup. I added an inner wrapper for the content to allow some options for media queries and for the footer, to kill any top margin.

MORE TWEAKS

You can even tweak this by adding a custom field. Allowing you to do some nice css switching 🙂 and allowing you to go past the max width for the inner content.

wplms_custom_field

 

ADDING SOME STYLE

Here some styles to enable the media queries again. Just add those to your main style.css or the  Visual Composer style popup, on the page you are editing.

The first style pushes the content down, so that its not hidden below the transparent header. Still tweaking this, but works nicely so far. This also allows me to use other full-width addons again, like Vc_Row Background Pro 🙂

ROUGH EXAMPLE 🙂

wplms_background_width

Cheers and enjoy
Alex

RELATED LINKS




Leave a Reply

Be the First to Comment!

Notify of
avatar
wpDiscuz