I'm using FM 2015 Publish to Responsive HTML5. I want to override the output styles with my own CSS file. However, FM generates extra CSS styles that I don't want.
In Publish Settings, where it says "Manage CSS:" I select "Import" and import my CSS file.
After import, my styles are loaded correctly. I can click on the Edit Style button and inspect the values:
However, when I go ahead and publish the output, the resulting FM-generated CSS files contains a lot of extra stuff that interferes with the CSS styles I imported. Here is a snippet of the output CSS file:
/* FM creates this (I think from the styles in my FM document). I don't want this in the output at all. */
p.FM_SubTitle {
Direction:ltr;
margin-left: 0.000pt;
margin-right: 0.000pt;
text-align: right;
text-indent: 0.000pt;
margin-top: 17.000pt;
margin-bottom: 8.000pt;
word-spacing: 0.250em;
font-family: 'Myriad Pro';
font-style: normal;
font-weight: bold;
font-size: 14.0pt;
color: #000000;
background-color: none;
text-decoration: none ;
letter-spacing: 0.00em;
}
/* This is the CSS from the file I imported. I want this to
completely override the normal stuff that FM Publish creates. */
p.FM_SubTitle {
font-size: 160%;
font-family: "Segoe UI", "Verdana", "Arial", "Helvetica";
color: #509DE6;
margin: 2em 1em;
text-indent: 0pt;
text-align: left;
}
So my main question - Is there a way to stop FM from using ANY of the document's formatting and only use the CSS styles I imported?
Even if I don't import CSS and use the "Edit Style" GUI in the Publish Settings, FM still generates extra style output that seems to come from the document.
One of the big problems this causes is that I have to specify a bunch of CSS attributes even if I don't use them in order to compensate for the stuff that FM is generating.
A last resort is to just over-write the resulting CSS file in the generated HTML5 output. However, I need to also generate HTML Help, and as far as I know, there is no way to replace the CSS before the help compiler runs (when using the Publish to HTML Help feature).
Thanks.
1 Correct answer
Hi,
If you want to get rid of the source styles then, the CSS files that you are providing should have different selectors than what FM is generating. When the paragraph name is SubTitle then FM generates p.FM_SubTitle style.
In this case, you can add a selector e.g. p.SubTitle in your CSS file , import the file and map your paragraph style to the style provided in the file i.e. SubTitle.
You can automap the style if your paragraph name and CSS style names are same.
-> Add the CSS style in your CSS
...
2
Replies
Hi,
If you want to get rid of the source styles then, the CSS files that you are providing should have different selectors than what FM is generating. When the paragraph name is SubTitle then FM generates p.FM_SubTitle style.
In this case, you can add a selector e.g. p.SubTitle in your CSS file , import the file and map your paragraph style to the style provided in the file i.e. SubTitle.
You can automap the style if your paragraph name and CSS style names are same.
-> Add the CSS style in your CSS file. Style should not be named p.FM_SubTitle.
p.SubTitle {
font-size: 160%;
font-family: "Segoe UI", "Verdana", "Arial", "Helvetica";
color: #509DE6;
margin: 2em 1em;
text-indent: 0pt;
text-align: left;
}
-> then import the file in Settings Editor and map your paragraph styles to the appropriate Style from the CSS file.
You will have to do this for all the styles that you don't want from source document.
Another way can be to create FM Template document with styles that you want and then provide the template to "Use Template" section. The styles from the template document will be produced in the final output.
Please reply back in case you need any more clarity.
Thanks
Ah, now I understand the style mapping feature better. I will try it. Thank you!
----
Update: I renamed my custom CSS styles as you instructed and mapped each FM style to the output style. It worked great.
Tip: You don't have to tediously pick each output style for each source style in the Style Mapping dialog. Instead, select the "Paragraph Styles" item in the list. Then check the box that says "Automap Paragraph Styles". This does the automap for all the styles, and even informs you which styles have already been manually mapped previously.
AdChoices