Compile Bootstrap with Less v2 and the autoprefix plugin

Since Bootstrap v3.2 the grunt autoprefixer plugin is part of Bootstrap’s build process. This autoprefixer postprocessor makes the prefix mixins (found in less/mixins/vendor-prefixes.less) deprecated. Less 2 introduced plugins for the Less compiler, see also http://lesscss.org/usage/#plugins. These plugins enables you to add your own postprocessors. Postprocessors change the compiled CSS code. An example can be found
Continue reading: Compile Bootstrap with Less v2 and the autoprefix plugin

Be prepared for Bootstrap v4

The upgrade from Twitter’s Bootstrap 2 to Bootstrap 3 was not painless. The current 3.2.0. release will give you some insights for the coming v4 release of Bootstrap. The 3.2.0. already adds some new things such as the responsive utility classes now have variants for diferents CSS display property values. The most important change till
Continue reading: Be prepared for Bootstrap v4

Bootstrap 3.2.0 and Shrinkwrap

When running npm install with the latest 3.2.0. release of Bootstrap I found the following error: Loading “Gruntfile.js” tasks…ERROR >> AssertionError: args.type is required Warning: Task “dist” not found. Use –force to continue. This issue can be solved by running the grunt update-shrinkwrap task just after npm install. With version 3.2.0. Booststrap switch to the
Continue reading: Bootstrap 3.2.0 and Shrinkwrap

WordPress: How to reverse the comment order with paged comments

In the settings panel of the WordPress Dashboard you will find the Discussion Settings. These settings enable you to create paged comments. You can set the top level comments per page, if you want to show the first or last page by default and if the oldest or newest comments should be shown on the
Continue reading: WordPress: How to reverse the comment order with paged comments

A11Y Buttons

The JBST WordPress Theme meets WordPress.org’s Accessibility Guidelines. I think accessibility support is important. Recently i got a e-mail from Nick, Co-founder of HKC radio. Nick told me JBST default navbar buttons don’t have a label or title. The login button has a title when logged in, but when not logged in the button only
Continue reading: A11Y Buttons

Brand Your New WordPress Website in 10 Minutes

If you need a WordPress Website quick (or you are lazy) and you already have a house style or at least a logo, than this tutorial is all you need to brand your WordPress website. If you don’t have a logo yet, you can order one at Jamedo Logo or simply use a picture that
Continue reading: Brand Your New WordPress Website in 10 Minutes

Send an invoice automatically with WooCommerce 2.x

The Question: “WooCommerce only sends invoice when triggered in the Dashboard. How to send these invoice automatically?”. Stackexchange.com WordPress Development does not allow WooCommerce questions any more. That is why i post the answer for this question here. Add an action to your woocommerce_order_status_completed_notification or woocommerce_order_status_pending_to_processing_notification in functions.php: function sendinvoice($orderid) { $email = new WC_Email_Customer_Invoice();
Continue reading: Send an invoice automatically with WooCommerce 2.x

WordPress theming, the comment_form() call, and the power of Less

When preparing the upload of the next version of JBST to wordpress.org I found the usage of comment_form(). The documentation of comment_form() can be found at Function Reference/comment form. The documentation of comment_form() doesn’t explain why you should have to use this comment_form() call instead of code your comment form’s HTML directly into your comments.php
Continue reading: WordPress theming, the comment_form() call, and the power of Less

Adding a background gradient to Bootstrap’s navbar with Less

When writing a book about Less and have to answer a question about adding a background gradient to JBST’s navbar the answer was found easy. Bootstrap’s navbar is styled with two CSS classes the .navbar class sets it’s structure while the .navbar-default or .navbar-inverse classes add colors and other styling. Bootstrap’s mixins contain also mixin
Continue reading: Adding a background gradient to Bootstrap’s navbar with Less

WordPress and PageSpeed Insights

Today i tested my WordPress Theme on Google’s PageSpeed Insights. The result was a little disapointing. The Desktop version scored above 90 out of 100, but the mobile version scored around 80. Based on Google’s suggestions i searched for some solutions. Eliminate render-blocking JavaScript and CSS in above-the-fold content Due to my own plugin Wp
Continue reading: WordPress and PageSpeed Insights