Medium editor change font color, apply css

Hi there, a client of mine asked me to able to change the font color on the text he enters. We are using the Medium Editor for the back end system and I was trying to figure out how I can give my client the ability to change font color. Even by being able to add HTML (for example <span> tags styled properly) would do the job.

Thank you!

I don’t believe that is a possibility with Medium Editor.

Appears it is possible Brad. Learning something new every day! :slight_smile:

HI @Dave, I think what @t11 is needing is the ability for the client to change font colour with the Medium Editor tools. Not the placeholder text.

Yes Brad you are right! This is what I am looking for

My bad!

1 Like

It’s ok, just sounds very odd to a client when you can build almost anything, and when he asks something so simple, to say it can not be done. I think there was another post talking about how to use another Editor that was more advanced, although in my case is a real pain since project is 99% ready with the Medium editor having the ability to upload images etc. Using another editor (if possible) means new configurations from start with content already uploaded.

Hope there is a solution using Medium editor

I also kind of questioned the decision by the team to use Medium as an editor. And I know this doesn’t help you but one thing I have never allowed clients to do is edit colours or sizes of fonts. Especially if my name is on itt as designer.

Yes I agree but you know how it goes sometimes. Very strange clients that keep on asking and asking for changes, and when finally reaching to the end with their demands, to tell him that the one last thing, that came to his mind the last minute, can not be done. You can imagine how this can go…

1 Like

Yep, been there many times. Not a comfortable situation.

1 Like

How about using the editor’s HTML option? It wouldn’t be ideal for the end user, though you could make it a little easier by creating some classes etc… At least, it would make it possible.

Well I tried it, but doesn’t seem to do anything. This is what I wanted to do. Create some classes and let user add HTML. But while for example try something like this
<span style="color:#fff;">Test</span>
and then clicking the HTML option in the medium editor, it does not do anything.

You should take a look at this: https://github.com/yabwe/medium-editor/issues/523#issuecomment-312204485

1 Like

Looks very promissing. Thank you!

Hi Niko,
Unfortunately changing font and colors is not supported in the current version of Medium Editor.
However inserting HTML tags and using the HTML option in the toolbar will work just fine. I just tested with the standard Bootstrap classes, so it will work any class/html code:

Teodor thank you very much for your answer. While applying a class works, it is the very ‘difficult’ for the end user to revert the class if needed. I did not work a lot with the HTML functionality of Medium editor. I will try it some more and see what I can propose to the client.

Thanks!

I am afraid that’s the only way to apply such changes to the text in the medium editor.

Is it possible to create a button that when pressed will inject html or coloured text at the end of the medium editor text?

Sorry if stupid suggestion, am on holiday so not really in work mode :slight_smile:

Just implemented the following.
1.Created a button called ‘enableFontColor’
2. When clicked I use a query variable ‘font-color’ which equals 1
3. When the ‘font-color’ variable is 1 then bellow the medium editor I show a textarea which displays the content of the record in plain text (all HTML tags shown etc).
4. When the user makes any changes in the textarea and clicks save (textarea has the same name as the medium editor) I do the following.
5. Remove the ‘font-color’ variable (which makes the textarea to hide)
5b. Reload the content.
6. Since medium editor and textarea have the same name, and textarea is after the medium editor, all html alterations are saved. This way, with very simple style changes the administrator can create any HTML content she/he likes.

Thank you!

3 Likes

These options are now available in Summernote editor:

1 Like