Skip to main content
J
jigneshs24552355
Known Participant
August 10, 2017
Question

Responsive HTML5 - Layout Customization

  • August 10, 2017
  • 4 replies
  • 1478 views

Hi

I liked the Indigo Layout. I would like to use it.

But, I would like to customize it. I have seen the Customize Selected Layout option.

I am not able to see the option which can allow me to change the Layout in my own way.

For example, if I want the TOC on the left side, I don't see any option.

If I want to keep the desired topics below the search box, I don't see any option. Though, I can control the number of rows or number of topics.

Is there any other way I can customize according to my need this layout.

Thanks,

Jignesh Shah

This topic has been closed for replies.

4 replies

D
DavidHutchinson
Known Participant
November 20, 2017

I'm struggling with this too. I like the Indigo layout, and have made some modifications that make it look more like I would like. However, it's very buggy, for example when I run a preview I get a javascript error "object doesnt support object initindigo" in usersettings.js, so there are bugs in the javascript.

Also, if I switch the index and glossary off, they still appear!

And the project title is repeated rather than the "Welcome to our help centre, how can we help you" showing.

And the Project Title is shown the third time after opening a topic. The burger menu doesn't work, and neither does the search.

I'd like to see a published help centre where this layout has been used. Is anyone aware of one?

Thank you.

Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
November 20, 2017

It's looking like something got horribly messed up in your customisation so the first thing to do would be to import the layout again giving it a new name, say Indigo2. That will not overwrite your customised version so you can go back to that later.

Also I see you are using OneDrive. That is OK but it can create long path names that will fail.

What I would do now is export your customised layout and import it into a simple new project with just two or three freshly created topics,.Create that project outside of OneDrive in something like C:\Test. After importing your layout, import a new copy of Indigo from the gallery, as above.

Now test both.

I think the repeat issues are related to your customisation but testing a fresh project will establish that.

Come back when you have tested as above.

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
J
JGaf10311788
Inspiring
October 19, 2017

I'm hijacking this thread - hope you don't mind.

I'm trying to change the color of the header in the Azure Blue layout.  I opened the usersettings.js file (from the Output Setup pod) and found:

var backgroundColor = "#509de6";

I changed that to something different...regenerated the document and NOTHING CHANGED!  I've searched everywhere.  Where else can I look?

I'm so confused..

Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
October 28, 2017

Using the layout editor would be a good place to start.

Open the SSL in the Output Pod and then select Customise Selected Layout.

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
October 28, 2017

Look under Header to start.

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
Captiv8r
Captiv8r
Legend
August 24, 2017

Depending on how adventurous you feel, you might open your Output Setup pod and expand the Screen Layouts folder.

Good luck in figuring out exactly what to change!

Cheers... Rick

Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
August 10, 2017

The editor is what Adobe have made easy to change and it's probably way more than you could in WebHelp.

Beyond that, you need to have very advanced knowledge of CSS to amend layout.css and of HTML5.

Good luck.

See www.grainge.org for RoboHelp and Authoring information

@petergrainge

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices