Luigi
TCTwill CMS
•Created by Braunson on 2/27/2025 in #👊support
Sticky WYSIWYG toolbar + image upload?
Hey! 👋 Totally get where you’re coming from — sometimes best practices don't align perfectly with real-world workflows, especially when the end users are experienced frontend devs who just want flexibility and speed.
I agree that inserting images directly into the WYSIWYG isn’t ideal for data integrity, but I also understand the practical need. Twill’s block editor is amazing for structured content, but for certain types of editing, a more free-form approach just makes sense.
It is possible to extend the WYSIWYG using a custom Tiptap Vue component and enable image uploads — though yeah, by default it stores images as base64, which isn’t great. I’d suggest overriding that behavior and hooking into the media library modal instead, letting users select and insert images by URL or ID reference instead of base64 blobs. That way we get the flexibility and keep the data clean.
Also, for the sticky toolbar — enabling the limitHeight flag is helpful, but we can also enhance it with a bit of custom JS/CSS to keep the toolbar fixed on scroll within the editor container.
If you’d like, I can help implement this hybrid solution — clean, flexible, and custom-fit to your team’s real-world workflow. 🚀
Let me know how deep you’d like to go!
10 replies