Open fabianwurk opened 3 years ago
Make sure you're enqueuing your styles on the back-end. Sage doesn't automatically include all your front-end styling in the editor.
I found a trick to include the front style in Gutenberg :
app.css
file to the editor.css
file (with a simple configuration, an @import should be enough). In my case I use tailwind, I copy/paste the whole file with all imports.postcss-prefixwrap
plugin. Use either postcss.config.js
(tested) or bud.config.js
(not tested). Set .editor-styles-wrapper
as prefix.editor.css
file : from postcss.config.js
, just check if the name of the processed file contains editor.css.
Ex:
module.exports = (api) => {
return {
ident: 'postcss',
plugins: getPlugins(api.file.includes('/editor.css')),
};
};
add_action('after_setup_theme', function () {
remove_editor_styles();
}, 999);
And it's done !
I'm trying to create Blocks - and use Tailwindcss for styling. The block appears with correct styling on frontend but not showing any preview styling on editor itself. Do I have to register the Tailwind styles for the editor preview?
I'm just using the default test block eg: