February 9, 2018
node.js & npm. Install node.js locally using the pkg. The npm package manager is installed as part of that. We then use npm to install ESLint globally (
sudo npm install -g eslint).
eslint --init from the root directory of any project where you want to use ESLint to validate the code. That will create a project specific configuration file.
February 7, 2018
#PHP #WordPress #WP_Query
WP_Query is typically much safer than using SQL directly in a WordPress environment. But probably less intuitive. I always have to look up what the various arguments actually represent. So this post is to remind me of the basic syntax and structure.
In the first example, from a recent project, we are returning all products which are watches – where
client_product is a
Custom Post Type. In the second, within a
Switch, we are returning a specific selection (from a dropdown).
Remember to call
Google Maps: from XML with Marker Clustering
January 2, 2018
This is something I was working on recently. We wanted to use Google Maps to show the location of the client’s many distributors and agents. And we wanted to implement
marker clustering. You can use the
I have defined the markers as XML elements with properties defined as attributes. Apart from latitude and longitude – the other properties define how I have chosen to implement the
Info Windows – what a user sees when they click on a marker. In this example simply the business name, address and telephone number. But an Info Window can potentially provide much more detailed or layered information. Obviously in a real implementation of this example the name and address info would be different for each marker:
... <marker name="Business Name" address="Street Address Line 1, Street Addresss Line 2, City, Country, Code" tel="+XX 123 456 7890" lat="-36.7624557" lng="144.2874504" /><marker name="Business Name" address="Street Address Line 1, Street Addresss Line 2, City, Country, Code" tel="+XX 123 456 7890" lat="51.555386" lng="5.082930000000033" /><marker name="Business Name" address="Street Address Line 1, Street Addresss Line 2, City, Country, Code" tel="+XX 123 456 7890" lat="51.2164861" lng="4.4046062" /> ...
I am using the browser’s
HTML5 Geolocation feature to attempt to locate the user on the map. That’s going to be confusing if your corporate network is routed through another jurisdiction. The user will be asked to allow the site to use their position. NB: Browsers including Chrome no longer support obtaining the user’s location using the HTML5 Geolocation API from pages delivered by non-secure connections. This means that the page making the Geolocation API call must be served from a secure context – eg HTTPS.
In this example I have implemented the map using the
WordPress Shortcode API. We can simply add
[insertSulbyMap] to the page or post where we want it. But it could equally be contained as a plugin or coded into a PHP template (which is how I did it in the version we built for the client).
The takeaway from this, for me, was that it was simple to code my own implementation using the Google documentation. Better than being an additional third party dependency by using a commercial plugin. Google already make it easy.
WordPress Customised Data Entry Interface – PT3
December 20, 2017
The Custom Taxonomy
[ Product Line ] is itself an entity and has 2 additional fields – for a PDF and an image to be attached – ie in the case where a single PDF and image is applicable to all products in a particular line.
WordPress has hooks to achieve this. In each case we use
edited_product_line. Not forgetting to santitize the input before writing it to the database.