HTML/CSS to Image

The HTML/CSS to Image modules enable you to convert html/css to an image in your HTML/CSS to Image account.

Getting Started with HTML/CSS to Image

Prerequisites

  • An HTML/CSS to Image account

In order to use HTML/CSS to Image with Integromat, it is necessary to have a HTML/CSS to Image account. If you do not have one, you can create a HTML/CSS to Image account at htmlcsstoimage.com.

The module dialog fields that are displayed in bold (in the Integromat scenario, not in this documentation article) are mandatory!

Connecting HTML/CSS to Image to Integromat

To connect your HTML/CSS to Image account to Integromat you need to obtain your User ID and API Key.

1. Log in to your HTML/CSS to Image account.

2. Go to Dashboard where you can find your User ID and API Key.

2020-02-27_11_46_22-HTML_CSS_to_Image_API_-_Generate_images_from_code.png

3. Go to Integromat and open the HTML/CSS to Image module's Create a connection dialog.

4. Enter the User ID and API Key provided in step 2 to the respective fields and click the Continue button to establish the connection.

Actions

Create an Image with HTML/CSS

Converts HTML/CSS to an image (jpg, png, webp).

Connection Establish a connection to your HTML/CSS to Image account.
HTML Enter the html you want to create an image from.
CSS Enter the CSS to be applied to the HTML above.
Google Fonts Specify the Google Font you use in your CSS. E.g. Oxanium

2020-02-27_12_45_23-Integration_HTML_CSS_to_Image___Integromat.png

Make an API Call

Allows you to perform a custom API call.

Connection Establish a connection to your Dropbox account.
URL

Enter a path relative to https://hcti.io/v1. E.g. /image/{{image_id}}

For the list of available endpoints, refer to the HTML/CSS to Image Documentation.
Method

Select the HTTP method you want to use:

GET
to retrieve information for an entry.

POST
to create a new entry.

PUT
to update/replace an existing entry.

PATCH
to make a partial entry update.

DELETE
to delete an entry.

Headers Enter the desired request headers. You don't have to add authorization headers; we already did that for you.
Query String Enter the request query string.
Body Enter the body content for your API call.

Example of Use - Get an Image

The following API call downloads the created image:

URL:
/image/{{image_id}}

Method:

GET

2020-04-16_16_03_30-Integration_Typeform___Integromat.png

The result can be found in the module's Output under Bundle > Body
The image data:

2020-04-16_16_09_42-Integration_Typeform___Integromat.png

Popular use cases from our blog

automated-data-collection-crm-illustration

How to Automate Data Collection - Part 5: CRM Systems

automated-data-collection-chatbot-marketing-illustration

How to Automate Data Collection - Part 4: Chatbot Marketing

automated-data-collection-paid-ads-illustration

How to Automate Data Collection - Part 3: Paid Ads

automated-data-collection-email-illustration

How to Automate Data Collection - Part 2: Email Marketing Segmentation

personalized-customer-experience-illustration-integromat

5 Automated Solutions to Personalize Customer Experience

data-collection-automation-forms-pt-1

How to Automate Data Collection - Part 1: Online Forms

Didn’t find what you were looking for?

Expert

Find an expert

We feature a network of 450+ certified partners across the globe who are ready to help

Find an expert

Automate any workflow in your business

Sign up for a free account today. No credit card required, no time limits on free plan.