Sage 10 Body Class Addition
Often you need to add several classes to the body class besides the default classes. We can update the WordPress body class using a filter. In Roots Sage and most themes you have several ways to do this. You could add the filter, use __NAMES_SPACE__ magic constant and then add the function. The value of __NAMESPACE__ is […]
Sage 9 Load Google Fonts
To load Google web fonts asynchronously in Roots Sage you can use the Typekit Web Font Loader and Google fonts of your choice. It allows you to load fonts with ease and async. Web Font Loader The script below will load two fonts of my choice. It needs to be added to main.js and then […]
Convert Visual Composer Based WordPress Theme for speed
Each week we answer one or multiple Upwork job vacancy questions here on WP Villain. Here is Post I on a WordPress theme built with Visual Composer that has become slow and needs to be converted into a faster site with a better theme setup. We are currently running a WordPress theme that was heavily […]
Sage 9 Error: Failed because of a stylelint error.
If you get an error like $ webpack –progress –config resources/assets/build/webpack.config.js Error: Failed because of a stylelint error. at linter.then (/Users/jasper/code/alarsite/wp-content/themes/alar/node_modules/stylelint-webpack-plugin/lib/run-compilation.js:39:14) error Command failed with exit code 1. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. And you wonder what the issue is just run the following command yarn run lint:styles That will tell you […]
Sage 9 Beta 3 WooCommerce Setup
Since I wrote my last post on setting up WooCommerce in Sage 9 things have changed once again. Sage 9 beta 3 has adjusted its structure and looks even more like a Laravel app. And WooCommerce has also been adjusted and since WooCommerce 3.0 several patches have been added. So let’s discuss the Sage 9 Beta 3 […]
Bootstrap Navigation in Sage 9
If you are working with Bootstrap and like most Sage developers are brave enough to work with the Bootstrap 4 beta with all it’s goodies you will often want to add a Bootstrap menu. So how is a Bootstrap Navigation in Sage 9 done? Here is how. Sage 9 and Bootstrap When you install Sage 9 […]
Sage 9 WooCommerce Setup
To set up Sage 9 with WooCommerce things have to be done slightly different from the setup in Sage 8. This mainly as Sage 9 works with the Laravel Blade templating system. It is mostly the same though. Here is how the Sage 9 WooCommerce setup is done. Note Also see Sage 9 Beta 3 follow-up post Steps to […]
Advanced Custom Fields in Sage
Sometimes you need to work with custom fields for a theme. This as you work with a template that consists of many different content fields and that tend to need different layouts too. And sometimes you do not feel like doing it all from scratch because you are lazy, or because you simply have more […]
Sage Theme Sidebars – How to set sidebars up properly in Sage
Sage Theme Sidebars are WordPress sidebars set up DRY using the theme’s wrapper. Basically sidebars done the right way. You will need to add the code to register a new sidebar and add the code to the theme file where you want the sidebar to be loaded. Just like you would normally add a sidebar […]
Sage Theme Deployment
When you work on a Sage theme with Trellis for your server stack the final step tends to be the deployment of the theme itself. The Sage theme does get pulled onto the server using Trellis, but the dist folder isn’t. This folder dist is excluded. This is done using the .gitignore. This is done […]