Shortcodes

Shortcodes for AMPZ can be used to show the Social Sharing buttons anywhere on your website (so not only on the predefined positions. Shortcodes are tags, like {ampz: test_inline}, that can be placed inside e.g. modules or articles. Wherever such a tag is found it will be rendered to the defined shortcode (the shortcode consists of one or more AMPZ buttons with specific settings). This allows you to place the social sharing buttons of AMPZ anywhere on your website! :-)

How to create a shortcode?

In order to create to shortcode first go to the dashboard of AMPZ (COMPONENTS->AMPZ Social Sharing). Then click on the tab SHORTCODES, followed by New (see image below).

This will open a new screen, which allows you to define the shortcode:

The following fields are available (see image above and below):

  • Shortcode name: choose a name that makes sense to you, like module_right if you are going to position it in the right-sided module.
  • Select / Sort Networks: select the social networks (at least 1) you want to include in the shortcode by pressing the X on the right. You can sort them using the handle in the left .

The other settings are similar to the general configuration or AMPZ and more or less self explaining. If you need more info please check out the Configuration section of this manual.

After defining your shortcode settings do not forget to Save the shortcode:​

If everything went ok, you are redirected to the shortcode list page (see image below):​

In this list you will see the new created shortcode. In this screen you can either EDIT the shortcode by clicking its title or the edit icon in the blue box to the right. You can also delete the shortcode by clicking the red button with the cross.

Shortcode added, what's next???

Now that a shortcode has been generated you can add it to e.g. a module or an article to show it on pages and positions you like the buttons to appear. This part shows how to add it to a (new) module, but the procedure is similar for an article.

Let's start by creating a new custom html module (if you don't know how to please check this link).

In the image above you see the newly created module with a logical title. Show Title is disabled since only the buttons are to be displayed without a title. In Assignments you can define on what pages the buttons are displayed.

To select the shortcode press the button AMPZ Shortcode in the bottom of the editor. This will bring out a modal:

Select the shortcode to be inserted from the dropdown and then click the Insert AMPZ Shortcode Tag button. The modal will be hidden and you will notice the tag {ampz:module_right} is inserted in the text editor.

Note: it is not required to use the button to insert the tag. You can also simply type the tag in the editor, but since this is viable to typing flaws I advise to use the AMPZ Shortcode button.

Now save the module and check out the results in the frontend on a page that you have selected in the module assignments...:-)