Robohelp 2017, Indigo, Responsive HTML5, moving the 'Back' button

Community Beginner ,
Jun 08, 2018 Jun 08, 2018

Copy link to clipboard

Copied

Hello,

Does anyone have any experience of moving the 'Back' button in the Indigo layout? The 'out of the box' position for the Back button is actually at the top of the page on its own line (position 1) but I've managed to work out how to change the CSS so that it isn't taking up an entire line by itself.

However, it's now displayed first when I would I would prefer it was displayed last (position 2).

Does anyone know how to move it to position 2?

Thanks,

David.

TOPICS
HTML5 layout

Views

626

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
Adobe Community Professional ,
Jun 08, 2018 Jun 08, 2018

Copy link to clipboard

Copied

In the later version of that layout, Adobe have moved the Back button to above the books on a line of its own. They did that because of issues reported when it was in the position in your older version.

I don't know what the issues were but I would be wary of moving it.

To use the new layout, select Indigo again from the gallery and give it a modified name Indigo2 for example. Maybe you could then compare the code of the two to see what changed.


See www.grainge.org for free RoboHelp and Authoring information.

@petergrainge

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
Participant ,
Aug 29, 2018 Aug 29, 2018

Copy link to clipboard

Copied

Hi DavidHutchinson​ would you mind sharing with me how you managed to move that back button to the in-line position?  I'm looking at trying something and I think it might solve an issue I'm having.

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
Community Beginner ,
Aug 30, 2018 Aug 30, 2018

Copy link to clipboard

Copied

Busy this week but I'll make a note to check out the CSS next week and let you know.

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
Participant ,
Aug 30, 2018 Aug 30, 2018

Copy link to clipboard

Copied

That would be amazing, thank you!  It's the one issue that keeps holding me back from implementing the "cover page" for my collection of documentation packs, and if it works like it should I could theoretically go as deep into structures using custom TOC images for every level as far as I'd want to go.

Looking forward to your reply!

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
Community Beginner ,
Sep 03, 2018 Sep 03, 2018

Copy link to clipboard

Copied

Okay, very simply what I did was rem out the 'display: flex;' line in the div.frontpage-toc . grid-4 section of the layout.css file for the screen layout I'm using for the help centre.

With line 'out of the box':

With line remmed out.

HTH...

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
Participant ,
Sep 12, 2018 Sep 12, 2018

Copy link to clipboard

Copied

Interesting.  When I do the same, I get some straaaaange happenings.  The home page then aligns the icons to the left, like this:

And the Back button isn't working or showing like yours.  It only shows the one button, completely broken.  I literally just commented out the same line as you did:

Any ideas?

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
Community Beginner ,
Sep 12, 2018 Sep 12, 2018

Copy link to clipboard

Copied

To be honest the only way is to use the developer tools in your web browser and see whether you can work it out. That's what I did. I could take a look at your project but I can't commit to timescales unfortunately, and of course, I may not be successful :-).

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
Adobe Community Professional ,
Sep 12, 2018 Sep 12, 2018

Copy link to clipboard

Copied

LATEST

I suspect the difference is you each are using different versions of the Indigo skin, but I don't think there's any version number in any of the files.

As David says, you'll need to use the Developer tools to see if you can figure out how to change where things appear.

Flex does have the option to specify the order in which flex boxes display, so you could play around to see if it has a positive effect for you. The property is order: n where n is a number. Say you have 4 flex boxes. On the first box you set "order: 4". That box will display in the fourth position rather than the first. The site CSS Tricks has a really good overview of CSS flex which I'd recommend to get a handle on the properties and how they interact.

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