Add class for ul in editor

Vote:
 

A client wants to be able to style ul:s differently in the editor. I was trying to add a class to the editor using EditMenuName but did not manage to get it to work.

E.g.

<ul class="grenBullets">

<li>Item 1</li>

<li>Itwem 2</li>

</ul>

 <ul class="blueBullets">

 

<li>Item 1</li>

<li>Item 2</li>

</ul> 

 

 

 

Could you point me in the right direction?

#27533
Feb 02, 2009 12:45
Vote:
 

Have you seen this post?

http://world.episerver.com/Forum/Pages/Thread.aspx?id=19877&epslanguage=en

That might help you solve your issues.

#27541
Feb 02, 2009 15:24
Vote:
 

Thanks for the tip but my problem is not that the style does not show in the dropdown.

If I put a css rule like ul.test {EditMenuName: test;} in the editor.css it shows up in the style dropdown.

Then I try to highlight an existing bullet list in the editor and apply the style. This results in corruppted HTML.

Screen.css 
div#submainleft ul.test {
line-height: 125%;
list-style-type: none;
margin-left: 0px;
}
div#submainleft ul.test li
{
  list-style-type: none;  
  list-style-position:outside;
  margin: 0 0 6px 0;
  background: url(../images/icon_DarkGreenArrow.gif) no-repeat -7px 0px;
  padding-left: 14px; }
 
Editor.css
ul.test{ EditMenuName: test;}

HTML before:
 <UL>
<LI>item1</LI>
<LI>item2</LI></UL>

HTML after I highlight the list and style it with the test class from the drop down:
<UL class=test>
<UL>
<LI>item1</LI>
<LI>item2</LI></UL></UL>

Mayby this is not the way to do it. Another approach would be to make an editor plugin that simply pastes in correct HTML and then let the user cheange the content?

 

#27560
Feb 03, 2009 8:07
Vote:
 

Or you could just skip the UL and just use a div with class=test to contain your UL. Something like this perhaps:

.test {EditMenuName: test;} .test ul {border:0;} .test ul li {border:0;}
#27561
Feb 03, 2009 8:36
Vote:
 

Could not get it to work after playing around with it for some time. Made a plugin that pastes pre-defined html into the editor.

Cheers!

#27655
Feb 05, 2009 13:20
Vote:
 
Has anyone ever found a solution to adding classes to a UL tag in the wysiwyg editor? 
#33127
Oct 02, 2009 14:29
Vote:
 

Any solution to this problem... Please help

#39703
May 28, 2010 17:42
Vote:
 

I've found that the only solution for this problem for the CMS5 editor, if you really need the class on the UL element and not on a surrounding DIV element, is to build a custom editor plugin. Saying that I would recommend being practical and use the DIV workaround.

#39748
Jun 01, 2010 2:12