Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save interplaydesign/bafae848db5e2e3521ec3a1be228704c to your computer and use it in GitHub Desktop.

Select an option

Save interplaydesign/bafae848db5e2e3521ec3a1be228704c to your computer and use it in GitHub Desktop.
Block Customization Plugin 2 js/core-block-customizations-public.js
/**
* This is in the js folder in our plugin folder.
* This looks for our custom class that is added as a style option
* In this case that is .is-style-add-custom-element
*/
( function() {
var vectorOne = document.createElementNS("http://www.w3.org/2000/svg", "svg");
vectorOne.classList.add( 'vector-one' );
vectorOne.setAttribute("height", "100");
vectorOne.setAttribute("width", "500" );
vectorOne.setAttribute("version", "1.1");
vectorOne.setAttribute("viewBox", "0 0 512 512");
var shapeOne = document.createElementNS("http://www.w3.org/2000/svg", "path");
shapeOne.setAttribute("d", "M186.4 142.4c0 19-15.3 34.5-34.2 34.5 -18.9 0-34.2-15.4-34.2-34.5 0-19 15.3-34.5 34.2-34.5C171.1 107.9 186.4 123.4 186.4 142.4zM181.4 201.3h-57.8V388.1h57.8V201.3zM273.8 201.3h-55.4V388.1h55.4c0 0 0-69.3 0-98 0-26.3 12.1-41.9 35.2-41.9 21.3 0 31.5 15 31.5 41.9 0 26.9 0 98 0 98h57.5c0 0 0-68.2 0-118.3 0-50-28.3-74.2-68-74.2 -39.6 0-56.3 30.9-56.3 30.9v-25.2H273.8z" );
shapeOne.setAttribute("fill", "orange" );
vectorOne.appendChild(shapeOne);
/**
* Required to load when elements are preset
*/
window.onload = function(){
var targetElement = document.querySelector( '.is-style-add-custom-element' );
console.log( targetElement );
targetElement.appendChild( vectorOne );
}
}());
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment