TinyMce: how do I control the bullet list?
Posted: Wed Apr 08, 2015 3:23 am
I am running several CSS files for menus and galleries, and they are overriding my li and ul classes, so my bullet points are just vertical lists, without dots or numbers.
I'm using TinyMce to do it, and have been reading about customizing the output of these controls.
I've tried this. So the bullet point button appears.
But when I view the rendered page as the customer would see it, there is no Class in the code. So if I set:
... just as an example, nothing happens.
I need to make sure these bullet points that are rendered on the page (like it might render for Word Press for example), it displays it correctly, as rigth now, there are no dots!
I'm using TinyMce to do it, and have been reading about customizing the output of these controls.
Code: Select all
<script type="text/javascript" src="/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: '#mytextareaid',
menubar : false,
width : 450,
toolbar: "bullist | undo redo | styleselect | bold italic | link image",
style_formats: [
{ title: 'bullist', selector: 'ul', classes: 'tinybullet'},
{ title: 'bullist', selector: 'li', classes: 'tinybullet'},
{title: 'Bold text', inline: 'b'},
]
});
</script>But when I view the rendered page as the customer would see it, there is no Class in the code. So if I set:
Code: Select all
.tinybullet { font-weight: bold; }I need to make sure these bullet points that are rendered on the page (like it might render for Word Press for example), it displays it correctly, as rigth now, there are no dots!