LG TinyMCE - add custom CSS class problem
Development and Programming
I am using LG TinyMCE and all is cool, but I need to add a custom CSS class called intro. I added this to the config:
theme : 'advanced',
content_css : 'http://mwserver.net/durhamcenter/template_files/site/editor_site.css',
theme_advanced_blockformats : 'p,intro,h2,h3,h4,h5,h6',
theme_advanced_styles : "Paragraph=p;Intro=intro;Header 3=h3;Header 4=h4;Header 5=h5;Header 6=h6;",I have the intro class in my site_css.php and editor_site.css
When I edit with the LG TinyMCE the format list drop-down has a blank line where intro should be. If I try and select it, nothing happens to the resulting HTML.
What else do I need to do to add my custom CSS class?
Thanks
Moderator’s note: Moved to Extensions
Hi
I have installed TinyMCE and LG correctly but where shall I place my stylesheet so TinyMCE picks up the styles? I have tried to insert custom styles into css/custom under the advanced theme but when I click the Styles drop down menu nothing happens :(
Help please
Thank you
I’ll try and help you here, but I am trying to solve the same issue. I created another css file (see content_css above). In it all I have are p,intro,h2,h3,h4,h5,h6 where intro is my custom class. It might hel if you post your config here.
This is the configuration:
// General options mode : “textareas”, theme : “advanced”, plugins : “safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template”,
// Theme options
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,styleselect,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
// path to images
relative_urls : false,
document_base_url : "/",
// Example content CSS (should be your site CSS)
content_css : "themes/advanced/css/content.css",
// Drop lists for link/image/media/template dialogs
template_external_list_url : "lists/template_list.js",
external_link_list_url : "lists/link_list.js",
external_image_list_url : "lists/image_list.js",
media_external_list_url : "lists/media_list.js",
// Replace values for the template plugin
template_replace_values : {
username : "Some User",
staffid : "991234"
}
I am not sure what to add here but I would expect TinyMCE to get the styles from an stylesheet somewhere.
Thank you for your help
Thanks for the reply. I was missing “styleselect” in the theme_advanced_buttons1 list. I also do not need the theme_advanced_styles list.
You rock!
To answer the other poster, TinyMCE will get the styles from the file you have specified here:
// Example content CSS (should be your site CSS) content_css : “themes/advanced/css/content.css”,
I think your problem is that you have relative urls as false, yet you are specifying a relative url:
// path to images relative_urls : false,
Try changing content_css to a full url or change relative_urls to true.