Your API calls can be triggered by adding some extra shortcode attributes to your endpoint shortcode. The button will embedded wherever you add the shortcode in your website, and when the button is clicked, it will trigger the API call.
It looks and behaves something like this. The button text can be set to whatever you like by using a shortcode attribute.
Without hiding the button
Hiding the button after submit
This is also fully compatible with the format=”html” and keys=”” attributes, so that you can get exactly the data you want and style it however you like.
Here are the settings we need in our shortcode to create this button:
To create the button, we simply add our shortcode as normal and then include the on="ajax"
attribute. To change the button text, you can add the button_text="Call My API"
and change the text to whatever you like.
[wpgetapi_endpoint api_id='quote' endpoint_id='random_quote' debug='false' keys='{content},{author}' format='html' on='ajax' button_text='Call My API' button_id='call-quote-api']
Other attributes that can be used are button_spinner="true"
to enable the button spinner, and hide_button="true"
which will hide the button after a response is received, and button_id="call-quote-api"
which will give #call-quote-api id to the button.