Highlighted

RH2019 New UI HTML5 skin: multiple font families for header etc?

Contributor ,
Feb 13, 2020

Copy link to clipboard

Copied

In the HTML5 skin editor I can only select one font from a drop-down list. Is there a way to add more fonts, similar to the way this is done in CSS?

 

My company uses a custom font which many people do not have. Currently the skin falls back to Times New Roman if the custom font isn't installed, while the custom font is a non-serif font. This looks very ugly.

 

Of course, I can select Arial in the first place, but that also then uses Arial for people who do have the custom fonts installed.

 

Is there a way I can select a fallback font, maybe through the .skn file?

TOPICS
New UI, Output presets

Views

88

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

RH2019 New UI HTML5 skin: multiple font families for header etc?

Contributor ,
Feb 13, 2020

Copy link to clipboard

Copied

In the HTML5 skin editor I can only select one font from a drop-down list. Is there a way to add more fonts, similar to the way this is done in CSS?

 

My company uses a custom font which many people do not have. Currently the skin falls back to Times New Roman if the custom font isn't installed, while the custom font is a non-serif font. This looks very ugly.

 

Of course, I can select Arial in the first place, but that also then uses Arial for people who do have the custom fonts installed.

 

Is there a way I can select a fallback font, maybe through the .skn file?

TOPICS
New UI, Output presets

Views

89

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
Feb 13, 2020 0
Adobe Community Professional ,
Feb 13, 2020

Copy link to clipboard

Copied

I think the only workaround at the moment is to use the developer tools in your browser to inspect every element you want to define fallbacks for, add them to your own css file, and add that css file in the User Assets section of the skin. Where you find User Assets depends on the skin, but try under Layout for the Responsive HTML5 skins.

 

e.g. the following will override the title font in Azure Blue:

 

body.media-desktop div.header div.title {

font-family: "Comic Sans MS", Arial, sans-serif;

}

 

You can raise issues here:

https://tracker.adobe.com/#/search

 

And post back with the ticket number so other people can vote for it. 🙂

 

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
Reply
Loading...
Feb 13, 2020 0
Adobe Community Professional ,
Feb 14, 2020

Copy link to clipboard

Copied

Which skin and where in the skin editor? I looked in Azure Blue and the font dropdowns there show all my fonts.

 

The font you seem to want to define is default layout font. Correct?

 

image.png


www.grainge.org

www.grainge.org for free RoboHelp & Authoring info. Use the blue Reply button at the top to help me help you.
The black Reply link nests replies and they sort out of order.

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
Reply
Loading...
Feb 14, 2020 0
Contributor ,
Feb 14, 2020

Copy link to clipboard

Copied

You can select a single font just fine. But I want to select multiple fonts, in case the first font isn't available. The same as you can do with CSS.

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
Reply
Loading...
Feb 14, 2020 0
Adobe Community Professional ,
Feb 14, 2020

Copy link to clipboard

Copied

Misread that as only one font showing in the dropdown. 🙂 Now I understand Amber's reply.

 

Let us know if her suggestion did what you want.


www.grainge.org

www.grainge.org for free RoboHelp & Authoring info. Use the blue Reply button at the top to help me help you.
The black Reply link nests replies and they sort out of order.

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
Reply
Loading...
Feb 14, 2020 0