> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://docs.dropinblog.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 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, your blog ID, and your API key.
### Prerequisites
Before you start, you’ll need:
* An active DropInBlog account (you can test the integration with the free trial)
* A Lovable account – free or paid
### Integration steps
To add a blog to your Lovable site, you should do the following:
* [Copy the DropInBlog blog prompt](#4-step-1-copy-the-dropinblog-blog-prompt)
* [Add your blog ID and API key](#4-step-2-add-your-blog-id-and-api-key)
* [Verify the integration](#4-step-3-verify-the-integration)
#### Step 1: Copy the DropInBlog blog prompt
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](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/copy-blog-prompt-dropinblog-co_1w6xz1l.png)
Then paste the copied prompt into the prompt box in the Lovable editor.
![Paste the blog prompt in Lovable](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/paste-blog-prompt-into-lovable_dkyq2m.png)
#### Step 2: Add your blog ID and API key
After Lovable processes the prompt you pasted, it will ask you for your blog ID and API key, which you can find on the **Code & Layout** page of your DropInBlog account.

First, copy the blog ID under **Step 2** and paste it into the corresponding field in Lovable.
![Generate an API key in DropInBlog](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/copy-blog-id-lovable-blog_262gnr.png)
Next, click on the **Generate API key** button under your Blog ID, and an API key will be created for you. Copy it by clicking on **Copy** on the right.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/create-api-key-for-lovable-dro_16ydnsb.png)
Return to Lovable, and **paste the API key** inside the API key field on the left.
![Publish your Lovable site](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/lovable-add-your-api-key_ru821h.png)
Click on the **Submit** button to prompt Lovable to add a blog to your Lovable site.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/submit-dropinblog-credentials-_152xpxy.png)
Once this step is complete, you need to publish your Lovable site to save the changes.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/publish-changes-in-lovable_p3um2d.png)
#### Step 3: Verify the integration
Before you start adding new content to your Lovable blog, you should check whether the blog integration was successful. 

To do that, go to the Code & Layout page in your DropInBlog account and click on the **Verify Integration** button near the bottom of the page. 
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/verify-dropinblog-lovable-inte_1dbk878.png)
If you see a **Blog Page URL** section, paste the link to your Lovable blog page into the text box below it, then click on the **Check Integration** button to see if you set everything up correctly.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/check-blog-page-url-dropinblog_pplpjz.png)
The green box with the “your blog is live” text should appear next. 
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/blog-live-message-for-lovable-_1vyqpvz.png)
If you don’t see it, contact DropInBlog support.
### 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 **Manage your keys** link.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/manage-your-api-keys-in-dropin_80ojr9.png)
* 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)** (3), then choose the blog account you used on your Lovable site.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/create-new-api-key-dropinblog-_cyproz.png)
### Next steps
Now that your Lovable blog is live, here are a few popular next steps to get the most out of DropInBlog:
* [Write your first post](https://docs.dropinblog.com/en/article/adding-a-blog-post-q2o4ag/)
* [Optimize your content for search engines](https://docs.dropinblog.com/en/article/everything-about-your-dropinblog-seo-weo14h/)
* [Prepare your content for AI-based searches](https://docs.dropinblog.com/en/article/how-to-use-dropinblogs-mention-boost-n473c6/)
* [Customize your blog’s design](https://docs.dropinblog.com/en/article/changing-your-blogs-font-colors-and-layout-z2z3jr/)