Canvas Documentation
Bubble Best Practices
v2
v2
  • Welcome
  • Introduction
  • Contents
  • Using Bubble
    • Bubble basics
    • Bubble best practices
      • Principles
      • Database
      • Design
      • Security
      • SEO
      • Speed
      • Modularity
        • Data triggers
  • Using the template
    • Getting the template
    • Setup
      • Quickstart
      • Features and configuration
        • Customizable landing page
        • Header menu
        • Menu focus group
        • Styles and colors
        • Extending the admin portal
        • Set a password policy
        • Enable cookies
        • Alerts
        • Emails
        • Hidden variables popup
        • Set up index page redirects
        • Set up payments on account page
        • Set up social media links
        • Search engine optimization (SEO)
        • Setting up domains
        • Legal docs
    • Extending the template using Canvas Pages
      • How it works
      • Get started
      • Setting up added modules
      • Updating Canvas styles
    • Extending the template manually
      • Padding
      • Pages, groups, and popups
      • Hiding groups
      • Styles
    • Reference
      • Pages
        • index
        • admin
        • home
        • account
        • verify
        • login and loginsimple
        • termsofservice
        • privacypolicy
        • reset_pw
        • standardpage
        • 404
      • Reusable elements
        • header
        • footer
        • signup/login
        • popupsreusable
        • menufocusgroup_template (︙)
        • menufocusgroup_user
        • menufocusgroupfeature_b
        • menufocusgroup_email
        • menufocusgroup_notifications
        • menufocusgroup_shoppingcart
        • menufocusgroup_search
        • cookiespermission
        • homepageblocks
        • admin portal reusables
          • admindashboard
          • admingeneralsettings
          • adminemail
          • adminseosettings
          • adminsocialmediasettings
          • adminsocialmediainfo
          • adminlegalpages
          • adminhomepagesetup
          • adminstyles
          • adminfeaturebacklog
      • Data and workflows
        • Data structure
        • Option sets
        • API workflows
      • Canvas Pages: lists of modules & page templates
  • Demos
    • Yelp for Books
  • Other Canvas templates
Powered by GitBook
On this page
  • Accessing Canvas Pages
  • Adding a page template
  • Adding a module
  • Submitting a request
  • Errors
  • Adding modules with functionality

Was this helpful?

  1. Using the template
  2. Extending the template using Canvas Pages

How it works

PreviousExtending the template using Canvas PagesNextGet started

Last updated 5 years ago

Was this helpful?

Accessing Canvas Pages

  1. Create an app using the and add [email protected] as a collaborator. This will not work with apps that do not use an AirDev Canvas Template (either the free Starter template, or a Premium one).

  2. Log in to the Canvas Portal and access .

    1. If you don't have an account in the Canvas Portal, sign up for an account using your Bubble email. You'll need to use the same email address that you are using for your Bubble account - otherwise, we won't be able to automatically connect your app to your account.

  3. Press the View Details button on the app that you'd like to add pages/modules to.

  4. Press Add a Page and follow the dialogue that redirects you to our Canvas Pages editor.

Once in the Canvas Pages editor, you'll only be able to create a new page in the app that you used to access the editor. If you'd like to create a page in a different app, go back to the list of your apps and access the editor from a different app.

Adding a page template

This page template is a base on top of which you can add modules (groups of Bubble elements). Most page templates can be used for a wide range of purposes, but some are designed to be used for specific purposes. A couple examples of this are the and the .

To add a page template, press the "Pages" button in the toolbar on the Canvas Pages editor.

A number of pages templates will appear in a popup, and you can preview them or access the reference for the page from this popup. There are page templates and a growing number of premium ones.

To access premium page templates, you'll need to subscribe to Canvas Premium, which has a monthly subscription model where you can continue to access all the new templates and modules we create.

Adding a module

A module is a group of Bubble elements arranged in a way that is responsive, cohesive with Canvas design standards, and has some functionality that you can use in your app. Some examples of modules are a , a , and a .

To add a module, press the "Add" button in the toolbar of the Canvas Pages editor.

A number of modules will appear in a popup, just like they do with page templates, You can see how these modules look when created on a page or access the reference for the page from this popup. There are many free and premium modules and the number is always increasing.

Similarly to page templates, you can access premium modules by subscribing to Canvas Premium. We regularly add new designs to the list of modules that you can access both as a free user and as a premium subscriber.

Modules can be filtered based on the type of Bubble element or design that they contain, with the categories Form, Group, Repeating Group, Reusable Element, Video, and Popup comprising the different types of groups you can filter by.

Modules can also be filtered by the type of styles that app uses. If you have an old version of the Canvas Template, you may want to use an old version of the styles in order to have consistent styles across the app. You can also use modules created with newer styles, especially useful if you have a newer version of the template.

Submitting a request

To actually create the page, you need to submit a request so that the page will be copied to your app.

  • You are not allowed to re-sell either original or modified assets that you obtain through Canvas Pages

  • You are allowed to use anything that you obtain through Canvas Pages for a personal or commercial Bubble application

After agreeing to the privacy rules and terms, your page will enter a queue for its creation. When the copying begins, you will receive an email confirmation in the same email that you used to sign up for Canvas, and you'll receive a confirmation with a link to the completed page when it is complete.

Expect to see [email protected] in Bubble editor on the target page for 5-30 minutes after your request has been submitted while copying is taking place. If your request includes any data operations, like for the Chat or Comments requests (which come with Data types), the editor will access the Data tab in order to restore some data types defined in the Canvas template.

Errors

Adding modules with functionality

Some modules in Canvas Pages already have some functionality that is set up automatically. Adding these modules to your app is another way to quickly extend the template.

To submit a request, click on the "Submit Page" button and define your page name. To create the page, you'll need to accept the and the . Those terms can be summarized as such:

If we run into any errors while processing your request, you will be notified of this by email after we try to create the page. You can contact if you'd like further context or want to follow along the resolution of these errors, which we typically investigate a few days after they have occurred.

Examples of these modules include the and the.

Canvas Starter Template
the list of your apps
on Canvas
Listing Profile Page
Mutlistep Process Page
two
free
Instagram feed-like group
data table with filters and a dropdown menu
comments module
terms of service
privacy policy
[email protected]
Comments module
Chat module