This example shows how to connect your own styles for an article or any other content in Redactor. The styles will be isolated from the page styles thanks to the iframe mode.
<!-- element -->
<textarea id="entry">...</textarea>
<!-- call -->
<script>
Redactor('#entry', {
plugins: ['blockclass', 'alignment'],
css: '/your-dist-path/',
classname: 'entry',
padding: '80px',
width: '760px',
custom: {
css: [
'https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap',
'/path-to/content.css'
]
},
classes: {
blocks: {
'quote': 'quote'
}
},
formatItems: {
lead: {
title: "Lead",
params: {
tag: 'p',
classname: 'lead'
}
},
dropcap: {
title: "Dropcap",
params: {
tag: 'p',
classname: 'dropcap'
}
}
}
});
</script>