Adding content as Gutenberg blocks
To create or update pages in bulk you must use a spreadsheet and import it to the site using the WP All Import plugin, as explained in this document.
The body content can be added as a Gutenberg block by following the standard explained below:
Groups
It is highly recommended to wrap every section in a Group block
To generate a group block to wrap content use
<!-- wp:group -->
<div class="wp-block-group" tagname="div"><CONTENT>
</div>
<!-- /wp:group --><CONTENT>
*Although the representation on the right has a border and background color, the group block will not render like that, this is so that you can see the group block.
Headings
To generate a heading block use
<!-- wp:heading -->
<h2 class="wp-block-heading mobile--text-align-center desktop--text-align-left" level="2">Lorem Ipsum</h2>
<!-- /wp:heading -->Lorem Ipsum
This will generate an H2 tag on the HTML and a Heading block with level 2 on the editor, to change the level change the number on h2 and the level attribute. Adding the HTML inside the content can also make it bold, italic, or with a link.
<!-- wp:heading -->
<h3 class="wp-block-heading mobile--text-align-center desktop--text-align-left" level="3">Lorem Ipsum with <a href="#">link</a></h2>
<!-- /wp:heading -->Lorem Ipsum with link
<!-- wp:heading -->
<h3 class="wp-block-heading mobile--text-align-center desktop--text-align-left" level="3">Lorem Ipsum with <strong>BOLD TEXT</strong></h2>
<!-- /wp:heading -->Lorem Ipsum with BOLD TEXT
Paragraphs
To generate a paragraph block use
<!-- wp:paragraph -->
<p class="mobile--text-align-left desktop--text-align-left">Lorem Ipsum <a href="#">link</a></p>
<!-- /wp:paragraph -->Lorem Ipsum link
This will generate a P tag on the HTML and a Paragraph block on the editor, you can also add links or make the text bold or italic by adding the proper HTML tags
Separator
To generate a separator block use
<!-- wp:separator {"className":"is-style-wide","backgroundColor":"grey-300"} -->
<hr class="wp-block-separator has-text-color has-grey-300-color has-alpha-channel-opacity has-grey-300-background-color has-background is-style-wide"/>
<!-- /wp:separator -->*The representation on the right is exactly how the separator will be rendered
Adding content using Shortcode block
Another way of adding content with a more complex layout is to use shortcodes, take a look at this through the editor instead of this page frontend, so you can see exactly what it renders.
To do it, you must add a shortcode snippet in the content like this:
<!-- wp:shortcode -->
[shortcode_name content="<CONTENT>"]
<!-- /wp:shortcode -->You can also use it like this:
<!-- wp:shortcode -->
[shortcode_name]
<CONTENT>
[/shortcode_name]
<!-- /wp:shortcode -->*<CONTENT> can be a string, an HTML tag, or any of the Gutenberg block syntaxes explained above. It can also be empty in case the component to be rendered does not expect any content.
Separator shortcode
To generate a separator on the content add
<!-- wp:shortcode -->
[separator_block]
<!-- /wp:shortcode -->*This shortcode renders the exact same separator that will render if you add using the Gutenberg block syntax shown before.
Paragraph shortcode
To generate a paragraph on the content body, add:
<!-- wp:shortcode -->
[paragraph_block]
An active candidate is someone who is currently employed and actively seeking new job opportunities. Being “active” means more than just being open to new possibilities; it involves taking proactive steps to explore and pursue new roles. These steps may include attending <a href="#">job fairs</a>, networking events, or working closely with recruiters. Active candidates are often highly desirable to employers because they have already demonstrated their ability to find opportunities and are more likely to accept job offers.
[/paragraph_block]
<!-- /wp:shortcode -->An active candidate is someone who is currently employed and actively seeking new job opportunities. Being “active” means more than just being open to new possibilities; it involves taking proactive steps to explore and pursue new roles. These steps may include attending job fairs, networking events, or working closely with recruiters. Active candidates are often highly desirable to employers because they have already demonstrated their ability to find opportunities and are more likely to accept job offers.
*You can add link and text-style HTML tags on the content
Heading shortcode
To generate a Heading on the content body add the shortcode with the level attribute and content, the content can either be an attribute like level or inside the tag
<!-- wp:shortcode -->
[heading_block level=2]
What is Active Candidate
[/heading_block]
<!-- /wp:shortcode -->What is Active Candidate
*If no level is set, the default is 2.
Example Card shortcode
To generate an Example Card on the content body, add
<!-- wp:shortcode -->
[example_card content="Lorem Ipsum"]
<!-- /wp:shortcode -->Example
Lorem Ipsum”
*The background color of the card is by default blue/50, but it will change on the Glossary Terms page to be the same color as the page’s banner
Blue Card shortcode
To generate an Blue Card on the content body, add
<!-- wp:shortcode -->
[blue_card]
[heading_block level=2]
What is Active Candidate
[/heading_block]
[paragraph_block]
An active candidate is someone who is proactively seeking new employment opportunities. They might be employed or unemployed, but they are consistently exploring and applying for jobs, and are eager to discuss potential roles with recruiters and employers.
[/paragraph_block]
[/blue_card]
<!-- /wp:shortcode -->What is Active Candidate
An active candidate is someone who is proactively seeking new employment opportunities. They might be employed or unemployed, but they are consistently exploring and applying for jobs, and are eager to discuss potential roles with recruiters and employers.
*The background color of the card is by default blue/50, but it will change on the Glossary Terms page to be the same color as the page’s banner