Fruition is great. It's an open-sourced tool for creating websites with Notion. It's what makes this site possible. Most people use it to enable custom domains for their Notion public pages (e.g. from notion.so → customdomain.com), yet there is so much more that you can do with it. Here are some things that I find possible with Fruition.
<aside> <img src="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/043be478-9335-4535-be68-240837e84daa/gem-stone_1f48e.png" alt="https://s3-us-west-2.amazonaws.com/secure.notion-static.com/043be478-9335-4535-be68-240837e84daa/gem-stone_1f48e.png" width="40px" /> UPDATE I have migrated to Potion.so and I am no longer using Fruition. However, this post still applies if you are looking to customize your Notion websites with Fruition.
</aside>
In short, the way Fruition works involves copy and pasting a generated script into Cloudflare. The script comes with certain variables that you can adjust to your needs.
.png)
The script generated by Fruition
And yes, you can add your own scripts inside the CUSTOM_SCRIPT variable. I find that adding Google Analytics here is a must. You can add your own Javascript here but for me, this is also where I add my custom CSS using the tag <style></style>, although I'm now considering linking a separate stylesheet file instead.
Yes, that's right. Override the default Notion look with your own CSS. This can be tricky as you will find that most of the HTML elements do not have classes and the ones that do are typically recurring common elements such as containers and backgrounds.
.png)
Styling common elements