external CSS with froala
external CSS with froala
I am trying to use froala editor to render some of my HTML templates. These templates have styles defined in style tag (shown below). I am observing that these styles/classes are not making any difference when I render my template on froala editor(in non-iframe way).
I tried looking for various config options but couldn't really find anything that can help me here.
Is there a way I can pass an external CSS link to froala instance and the same styles gets applied to content in froala?
for e.g.
when loading this template on froala there is no impact of pinkText class:
<html>
<head>
<title>test asset</title>
<style type="text/css">
.pinkText {
height: 22px;
font-family: Arial;
font-size: 16px;
font-weight: bold;
line-height: 1.38;
text-align: center;
color: #cb2c90;
}
</style>
</head>
<body>
<span class="pinkText">
<b> REACT is AWESOME! </b>
</span>
</body>
</html>
Appreciate any insights here. Thanks!
2 Answers
2
Found out that froala by default removes script and style tags along with there content, i was able to get it working after allowing style tag from settings mentioned here https://www.froala.com/wysiwyg-editor/docs/options#htmlRemoveTags
Hope this helps!
There is this option useClasses which is by default true and by making it false, external css will apply to froala instance.
$('.selector').froalaEditor({
useClasses: false
});
Something like above.
You can refer it here.
https://www.froala.com/wysiwyg-editor/docs/options#useClasses
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.