Archived topic
Woocommerce MCE Editor Font Styles
7 replies · Started by Matt on May 30, 2022
Hi Guys,
Just wondering what the recommended way is to get the font settings from the customizer (eg base p, h1, h2, h3 etc) into the Woocommerce product mce editor so the fonts look like the front-end?
Thanks
Hi there,
you can simply select form the list box in TinyMCE:
Hi David,
Sorry my initial post was light on details. I have added a custom font via a child theme using @font-face rules. Everything works fine in the front-end but the mce editor (for products) just shows mac system fonts.
Below are screenshots of the customizer settings and what is being output on the back-end.
https://ibb.co/wK1kJgw
https://ibb.co/64DgW2J
https://ibb.co/LCQg9c3
https://ibb.co/WzG8T3b
Thanks
Hi Matt,
In this case, it's better reach out to MCE editor's support as GP has no control over that.
Thanks for your understanding!
Hi Ying,
This s a pretty disappointing response for a number of reasons. I understand that to achieve what I want might not be 'out of the box' functionality, but this is Woocommerce, and the stock standard MCE editor. Are you saying that GP doesn't support woocommerce?
The stylesheet that IS being enqueued in the woocommerce editor is 'admin/editor-typography.css' which is being included by GeneratePress theme..... so I would say you do have some control over that. The only thing is that my font selections in the Customizer are not being included/ appended to this stylesheet.
You would need to load your own stylesheet in the editor.
See Tom's reply here about adding your own editor-typography.css
Or further down the topic Elvin provides a filter for you load any custom styles in the editor:
Thanks David. That's what I was looking for. Much appreciated.
Glad to hear that and sorry for any confusion.