Articles on: Integrations

WordPress - How to install the Abyssale WordPress plugin?

If you have ever wondered how can I save time by automatically creating images for your WordPress posts, this article is for you.

We will show you a way so you don't have to design them time and time again, anymore. That's right! You can use Abyssale templates or create your own and use them to generate a new fresh and on-topic image every time you create a new blog post.

Install the Abyssale plugin

Before anything, you'll have to download the Abyssale WordPress plugin.

Login to your WordPress admin panel and go to the plugin page.
Search Abyssale plugin, and select it
Click Install and activate the Abyssale plugin

Setup the Abyssale WordPress plugin

To setup the plugin, head to your WordPress admin panel and click on the Abyssale tab.

The Abyssale settings pages allows you to:

Paste your API Key (This unique Key is your bridge between WP and Abyssale).
Map your template layers with your WordPress settings (Author name, Feature image, ...)
Test your plugin integration (To check if everything is working just fine).

Retrieve your API key

Head over to your Abyssale account settings API page
Select and copy your API key in the field "Your api key".

In case you've never used the API yet, you will be prompted to request API key access. Your API key should be active within a few minutes.

Head over your WordPress Abyssale settings page and Paste your key to the "Api key" field and click save settings
You should then see the template settings form (make sure to correctly copy/paste your key).

Set your template and map your field

We're almost there! Now we'll configure your WordPress settings to map over to your chosen template.

Select your template from the Abyssale free template library or create your own template
Map Wordpress fields with Abyssale template fields and save it with the button Save settings

Fields available:
Template Id: The Abyssale template you'd wish to use
WordPress title: The title you will write in your post. It must be mapped with a text box
WordPress author name: The author of the post. It must be mapped with a text box
WordPress post creation date: It must be mapped with a text box
WordPress featured image: It must be mapped with an image box

You can always select "none" within the list. Your layer's original content won't be updated for each generation.

Test your integration

To make sure everything looks good, we've added a handy tool to test your integration settings.
This action will send some dummy data to the Abyssale API and return an image.

Depending on which fields you've mapped, you should be able to see the following data points in the generated image
A title
An author name
A date
The Abyssale logo (This is a totally normal behaviour)

Now you're up and ready to automagically generate an image for your upcoming blog post!

Auto-generate an image for your next post

Now that everything is installed and ready, let's see the Abyssale plugin in action.

Write a title to your post.
Optional - Import and select a featured image. (If you'd like to have a different picture for each post, you'll have to add your picture here. It will then replace the default image box in your template).
Click on the Generate button in the Abyssale section (right side panel).
Wait for your generated image to appear.
Your auto-generated image is here 🤖⚡!
Click on the Feature this image button, it will replace the current featured image with the one generated.

You've found the perfect title/image to use at the last minute? Change your title (or your image) and generate another image!

How to use it in your local environment? (Optional)

If you want to use the Abyssale plugin on your local environment you need to install and use Ngrok. 
Ngrok will create a secure tunnel to your localhost. With this tool Abyssale api will be able to retrieve local images.

Install Ngrok by following the instructions here.
Change the WP_SITEURL and WP_HOME in wp-config.php with the Ngrok url.

Use the Ngrok url to access your local WordPress.

Updated on: 02/11/2021

Was this article helpful?

Share your feedback


Thank you!