Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Support for other Rich text / wysiwyg editors?

default discord avatar
henrikmaa2 years ago
18

Hi! Are there any examples of using other rich text/wysiwyg editors with payloadcms or is the slate based one tightly coupled with payloadcms?



Thanks! 😄

  • default discord avatar
    notchr2 years ago
    @360823574644129795

    made

    https://github.com/AlessioGr/payload-plugin-lexical

    But I'm not sure it's a great option because...



    It's not setup like a module



    It's very large



    Impressive though

  • discord user avatar
    alessiogr
    2 years ago

    there's been a LOT of progress regarding that though! Many parts of the plugin are completely modularized and customizable 😄

  • default discord avatar
    notchr2 years ago
    @360823574644129795

    I did try it out the other day, 2 days ago? I couldn't get it setup correctly tbh

  • discord user avatar
    alessiogr
    2 years ago

    oh hm, what problem did you have exactly? Maybe I can make the set-up easier

  • default discord avatar
    notchr2 years ago

    I think a pattern like



    npm i payload-lexical-editor etc



    in the payload dir



    and then an import



    and it should work



    to be prod ready

  • discord user avatar
    alessiogr
    2 years ago

    oh yeah you can't use that. Npm install is completely broken - you gotta just move it manually into your payload src and it'd work completely fine

  • default discord avatar
    notchr2 years ago

    but that poses the potential of bad deps



    or dated



    etc



    what is broken with install



    ?



    maybe i can help fix it

  • discord user avatar
    alessiogr
    2 years ago

    a bunch of CJS/esm errors, and I think some issues with scss. Additionally I think there's been some issues with modals when you install it.


    Would be really great if you could look into that, I'm really not sure how to fix that

  • default discord avatar
    henrikmaa2 years ago

    Thanks! I'll read about that one 😄



    @360823574644129795

    Do you know if lexical has support for layout/columns? for example a button which create 2 columns that are 50% each and lets you put content in each column?



    Screenshot is example from keystone editor which is what im looking for



  • discord user avatar
    alessiogr
    2 years ago

    hm that, it can't do yet. It can do left/center/right aligns. And you could technically use tables for that kind of layout. But nothing specifically for that yet



    it for sure

    would

    be possible with lexical itself with a custom node!

  • default discord avatar
    notchr2 years ago
    @360823574644129795

    Is lexical the top competitor to slate?



    I'm down to help fix the module

  • default discord avatar
    henrikmaa2 years ago

    Ok thanks! Yeah i guess it could be done in the slate.js based one aswell with a little custom code

  • default discord avatar
    notchr2 years ago

    but want to confirm theres not a better option

  • discord user avatar
    alessiogr
    2 years ago

    Yep, in my opinion it's the best & latest when it comes to pure richtext. DX is a lot better

  • default discord avatar
    notchr2 years ago

    OK cool good to know

  • discord user avatar
    alessiogr
    2 years ago

    next would come tiptap/prosemirror but I'd definitely prefer slate or lexical over that, as it's more dated

  • default discord avatar
    notchr2 years ago

    Want to start a thread for resolving those npm issues? If you can get me to the part with the issue, I can dive into it a bit



    Or we can just keep it going here

  • discord user avatar
    alessiogr
    2 years ago

    Sure, would definitely really appreciate it! Been just getting headaches with getting npm to work myself to the point where I'm having more hopes with just waiting for my plugin to be integrated into the payload core eventually 😅



    oh ill make a new one

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.