Articles on: Getting Started

DropInBlog integration guide for Lovable

This guide will show you how to embed DropInBlog on a Lovable website. You’ll copy and paste a blog prompt and add your API key.

Prerequisites

Before you start, you’ll need:

  • An active DropInBlog account
  • A Lovable account – free or paid

Integration steps

Step 1: Copy the DropInBlog blog code

The first step is to log in to your Lovable account and select the project you want to create a blog for.


Next, open the Code & Layout page of your DropInBlog account and copy the blog prompt under Step 1.

Copy the Lovable blog prompt from within DropInBlog admin

Then paste the copied prompt into the prompt box in the Lovable editor.

Paste the blog prompt in Lovable

Step 2: Add your API key

After Lovable processes the prompt you pasted, it will ask you for your API key, which you can find on the Code & Layout page of your DropInBlog account under Step 2.


Click on the Generate API key button, then click inside the box that appears to copy the key.

Generate an API key in DropInBlog

Return to Lovable, and paste the API key inside the prompt box on the left.

Add your DropInBlog API key to Lovable

Once this step is complete, all you have to do is publish your Lovable site to save the changes.

Publish your Lovable site

Verify the integration

Use the Publish menu in Lovable to open your site in a new tab. To check whether the blog integration is successful, do the following:

  • Open the blog page to see if the text and images are displayed correctly
  • From your DropInBlog account, add a new blog post, publish it, then refresh the blog page on Lovable to make sure the post is visible.
  • Once you add some content to your blog, select a random post and open it to ensure that the text and media you created in DropInBlog match what’s on your Lovable site.

Troubleshooting (optional)

If you no longer have access to your original API key and want to perform the blog integration again, here’s how you’ll generate a new one for your Lovable blog:

  • Open the Code & Layout page in your DropInBlog account. Under Step 2, click on the “visit this page” link.

A link directing users to the AP Tokens page in DropInBlog

  • On the following page, you’ll see all your API keys. Click on Add API Key to generate a new one.
  • This will open another page where you should name your API key (1), set Access Type to Public (2), and under Has access to select Specific blog(s), then choose the blog account you used on your Lovable site.

Generate a new API token for a Lovable blog

Next steps

Now that your Lovable blog is live, here are a few popular next steps to get the most out of DropInBlog:

Updated on: 30/01/2026