Welcome Dialog

Welcome to the Community!

We have a brand new look! Take a tour with us and explore the latest updates on Adobe Support Community.


RH2015 Responsive HTML - Custom font 'omission' in header/toc/etc, yet topics' OK

Explorer ,
Jul 15, 2016 Jul 15, 2016

Copy link to clipboard

Copied

I know there are a couple of existing threads about this general subject, but I couldn't find one that exactly answers my question. Our client uses the Metric-Regular_2.oft font in the application we are delivering with the Help, so I added the code below to the project's default.css file (and I also added the font file itself to the Baggage files):

@font-face {

     font-family: "MetricWeb";

     font-style: normal;

     font-weight: normal;

     src: url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Regular.eot?#iefix") format("embedded-opentype"), url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Regular.woff") format("woff"), url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Regular.ttf") format("truetype");

}

@font-face {

     font-family: "MetricWeb";

     font-style: normal;

     font-weight: bold;

     src: url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Bold.eot?#iefix") format("embedded-opentype"), url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Bold.woff") format("woff"), url("//d1v1s76gnntd7e.cloudfront.net/styles/hpe/MetricWeb-Bold.ttf") format("truetype");

}

This totally worked to retain the Metric font in my tester's Chrome AND IE browsers (previously, they saw Times Roman in the topics!). So the heart of the system - the topics content - retains the Metric font in both Chrome and IE 11, which is really great, but the header, TOC headings, glossary terms, and list of search results appears to be Trebuchet?

Font difference.png

How can I make those Metric, too? I"m using the Charcoal Grey Layout and have clearly specified Metric in its Layout Customization's layout font.

Must I also add the font-face rule to the CSS file of my projects' ScreenLayout>Charcoal_Grey folder, too? I'm a little paranoid about messing up my project in any way at this late stage ...

screen layout css.png

Most of all, I would love to at least just have Metric in the main Header, if nothing else. 

Thanks!

TOPICS
HTML

Views

181

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 15, 2016 Jul 15, 2016

Copy link to clipboard

Copied

LATEST

The skin is managed from the layout.css file in /template/layoutname/. Adding the custom font only adds it to the topics, not the skin.

After you add the font-face rules to layout.css, assign it to the body in the same CSS file.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
RoboHelp Documentation
Download Adobe RoboHelp