Stay safe at home - 40% OFF on all plans using promo code at signup: STAYATHOME

Which Themes should I use with LiveCanvas?

Many page builders can run out of the box on any given WordPress Theme.

From a technical point of view, this is very easy to achieve – as simply the page builder plugin will typically load it’s CSS library ON TOP of your Theme’s CSS – another source of bloat, duplication, disorder, and poor performance.

LiveCanvas has a different approach, for the sake of DRYness.

The LiveCanvas plugin assumes you are using a theme which is based on Bootstrap 4 – and does NOT load ANY extra CSS or JS file.

So bloat is minimized – but there’s another interesting related fact.

If for some reason you want to switch off the page builder plugin, the site will still be there with LiveCanvas.

Not with any other page builder out there.

Recommended alternatives

These are the  recommended themes that we suggest for having a powerful yet lightweight core:

1. UnderStrap

UnderStrap is a very solid and efficient open source WordPress starter Theme based on Bootstrap 4.

It’s the GitHub project that received most positive votes from worldwide developers in his league: WordPress and Bootstrap 4.

It’s Woocommerce-compatible, SASS command-line friendly, and includes a very basic and unopinionated styling – so you can “bend” it easily adding your own code if you want.

It lacks customization options, and it’s quite “geek” oriented – that’s why we created a child theme to add some sugar to it, CustomStrap.

 

2. CustomStrap [** BEST CHOICE **]

CustomStrap is our own Theme, and it comes as an UnderStrap child theme.

It’s free and open source as well. And it rocks.

While adding NO BLOAT to your pages (in fact removing some), it allows to customize the Bootstrap colors and variables without using the command line tools – thanks to its built-in SCSS compiler, directly via the WordPress Theme Customizer.

It adds some really nice options to UnderStrap – plus adding compatibility with the Custom Header & Custom Footer feature of LiveCanvas.

It does all this while keeping things lean and clean.

You can use it like it is or use it as a starter theme to build your perfect site with LiveCanvas.

 

3. Your own 100% custom theme

If you want to run LiveCanvas with your own custom WordPress Theme, you’re absolutely welcome to do it.

There are very few steps required:

  1. [mandatory] Your Theme must include the Bootstrap 4.xx min.CSS file – this should sound obvious.
  2. [recommended] Your Theme must include the Bootstrap 4.xx JS files – if you need to have BS elements that need js support like carousels.
  3. [mandatory] Your Theme must have an “empty.php” empty page template called “empty” – this template should only call header and footer and the loop. No strange things. Should take a second to do, butchering your own page.php for example. Here is a sample code:
     
    <?php
    
    /* Template Name: Empty */
    
    defined( 'ABSPATH' ) || exit;
    
    get_header();
    
    while ( have_posts() ) :
    the_post();
    the_content();
    endwhile;
    
    get_footer();
      
  4. [mandatory] The file above shall be placed in a directory of your theme called “page-templates” (so, mimicking the UnderStrap structure, eventual theme switches will be flawless without hacks)
  5. [not more necessary as from LC 1.6 now uses inline SVG icons] Your Theme must include FontAwesome 4.7 
  6. [mandatory] Your Theme must include the following line in the functions.php file to get rid of the annoying dialog recommending UnderStrap:
 function lc_theme_is_livecanvas_friendly(){} 

As you see it’s really easy to make your theme work with LiveCanvas.

If you are a theme developer and feel like dropping a question, get in touch. We like having educated email chats with theme developers.

4. picoStrap: a micro starter theme meant for your hands

PicoStrap is a  LiveCanvas-friendly minimal Bootstrap starter theme example – still in the making.

On another side

Upon first launch, the LiveCanvas plugin will check if one of the themes above is used, and show a message if this is not the case.