Home
TeamSite
CSS not working in Visual Format Editor
nickcolorado
Hi,
I am trying to get the visual format editor to display styles from my custom.css file in the dropdowns used to apply styles. I am not having much luck. Here's where I am at.
1.) I have modified the textarea tag of the datacapture form to reference a custom visual format config file:
<textarea external-editor="visualformat" external-editor-config="oppenheimer_visualformatconfig.xml" rows="15" cols="60" wrap="virtual">
</textarea>
2.) I have modified the oppenheimer_visualformatconfig.xml file to reference the advisor.css style sheet:
<style publishstyles="false" href="/opt/iw-home/httpd/iw/config/advisor.css" preservewordstyles="true"/>
3.) I have uploaded the advisor.css style sheet to /opt/iw-home/httpd/iw/config/.
4.) When I load the template that contains the visual editor, I do not see my styles. Instead, I see the default text style in one sdrop down, and the default Heading 1...6 in the other style drop down!
Can anyone tell me why I am unable to see and use my styles in the visual format editor? What am I doing wrong?
Thanks!
Nick
Find more posts tagged with
Comments
bboyle
try href="/iw/config/advisor.css" in your DCT.
I think it needs to be the directory part of the URL to the file, not the filesystem path. I'm guessing the visual format component gets the stylesheet through a HTTP request.
nickcolorado
Thanks for your help. Making the href="/iw/config/advisor.css" in the xml config file allowed me to see the list of styles in the visual format toolbar.
I now have another issue. When I select a style and apply it to items in the visual format tool, I do not see the styles being applied. Any ideas why I wouldn't be seeing the styles applied in the WYSIWYG editor?
nickcolorado
I have configured the visualformatconfig.xml file to reference a style sheet. The styles that are in the style sheet correctly appear in the drop down list of styles to choose from when using the visual format tool. However, when a style is chosen, it does not get applied in the visual format tool. When a style from the list is chosen, the tag remains <p> tags instead of applying the style like it should: <p class="chosenStyle">. How can I get the visual format tool to apply the styles to the text when they are chosen?
JonathonG
There is an issue with styles being applied. The only reliable way to apply styles is to type the text, then highlight (select) it, then choose the style you want applied. Pretty annoying, but it will work.
Jonathon
Independent Interwoven Contractor
nickcolorado
Wow. Is that true? There is not other way to apply styles? Does anyone know if this is fixed if we upgrade to TS 6.0 (which we plan to do soon)?
JonathonG
I don't know if its fixed. It was an issue with the Ektron control, and there's a new version of that in 6.0, so hopefully its fixed now. I'd be interested in hearing from someone out there who knows for sure.
Jonathon
Independent Interwoven Contractor
Narelle
I was just wondering if you are using a HTML clean module? If so, this could be the reason the attribute 'class' is removed from your P tags.
Spencerspins
This is still not fixed.
This is the procedure I followed to test it.
Select style, type text, -> Style applied
Press Return
Select Style, Type text -> Style applied
Press return
Select style, Type text -> Partial style applied, Font and other attributes is taken from the previous line. I dont know how to fix this,
I figured it has got something to do with EquiVclass, I set it to"ALL", Also defined equivClass in the CSS to force Style classes to appear equivalent, even that hasnot worked.
Below is the code generated by VFE
<p class="body">Body</p>
<p class="caption">Caption</p>
<p class="h1"><strong><font size="2">Whats so special about?</font></strong></p>
The <Strong> and font size is from the "caption class. Class h1 has a defined font size.
Is there anywork around for this?
Thanks
mk_iw
I had the similar problem , once I remove the < tagonly >SPAN< /tagonly > from the < clean ...> tag list, the < p> tag started staying with style applied as < p>< span class="head1">blah< /span>< /p>
The below was my remove list:
< remove>
< tagonly\>SPAN< /tagonly>
< tagonly\>h1< /tagonly>
< tagonly\>h2< /tagonly>
< tagonly\>u< /tagonly>
< tagonly\>FONT< /tagonly>
< /remove>
grid.bmp.zip