GitHub Gists

Find useful WordPress related code snippets in our new GitHub Gists repo:

https://gist.github.com/them-es

#development, #tip

Goodbye Grunt…

Important notice: The Grunt config in our Starter Themes got replaced by gulp + webpack in the latest releases.

Gulp is quite similar to Grunt and allows to automate tasks like SASS > CSS compilation.

Webpack makes bundling of (Javascript) modules a breeze. The main advantage of bundling modules into a single file is that static assets get a smaller file size.

Including and bundling new Javascript modules is really easy and works out-of-the-box with the given configuration. A tutorial which explains how to include webpack modules to main.js can be found here: https://webpack.js.org/concepts/modules

Material Design Components v3 and v3.1 released

https://github.com/material-components/material-components-web

The Material Design Starter Theme has been updated to work with this release. Only a minor code change had to be made to the fixed mdc-top-app-bar.

#material-design

Bootstrap receives a Long Term Support Plan

Each major version of Bootstrap will receive at least six months of support after it is retired, followed by six months of critical bug fixes and security updates.

This official announcement from the Bootstrap team is important as website maintenance and update planning will be more projectable for developers.

https://blog.getbootstrap.com/2019/07/24/lts-plan

According to this blog post, Bootstrap v3 will not receive security updates anymore and that’s why the Bootstrap 3 download option has been marked as deprecated and will be removed shortly. Once Bootstrap v5 is published, this new version will become our default Starter Theme and Bootstrap v4 will become an optional download.

#bootstrap, #lts, #support

Goodbye jQuery…

We’ve removed jQuery as a frontend dependency from our Starter Themes.
Please note that jQuery is still needed in the WordPress dashboard (backend) and will be loaded there automatically!

jQuery has been very useful for a while but modern web standards browser support has improved a lot and most JS frameworks started to drop any external dependencies in favor of plain/vanilla JS.

Reducing the loading time of web applications and minimizing HTTP requests is one of the main goals of many developers. And since jQuery is an external library which needs to be downloaded first, avoiding it (if possible) makes a lot of sense.

If your code still depends on jQuery you can activate it in functions.php by adding array( 'jquery' ) in the wp_enqueue_script function where main.js is referenced (See: https://github.com/them-es/themes-starter-bootstrap/blob/v2/functions.php#L480).

Further reading:
https://developer.wordpress.org/reference/functions/wp_enqueue_script
http://youmightnotneedjquery.com
https://medium.com/@trombino.marco/you-might-not-need-jquery-a-2018-performance-case-study-aa6531d0b0c3
https://developer.mozilla.org/en-US/docs/Web/JavaScript

#jquery, #js, #vanillajs

#development, #tip

React WP-API boilerplate

Our latest boilerplate has been published on Github. This is a great starting point for developers who need to create a headless WordPress Single Page Application.

WP-API ReactJS Boilerplate

Please note that you need to have a deeper knowledge of WordPress, NPM, Javascript/ReactJS and Bootstrap in order to be able to use this boilerplate.

Go to the GitHub repository, download the boilerplate and follow the instructions.

The Source Code is licensed under GPLv2 and has been published on GitHub.

A simple setup tutorial can be found in the Readme of the repository.

#boilerplate, #development, #headless-cms, #reactjs, #wp-api

Material Components for the web…

Material Components for the web 2.0 has been released recently with new features and bugfixes. The WordPress Material Starter Theme has been tested with the latest version 2.2 and the code base got updated.

Feel free to use it for your next project!

#material-design, #theme

WordPress “Gutenberg” blocks boilerplate

The code base we are using to develop custom Gutenberg blocks has been made available to the public.

Blocks Boilerplate

If you are a WordPress Developer you can use this boilerplate as a basis for creating and integrating blocks in a theme.

Go to the GitHub repository, download the boilerplate and follow the instructions.

The Source Code is licensed under GPLv2 and has been published on GitHub.

#gutenberg, #blocks, #theme

#boilerplate, #development

Material Components for the web…

Material Components for the web (MDC Web) is the successor to the Material Design Lite (MDL) project and the Material Design Starter Theme has been rewritten to use the new Material Components.

Heads up. The Theme had to be rewritten completely. If you need to update an older MDL codebase, please follow this migration tutorial provided by Google: Migration from MDL

Changelog

  • Bower is now deprecated and the package management has been replaced by npm
  • Material Design Components instead of Material Design Lite
  • Minor WordPress Coding improvements
  • Tested with WordPress v4.9+

Download the Theme

Feel free to test out the new Starter Theme by downloading it using the Theme Generator:

Material Design Starter Theme for WordPress.

#material-design, #npm, #sass

Bootstrap 4.2 and Bootstrap 3.4 released

Bootstrap 4.2 has been released yesterday with new features and bugfixes. Our WordPress Bootstrap Starter Theme v2.0 is fully compatible with this minor update.

Furthermore an update for Bootstrap 3 has been shipped with important bugfixes.

Happy holidays!

#bootstrap