How to integrate a third-party API into your Hostinger Horizons website

Integrate a third-party API into your Hostinger Horizons website

Updated 2 weeks ago

Connecting your website to external services allows you to add advanced features like payment processors, real-time data feeds, and automation tools.

Hostinger Horizons supports third-party API integrations by handling the backend code for you. Common use cases include:

  • Payment processors: Integrating services like PayPal or Stripe.
  • Content APIs: Displaying live data such as weather, news, or specialized databases.
  • Automation: Connecting to tools to sync user data.

Before you start

Before prompting Horizons, gather the following details from your API provider:

  • API key or credentials: Required to authenticate requests.
  • Documentation URL: The specific endpoint structure and parameters.
  • Functional requirements: A clear description of what the API should do (e.g., “display data” or “trigger an action”).

Step 1: Prompt Horizons to set up the integration

In the Horizons chat, describe the connection you want to establish. Provide the technical details directly in the chat.

Example prompt for a content API:

Integrate the Bible API (https://scripture.api.bible) into my website. My API key is: [your API key]. Display a random Bible verse on the homepage every time the page loads.

Example prompt for a payment API:

Integrate the PayPal API into my website. My client ID is: [your client ID]. Add a Pay Now button to the checkout page.

Hostinger Horizons adds credentials to your project’s backend so they are not exposed in your site’s frontend code. Be as specific as possible regarding where the feature should appear and what happens after a user interacts with it.

Step 2: Test the integration

  1. Once the integration is generated, click Preview to open your site.
  2. Trigger the feature, such as loading the page or clicking a button.
  3. Confirm the expected result, such as data loading or a confirmation message appearing.
  4. If the feature does not work, describe the specific error to the Horizons chat and ask for a fix.

Step 3: Publish your website

Once the integration works correctly in the preview mode:

  1. Click Publish in the Horizons editor.
  2. If you used a sandbox or test key, prompt Horizons to replace it: “Replace the test API key with my live API key: [your live key]“.
  3. Republish the site to apply the live credentials.

Your Hostinger Horizons website is now connected to an external service, extending its functionality beyond standard features. You can continue to add more integrations as your site grows.