
registerInputField(field_name, field_definition)įield_name This argument receives a unique field name that is typically proceeded with a plugin-specific prefix.įield_definition This argument receives a function that returns an object containing the key:value pairs normally found in a component field.In this example that will result in the reservation of 4 control slots, one for each item in the pge_breakpoints_array. For each of the items it will prefix with pge_sizes_ and then pass that unique field name to the registerInputField function. The anonymous function passed to onDefine will loop over an array named pge_breakpoints_array. In this example, we are creating a control that will allow the user to select the element width from a set of responsive widths ( pge_responsive_widths)for four hypothetical breakpoints ( pge_breakpoints_array). This HTML string can contain inline styling and classes. This key takes an HTML string of function that returns an HTML string as value and should be provided as the third key in an individual option object within an option array. Reguires the use of the html key in the option list. This key takes a boolean value and if set to true it converts the dropdown list to side-by-side buttons. At a more advanced level the Pinegrow API a series of keys and helper functions for novel layouts.Īs briefly mentioned in the documentation of the select type, this key works along with the html key.
#Pinegrow 4 add style plus#
At a basic level, Pinegrow provides two methods to create controls with a custom look - the toggle_buttons key plus html key with or without the PgToggleButtonMaker() constructor. One example of this would be a set of side-by-side dropdown menus to set column numbers for each breakpoint. They also allow for the construction of more complex controls.


Custom controls allow for a more customized appearance for a plugin.
