Template Setup
Onboarding Video
The following video shows through the steps below.
Activate Membership Feature (by Outseta)
If you want to activate the membership website feature for bookmarking and gated pages, you need to get an Outseta founders subscription.
After the setup on Outseta, you need to add your Outseta URL to your Framer project.
Add this URL (mainly just the subdomain) to our General settings > Start Body Tag.
Don't remove any of the other code, just replace the "browse" with your unique Outseta site name:
if you don’t plan to use membership features or Outseta then you can remove this snippet shown above.
To make bookmarking work, you need to add one custom property in Outseta. Go to CRM > Custom Properties, and add "bookmarks" as a new property:
This Remix File here is set up with a free access to test the product, which is not connected with a paid plan in Outseta.
If you want to add a paid plan to your curation site, add a new paid plan in Outseta and copy its signup link into your signup buttons inside the template. Then, make sure you block the bookmarking page with the paid plan as well.
CMS Collections
You can find 2 CMS collections in this file. They are set up for you already and you only need to delete the existing CMS entries through the multi-select feature and add your own ones.
Fonts styles & colors
Font styles can be changed within the asset panel on the left. This will ensure, that all rich-texts on the site have the right styles in.
This template also has a lot of static text elements built in. So if you change your fonts, make sure you change all of them, not only the text styles.
To change colors you can do so as well in the color assets, choose light or dark mode and just change the HEX color value to your content.
To remove the dark or light mode, use the same HEX color value in both light and dark mode. This will ensure, that the same color is visible in both modes:
Custom Code
This templates includes a bunch of custom code overrides to make all the advanced features possible.
You should not change any of them, otherwise things can break.
If you want to show certain elements to specific plans, you need to add the code override called "ShowToSpecificPlan.tsx) to your element in Framer. Just choose the layer, then add Code Override, and choose the following file and override:
Lastly, open this code override and change the Plan ID's to match yours. There are instructions in the code.
3 Months Free Pro Hosting
This templates includes a discount for 3 free months of Pro hosting.
Use "partner25proyearly" in the plan checkout and get your first 3 months hosting for free.
Support
If you are stuck on something, never hesitate to reach out to the Canvas team on our website chat widget.