Picostrap V2 Docs

Learn how picostrap works and how to make the most out of it
Please note that the videos below are also accessible via direct links
from within the WordPress Customizer.

Visit our official YouTube channel

1. Introduction to picostrap: the fastest Boostrap starter theme

A brief introduction to the picostrap theme. Get to know all the basics in 3 minutes.

2. Customizing Bootstrap easily with the WordPress Customizer

Quickly customize the Bootstrap CSS to match your visual language, directly using the WordPress Customizer.

0:00 - Intro

0:47 - Quick overview on Page Templates in picostrap

1:03 - Customize Bootstrap Colors

1:26 - Typography

2:29 - Global options (rounded, shadow, gradients etc...)

2:49 - Buttons Customization

3. The child theme folder structure: adding your SASS

Learn how to add your own SCSS / CSS / JS code properly.

0:00 - Intro

0:27 - Download the picostrap WordPress Bootstrap 5 child theme

0:39 - Show the SASS directory in the child theme folder

0:58 - main.scss

1:22 - Quick overview on referenced files loaded by the main.scss

1:32 - _theme_variables.scss

2:05 - The Bootstrap 5 files and folder

2:25 - _wp_basic_styles.scss

2:42 - _picostrap.scss

2:57 - _woocommerce.scss.scss

3:13 - _debug-structure-helper.scss

3:25 - _custom.scss

3:57 - The compiler output. bundle.css

4:55 - Adding custom JS code

3.1 Navigation, optional topbar,  Menu tips and tricks

Main Navigation bar, Optional Topbar and Menus.

0:00 - Intro

0:26 - Main Navigation bar

3:45 - Optional Topbar

5:25 - Menus

3.2 Footer, Widgets, Homepage Settings

Diving more into the Customizer settings of the Theme, discover how to tweak the footer to your taste.

0:00 - Intro

0:26 - Footer

2:05 - Widgets

3:23 - Homepage Settings


3.3 Single & Archive Options, Header/ Footer code, Global Utilities

0:00 Single and Archive options (Hide categories, Post author, and post date)Get to know the Theme options of the picostrap theme, the Bootstrap 5 starter theme for WordPress, and see how to load Multiple Font Weights, and to load Google Fonts anonymously, for GDPR compliance.
Or use additional goodies such as the built-in lightbox.

0:00 Single and Archive options (Hide categories, Post author, and post date)

1:00 Enable sharing buttons

1:40 Header and Footer Code

2:21 Add Google Tag Manager code to your site

3:18 Font Loading Header Code

4:49 Load Google Fonts anonymously (GDPR)

5:43 Manage multiple font weights

6:51 Global Utilities

7:08 Disable Gutenberg

7:26 Disable the Block-based Widgets Editor

7:41 Disable the WordPress comments system and the XML - RPC.

8:03 Disable the SCSS automatic compiling, and the Livereload feature

9:03 Add back-to-top button to your site

9:15 Enable a lightbox for viewing gallery or linked images 

4. The Theme Dashboard

Reset, Import or export your Theme settings.

00:00 Intro

00:35 Manually force the CSS Bundle to be rebuilt

00:54 Reset the theme options to default values

01:25 Export a JSON file with all the current Customizer settings

01:42 Re-Import the Customizer settings