Problem with Skin's Logo on different devices

[Judy5E7D]

When my published web help is viewed on smaller screen devices such as mobile phones or tablet or half screen on laptops, the logo is cut off (see attached screenshots).

Any suggestions how to fix this so the logo adjusts on the header and is viewable on all devices?

Judy

[Jeff_Coatsworth]

What version of RH and what skin/preset are you using?

[Judy5E7D]

I am using RoboHelp 2019 version 2019.0.11

The skin is one I adapted to fit my company's color and logo and Output preset is Responsive HTML 5. Below is an image that shows better what the problem is.

 Thanks, Peter for your advice. I will try it by making sure the logo image is the right size and that it fits within the header border you suggested.

[Peter Grainge]

You have tagged your post New UI and Output Presets which is New UI terminology. Your screenshots though show the Employee Care 3 sample project which is a Classic project.

If you look at the width of the TOC on a desktop, it can accomodate your wide logo. On a phone or a tablet that area is narrower, hence your problem.

I have added a line to make it clearer. Your logo needs to fit to the left of the line.

BTW. Please use the photo icon to insert images within the post. Seeing an image inline with the text makes it easier for anyone answering or viewing the post.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

[Peter Grainge]

Essentially it needs to be square or round. Certainly not as wide as yours. I will have to check if phone settings allow a different logo. 

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

[Judy5E7D]

Where in the RoboHelp Output Settings do you configure the mobile settings for a output preset?

[Judy5E7D]

I can't find my recent post about the problem with the logo in different outputs. I resized the logo a lot (half the width or even more). It still was cut off or didn't show at all in the tablet and mobile outputs. I think the problem is that RoboHelp places the image (the logo) in the middle of the header and not to the left. Is there a way to change where the image is placed in the space above the TOC?

[Peter Grainge]

Whilst you gave us the version, you didn't say whether it was Classic or New UI. I think New UI as you refer to the preset.

It's not an output setting but defined in the skin. Different logos for different devices.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

[Judy5E7D]

You are right. I must have published it in the Classic instead of the new UI version of RoboHelp. I don't see those options in the new UI version. Is there an output preview in the new UI Robohelp like in the Classic version?

[Peter Grainge]

Shouldn't this be asked in the other thread for continuity?

It's at the top of the skin editor screen. Two size options now. Desktop and mobile. Also a preview.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information

[Judy5E7D]

Is there a place where you determine where the logo will be placed in the header above the TOC? I see that my logo is centered in the header space. If it was aligned to the left it might solve the problem of the logo size not showing properly in different settings. I already resized the logo to half its width and I still have the same problem.

[Peter Grainge]

With the appropriate desktop/mobile icon selected, all the settings determine what you can or cannot do with the skin.

Try with a fresh copy of the skin as I thought the logo would be left aligned. I have to go out now so I can't stop to check.

________________________________________________________
See www.grainge.org for free Authoring and RoboHelp Information