fbpx
CustomStrap

A superlean child theme for UnderStrap
with a built-in SCSS compiler

Currently v2.7 - changelog download

November 2020 update:

Something new is coming

While CustomStrap is perfectly fine to use today, 

we have a newer starter theme available: picostrap.

It's similar, but quite a bit faster.

Warning: 

Compared to CustomStrap, picostrap drops the FontAwesome icon font, jQuery and some JS, the customized WooCommerce templates...it's more "barebones".  And very young.

Use when appropriate!

The Understrap child theme

The best way to experience Bootstrap 4 on WordPress.  

Understrap is the top rated Bootstrap 4-based WordPress Starter Theme on GitHub.
While being a great tool for developers, it totally lacks customization options

It assumes you will install SASS on your development machine to tweak Bootstrap to your likings, eg. to change fonts and colors. 

If you are not familiar with command line tools, or just want to do tweak BootStrap more easily, directly from the WordPress customizer, CustomStrap is the answer.

Watch the video

The power of SASS, 
merged with the 
WordPress Customizer.

Instantly Customize Colors on the fly

 Instantly set colors for the Bootstrap Color variables like Primary, Secondary, and style items like Menu Bar Background / Links / Hover Links. No inline styling is added.

Built-in PHP SCSS compiler

No need to install command line tools. CustomStrap will rebuild your CSS bundle automatically, when you hit the Publish button in the WordPress Customizer, or when you change some file in the /sass folder!

Find beautiful Font Combinations

Easily change the font family used for main body text and headings, choosing from the full Google Fonts list. To get a quicker result, we have some ideal font couples suggested from FontPair. 

Set your own variables

If the Customizer settings are not enough for you, you can use the sass/_theme_variables-custom.scss file to customize each and every Bootstrap variable. Who said Bootstrap-based sites shall look all the same?

Add your own SCSS / CSS code

You can use the sass/_theme-custom.scss file to add your own styling. All will be automatically merged in your single, minified CSS file, for maximum site speed. You don't need any CSS minification / concatenation plugins.

Enable Responsive Typography

One of the most useful recent additions to Bootstrap is responsive typography. Just tick a box in the Customizer, hit the publish button and you're done! Fonts will smoothly grow bigger on larger screens, while staying acceptably sized on mobile devices.

Hide unnecessary template tags

Using WP for a showcase or single author site? If you want, you can hide author, post dates, prev/next links. No need to hack the single and the archive template anymore. Just a few clicks in the Customizer.

Disable Comments

If you're not using WordPress to build a blog, you may love CustomStrap's feature to optionally disable the whole WordPress comment system in one click. Say no to unnecessary spam.

Keeps your head clean

Removes tons of unnecessary tags from your site's <head>, like Emojis. And if you are using the Classic editor plugin to disable Gutenberg, the additional CSS for GT blocks is removed. See the cleanup.php file for details.

LightBox [OPT-IN]

No-bloat, optional gLightbox integration: showcase your posts' images and galleries with a mobile-friendly, elegant lightbox script. See demo here

Sharing Buttons [OPT-IN]

No bloat, optional, full HTML-based sharing buttons to share your single posts on Facebook, WhatsApp, Telegram and Twitter. No JavaScript added

TopBar [OPT-IN]

An optional topbar is useful for adding important information like contact details and links. You can customize it's HTML content directly from the Customizer

dog-colour

...and there's even more useful stuff in the Customizer...

  • Show / Hide Site tagline in Header
  • Edit Footer bottom text 
  • Set main navigation bar placement (top / fixed / bottom
  • Set main navigation color scheme
  • Add code to site header (useful to add Analytics without a plugin)
  • Add HTML to site footer 

Version History

The subheading text goes here. Explain whats going on in here.

2.7.0

16 July 2020
  • Responsive Icon Sizing Utility Classes

2.6.3

6 July 2020
  • Rearranged Customizer options (added "Global Options & Utilities" panel) 
  • Compiler is more tolerant to hosting environments with mismatched constants
  • Added a Maximize button to the CSS Editor in Customizer 
  • Added Customizer Option to disable automatic Google Font loading (can be useful for those who want to serve Google fonts locally) 
  •  Added Customizer option to remove FontAwesome

2.6.1

18 June 2020

  • Solved a potential JS customizer bug due to caching: added versioning parameter to customizer.js
  • Minor label copy fixes

2.6

13 June 2020


  • 3 brand new Customizer panels: TypographyComponentsButtons & Forms. Now exposing most of the significant BS4 variables, customizing your BootStrap CSS is easier.
  • This update is mostly about Typography:  You get fine control over your overall site text appearance.
  • A totally reimagined Font Picker experience showing both system and Google Fonts, categorized and easily searchable
  • A a new Google Font loading method for better performance following some best practices from this article 
  • RFS helper classes for responsive font sizing. See demo here
  • SCSSPHP library updated to latest version (1.1.1)
  • Compiler relative path fix
  • Can now work in tandem with style package plugins
  • Supports LiveCanvas 1.5’s custom header feature
  • "Back to Top" purely opt-in feature added to Customizer with a super lean implementation
  • Minor copy text tweaks in Customizer interface

2.51

  • Fixed file permissions
  • Security enhancement to prevent direct access to some files 

2.5

  • Added function to remove wp-embed.js https://kinsta.com/knowledgebase/disable-embeds-wordpress/#disable-embeds-code 
  • Footer template accepts now custom integration with LC or custom footer implementations
  • SASS compiler now gets original sass file via wp_remote_get API instead of file_get_contents
  • SVG logo CSS quick fix
  • Scroll correct with menu fix 

2.4

  • Added SASS folder watcher and auto-recompile
  • SASS error handling in Compiler with customized error messages

2.3

  • Opt-in single post sharing buttons
  • Gallery small fix 
  • Compiler URL fix for preliminary compatibility with Roots BedRock

2.1

  • Opt-in, no bloat LIGHTBOX: gLightbox integration: makes all links to images open a mobile friendly superlight Lightbox, gLightbox - works adding to the site 1 tiny css and one tiny js in the footer - so it’s not critically loaded - works seamlessly with wp galleries - 
  • TOPBAR - Header fix h1 title so font does not change when linked or not
  • Fix FontAwesome on multisite (font awesome not appearing) 
  • Determines assets path smartly