Adding a custom block to a standard page

Custom blocks allow you to add more specialised or advanced functions to a standard page. Some examples include direct children as cards and dialog pop-up boxes.

Most custom blocks have been developed only for a specific agency. This guide is only for custom blocks that can be used by any editor from any agency. 

On this page

• When to use custom blocks
• How to add a custom block on a page

---

When to use custom blocks

Do

• Use custom blocks to add advanced functionality to a page

Don't

• Use custom blocks that have been developed specifically to be used only by a particular agency – unless that agency is yours
• Custom blocks variations that are not included in this guide should not be used. Custom block legacy variations that should no longer be used include:
  • Content Statistics Block
  • DCS Agency Social Channels Block – use the Contact block instead

---

How to add a custom block on a page

To add a custom block to a standard page:

1. Go to the Edit screen of your standard page and scroll down to the Add block button.
2. There is a drop down arrow on the Add block button. Click the arrow to expand the drop down options in the Add block button and select Custom block
3. The Custom block will be generated. By default the Type will be set to Advanced block. You can leave this setting.
4. In the Plugin field select the type of custom block you want to add, then follow the instructions for that block type

Direct children as cards

To add Direct children as cards:

1. In the Plugin dropdown, under the Navigation heading select Direct children as cards
2. In Column layout use the drop down to select either 2, 3 or 4 cards across
3. In Entity select Entity from route for the child pages of the page you are editing to display as cards

For further guidance, visit Adding Direct children as cards on a page.

Webform

To add a Webform:

1. In the Plugin dropdown, under the Webform heading select Webform
2. In the Webform look up field start typing the name of an existing webform that you would like to add to your page. A dropdown of available forms should be generated. Select your form. Your webform must already have been created. If there is not an existing webform, see instructions for how to create a new webform

Dialog

To add a Dialog:

1. In the Plugin dropdown, under the heading DCS select Dialog.
2. From the Variant dropdown select either Simple or Callout. 
3. In the Open button label add the text for the button that will be on your webpage that will open the dialog.
4. If you have selected Callout as your variant you also add text in the optional Copy field. Ignore this step if you have selected Variant > Simple.
5. The Dialog type should have the Single call of action option selected from the dropdown.
6. Add a Dialog title. This will be the heading at the top of your dialog.
7. The Dialog body is an optional field where you can add information that you would like displayed within your dialog.
8. The Legal disclaimer is optional. If you would like it to display, tick the Display legal disclaimer box and add your legal message in the Body field below it.
9. Scroll to Action buttons.
10. Add a Primary button label. This is the text that will be on the button within your dialog that links to another URL.
11. Add a Primary button link. This is the link that customers will go to if they press the button within the dialog.

Hubspot subscribe

To add a Hubspot subscribe block:

1. In the Plugin field select Hubspot subscribe.
2. In the Heading field enter the heading you would like to appear. For example, ‘Subscribe to our enews’. This will appear as an H3 heading on the page.
3. In the Text field enter a description about your subscription. For example, ‘Stay up-to-date with the latest news and events by subscribing to our weekly newsletter.’
4. In the Form GUID field you will need to enter your Hubspot GUID. This will be found in your Hubspot account and copy/pasted into this field.
5. To locate your form's GUID: In your HubSpot account, navigate to Marketing > Lead Capture > Forms. If you have a free HubSpot account, click Marketing > Forms. For more help with the GUID number you will need to contact Hubspot.

After you have embedded and saved your page, submit a test of the subscription component and check that the data is coming into your Hubspot account correctly.

5. Scroll to the bottom of the page and click the Save button.

See this live on nsw.gov.au

Visit Custom block to see a live example of this component.

Need any more help?

If you have any questions, or require assistance with anything mentioned on this article, submit a request via the webform.