arcticsoftware/polarpress-pagebuilder
1
0
Fork 0
Code Issues Pull Requests Projects Wiki Activity

Update Architecture and structure of the page components (blocks)

Helge-Mikael Nordgård 2025-05-06 20:45:40 +02:00
parent f250bf26ce
commit 93b41f4cbc
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
Architecture-and-structure-of-the-page-components-%28blocks%29.md

@ -82,7 +82,18 @@ block.js (in `resources/js/Utils`) contains all the component block categories,
* **uuid** *required* The uuid field is required for all block components, it contains an unique identifier for that block *instance* when it is dragged to the canvas * **uuid** *required* The uuid field is required for all block components, it contains an unique identifier for that block *instance* when it is dragged to the canvas
* **componentName** *required* The componentName field is required for all block components. It tells the pagebuilder what vue file to look for when rendering the block on the page builder canvas, after it is dragged from the block selection. * **componentName** *required* The componentName field is required for all block components. It tells the pagebuilder what vue file to look for when rendering the block on the page builder canvas, after it is dragged from the block selection.
* **optionsComponentName** *required* The optionsComponentName field is required for all block components. It tells the pagebuilder what vue file to look for when rendering the input fields and forms when the user clicks the cogwheel to customize the block * **optionsComponentName** *optional (if static is true)* The optionsComponentName field is optional for block components that has a static value of true, required if the value is false. It tells the pagebuilder what vue file to look for when rendering the input fields and forms when the user clicks the cogwheel to customize the block
* **renderComponentName** *required* The renderComponentName field is required for all block components. It tells the pagebuilder what vue file to look for when rendering the component on a page when it is finished. * **renderComponentName** *required* The renderComponentName field is required for all block components. It tells the pagebuilder what vue file to look for when rendering the component on a page when it is finished.
* **description** *required* The description is the title of the block that appears in the block selector on the pagebuilder * **description** *required* The description is the title of the block that appears in the block selector on the pagebuilder
* **thumbUrl** *required* The thumbUrl field is the relative path of the visual preview image in the block selector, giving the user a visual preview of the block * **thumbUrl** *required* The thumbUrl field is the relative path of the visual preview image in the block selector, giving the user a visual preview of the block
* **static** *required* The static value tells the pagebuilder if the block component has any option form fields (coghwheel disabled or enabled)
* **title** *optional* This is just a data field that holds a string for the title value for the component
* **showtitle** *optional* This is another data field that the user can turn off or on using a checkmark in optionsComponentName, that will show or hide the title text
* **label** *optional* A string representation that shows a label text (typically right before or after the title)
* **showlabel** *optional* another boolean value the user interacts with through a checkmark
* **image** *optional* A string file path to the default image. In this case, the image is used as a background image covering the whole component block. It is a good idea to have a default image outside of the main storage that is always accessible.
* **buttontext** *optional* A string value that shows a button text value. In this case a link that directs the user to an overview of all the news articles on the site
#### needs field
This is a somewhat exceptional field that deserves its own section to describe properly. While all the field names so far is encapsulated and operates just within this component, the needs field is a special field. It lets the component *"hook"* into