Magento 2 Compile Less With Grunt

Let’s face it, frontend development on Magento 2 is extremely slow! It is a long winded process, each time you make a change to a Less file you have to clear cache and delete the pub/frontend directory to see any visible changes on the frontend. It isn’t a good workflow, it’s not workable. By using…

Continue Reading →

Magento 2 Create New Page Layout

Quick post on how to add a custom page layout within Magento 2. I find these are very useful for landing pages such as the home page, about page or promotional page where you need to have a completely bespoke layout. Setting up a new page layout will give you a base to work with…

Continue Reading →

PWA Install Prompt

Progressive web apps (PWA) are becoming increasingly popular and with the recent announcement that Chrome 73 now supports Desktop PWAs on all desktop platforms let’s see how we can make our users aware of this feature. Today I’m going to show you how to prompt the user to install your PWA or give them the…

Continue Reading →

Magento 2 Add Library JavaScript File

Quick post to show you how to add in a third-party library via RequireJS. In this example I will be using the popular carousel library Slick Slider. Configuring RequireJS First add your third-party library file to your theme directory, app/design/frontend/<VendorName>/<ThemeName>/js/vendor/slick.min.js Next we need to configure our RequireJS. If you haven’t already got a configuration file…

Continue Reading →

Magento 2: Calling and Initializing JavaScript

In the last post I showed you how to add a JavaScript file globally across your Magento 2 store. Today I’ll show you two more methods of loading, imperative and declarative. These methods allow you to only load the relevant JavaScript when required, as apposed to one global JavaScript file. Imperative notation The simplest method…

Continue Reading →

Magento 2 Add Global JS File Through RequireJS

Adding in a JavaScript library to Magento 2 is very different to how you might be used to doing things from Magento 1. Magento 2 uses the RequireJS library for nearly every JavaScript feature it has. Today I’m going to show you the most basic example of how to utilise this library by adding a…

Continue Reading →

Magento 2 Create New Theme

A quick post to show you how to create a new theme in Magento 2. Perfect when getting started with Magento 2. This post assumes you have an installation already setup and your looking to make your own customisations. Step 1: Folder structure Create a new directory for your theme: app/design/frontend/<VendorName>/<ThemeName> As a best practice…

Continue Reading →

Git Hooks To Automate Deployment

Deploying your git repository into production can be made a lot easier by using Git hooks. In this article I’ll be showing you how to use the post-receive hook to deploy your repository into your production environment. It will only deploy your master branch, which should be your stable code. If you attempt to push…

Continue Reading →

Installing Magento 2

The new and improved Magento 2 platform has been released but installing it can be tricky the first time round. The installation process has changed since the last versions and it takes a bit of time to get it up and running. I’ll be showing you how to install it locally while detailing any errors…

Continue Reading →

Mac OS X 10.11 El Capitan Localhost Setup

There are multiple methods and tools for developing web applications locally, I’ve always been a big fan of MAMP Pro due to it’s simplicity and it’s UI, it’s pleasant to use, very easy to setup and you’ll get running in no time. It does however have it’s downfalls and with OS X 10.11 now coming…

Continue Reading →