Adding Preview to Your Bubble Plugin Element: A Simple Guide

While constructing the Bubble plugin, you discovered that when you drag plugin element to the UI editor, it displays "No plugin preview available."

How can this issue be resolved?

You can incorporate any type of UI based on your element's functionality. However, it is common for people to use a logo in this situation. In this article, I will demonstrate how to add a logo.

$(instance.canvas).append(`<div style="background-color: #E7E9EB;"><img src="logo_image_url.png" style="width: 100%; height: 100%;"></div>`)

You need to copy and paste this code snippet into the preview function.

---

That's all for this blog. Subscribe for more future updates. Thank you!

Follow me on Twitter.

Checkout My Bubble Plugin Course - Use coupon code "THEBUBBLEGROUP" at checkout for 10% discount.