How should I handle the "Your page model does not appear to be integrated" or "To use the full power of Builder, you'll first need to integrate" message?

[logan]

We’ve made an update to Builder which encourages you to update your preview URL so that you’re always working with live content. If you aren’t working with content that’s connected with your app, you may see the following message: “Your page model does not appear to be integrated” or “To use the full power of Builder, you’ll first need to integrate”.

Here’s how to handle this message, given some potential circumstances:

You don’t have an app / site to integrate with

If you don’t already have a project to integrate with, you can select “Preview With The Fallback Editor”, which will display Builder content on a blank canvas. This is ideal if you’re just trying things out and creating content that won’t go live.

If the entire model is for testing, or won’t be published directly to a page in your app, you can set it to always load the Builder canvas instead of the integration message. Head to builder.io/models and click the affected model.

Edit the following URL so that [modelName] is the name of your model (don’t keep the brackets!): https://preview.builder.codes/?model=[modelName]&previewing=true

For example, if this is for your default page model called ‘page’, you’d want the URL to be https://preview.builder.codes/?model=page&previewing=true

Paste this URL into the “Preview URL” input for your model settings.

Keep in mind that you’ll need to update this if you want to preview and publish content to a live location in your app.

This appeared on a page that was working before

If this started showing up on your pages, please head to builder.io/models and open your affected model. If the Preview URL input is empty, that’s likely why you’re receiving this message. Make sure that your Preview URL is set to the right localhost or site URL.

You have an integration error

If you see this message even when your Preview URL is set, you may have an error with your integration. Please review this documentation and double-check your integration. If you still cannot locate the error, or if you believe you are seeing this message in error, please contact Builder support at support@builder.io.

[gg_justin]

Any tips for solving this with a Remix project?

Remix + Builder in the docs is pretty new, so finding resources is a bit hit or miss.

Everything seems to work fine except there is this Integration Settings box that overlays my UI in the visual editor. When I click it, it thinks I am in a NextJS project. Can’t for the life of me make it go away, so feel like I’m missing something.

Can be reproduced with the Remix Starter

[logan]

Hey @gg_justin and thanks for asking! I just went through and created a Remix starter from the example and I don’t see the prompt. From what I can see here, you are integrated correctly. If there was no connection to your Localhost you’d get the “We are having trouble connecting to your site” error instead

If I can get your Public API Key and the project files you’re using (you can direct message me them!) I will try to recreate to and see if there’s any difference from the example I just worked with.

Thanks for reaching out!!