What is a Shortcode and how to use it
A WordPress shortcode is a small piece of code that communicates with another part of WordPress or any plugin that offers it, and gives it instructions on what to show and do. The shortcode can be put anywhere on the site, not just in an area that Groundhogg uses or has an integration with. It can be on any post, page or sidebar.
Groundhogg has a number of shortcodes available, they are not to be confused with replacement codes, although some replacement codes can be used as shortcodes.
How do you use a shortcode in your website?
In this example, we are going to use a shortcode for a Groundhogg form. Once we have created the form, at the very top are the ways to embed it. We are going to choose shortcode but there are many other ways to do so.
We then go to where we want that form to show, in this case we will be showing it on a page. Once we are on the editing screen (of the page we want) there are currently two ways to do this, and it depends on how your website is setup.
1) Add Block
If you have a recent version of WordPress you may be presented with a view similar to this,
If that is the case then you can continue with this option, if it isn’t then continue to find one of the options that fits you.
What you want to do is add a new block, either by entering /shortcode, or using the plus button to the right and select shortcode. Both of these options will show the same thing, which is a spot to enter the shortcode that Groundhogg gives you. Which will look like this,
and in that spot you enter the shortcode, which is in brackets which you have gotten from Groundhogg.
Once you have put in the shortcode, don’t hit enter as you don’t need a new line. Instead put your mouse in another area. You will still see the shortcode, and not what the form (or what else you got for the shortcode).
To see what the page looks like, you will need to save/update the page, then view it (usually this can be done by looking for the permalink).
2) Visually add shortcode
If editing a page partially looks like the above image then you are on the right step.
On the visual tab of the page (like it is in the screenshot), you want to copy and paste the shortcode you have and hit enter. Then hit update. That will update the page for the visitors with what is shown in the shortcode.
You want to make sure the shortcode is one it’s own line to make sure the shortcode is seen and works.
3) Page builders
If you use Elementor, Divi, Visual Composer, Beaver Builder, or any number of other plugins that allow you to drag-and-drop a page however you like, then this is the section for you.
How you add a shortcode depends on what page builder you are using. What you want to look for is adding a shortcode, then as with the add block you will be given a space to enter the shortcode.
Copy and paste the shortcode into that space, then hit save.