Highlighted

Responsive HTML5 - Layout Customization

Community Beginner ,
Aug 10, 2017

Copy link to clipboard

Copied

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

Topics

Classic, HTML5 layout

Views

872

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

Responsive HTML5 - Layout Customization

Community Beginner ,
Aug 10, 2017

Copy link to clipboard

Copied

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

Topics

Classic, HTML5 layout

Views

873

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
Adobe Community Professional ,
Aug 10, 2017

Copy link to clipboard

Copied

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

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...
LEGEND ,
Aug 24, 2017

Copy link to clipboard

Copied

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

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...
Participant ,
Oct 19, 2017

Copy link to clipboard

Copied

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..

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...
Adobe Community Professional ,
Oct 28, 2017

Copy link to clipboard

Copied

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

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...
Adobe Community Professional ,
Oct 28, 2017

Copy link to clipboard

Copied

Look under Header to start.


See www.grainge.org for RoboHelp and Authoring information

@petergrainge

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...
Community Beginner ,
Nov 20, 2017

Copy link to clipboard

Copied

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.

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...
Adobe Community Professional ,
Nov 20, 2017

Copy link to clipboard

Copied

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

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...
Community Beginner ,
Nov 20, 2017

Copy link to clipboard

Copied

I've just realised that the Indigo format was released for RH2017, and I'm still on RH2015. RH allows the Indigo format to be used in RH2015, so it looks like it should work, but I suspect that changes have been included in RH2017 for it to work properly. That's what I'm hoping for anyway! It isn't possible to download an EVAL version of RH2017, so I've asked for a demo. If Indigo works in that version I'll upgrade.

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...
Adobe Community Professional ,
Nov 20, 2017

Copy link to clipboard

Copied

If I open the Gallery in a responsive layout, I am not seeing Indigo as an option. Where are you seeing it that makes you say RoboHelp 2015 allows you to use it?

Changes were made in 2017 to enable various responsive feature to work, including those in Indigo.

Please always include your version of RoboHelp with any new post. See the Sticky Topics.


See www.grainge.org for RoboHelp and Authoring information

@petergrainge

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...
Community Beginner ,
Nov 20, 2017

Copy link to clipboard

Copied

I've picked this up again after a few months, and I guess that I imported Indigo into my RH2015 to have a look at. But forgot that it's an RH2017 format (it did let me import it into RH2015 and it all looked fine until I started getting into it a bit more).

I assume that Adobe doesn't allow eval copies of RH2017 to be downloaded?

Thanks for your reply Peter.

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...
Adobe Community Professional ,
Nov 20, 2017

Copy link to clipboard

Copied

You can download an evaluation copy. Adobe RoboHelp (2017 release)-For Personalized Content

It's valid for 30 days and has no restrictions. Do apply the update before you start. Also don't install it on your production machine. It will become the default version plus if you don't upgrade within the thirty days, when you uninstall 2017, you may find you need to install 2015 again.


See www.grainge.org for RoboHelp and Authoring information

@petergrainge

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...