Create a custom block in Purple Hub
Purple Hub
The document provides step-by-step instructions for creating a custom block on Purple Hub, adjusting alignment and adding a new field group on ACF, creating a new field in a form, and creating a custom block in WordPress. Screenshots and visual references are included throughout the guide. Once the block is created, it can be added to article content.
- Have an Admin Role in Purple Hub
1. Go to your Purple Hub and click on 'Custom Block Types'
2. Click on 'Add Row'
3. In the newly added row, in the column 'Unique name identifier' enter a name for your block e.g. "test-quote"
4. In the column 'Title' enter a title for your block e.g. "test-quote"
5. In the column 'Category' enter the category for your block e.g. "sprylab"
6. In the column 'Mode' select your preferred mode for the block to be displayed e.g. 'Preview'
7. In the column 'Align' select your preferred Alignment for the block to be displayed e.g. 'Center'
8. In the column 'Align Text' select your preferred Alignment for the text in the block to be displayed e.g. 'Left'
9. Click on 'Update'
10. Click on 'ACF' in the main menu
11. Click on 'Field Groups'
12. Click on 'Add New'
13. Next to 'Add New Field Group' type a name for your field group in the text field e.g. "test-quote"
14. Click on 'Add Field'
15. Below 'Field Label' enter the desired label for the field e.g. "test-quote"
16. Below 'Field Type' select your desired field type from the dropdown, e.g. 'Text'
17. Go to 'Settings' -> 'Rules' and below 'Show this field group if' select 'Block' from the dropdown
18. In the field right next to it, select 'is equal to' from the dropdown
19. In the field right next to it, select 'test-quote' from the dropdown
20. Click on 'Save Changes'
21. In the left-hand side menu bar, click on 'Purple Feed'
22. Click on 'Articles'
23. Click on 'Add Article'
24. Click on '+' (Toggle block inserter)
25. In the search field, type the name of the block you've just created, e.g. 'test'
26. As soon as your block appears, you can drag and drop it into your article
27. You can now use your customized block in your article content.
