Inspiring

Question

RH 2019 Frameless: How to suppress/hide TOC Tiles container

Forum|Forum|6 years ago
December 19, 2019
9 replies
872 views

Enviro

Running RH 2019.
Developing Frameless output for the Orange skin.

Goal

Want to suppress/hide TOC Tiles container on home page and use my own topic as the source of all home page content.

Problem

If I set the Display property to None for the TOC Tiles: container element, the TOC tiles are correctly suppressed/hidden in the output, but the search function won't display search results.

Details

Output Preset: Frameless
Skin: Orange
- Home Page / Search Results / container
  - Float: Select
  - Clear: Select
  - Position: Select
  - Display: block
- Home Page / TOC Tiles / container
  - Float: Select
  - Clear: Select
  - Position: Select
  - Display: Select

Generate, perform search. Search results display over (or replace) the TOC tiles container, and push my home page topic to the end of the results list. I'm okay with my home page topic gettng pushed down to the end of the search results.

Edit the above configuration and change one thing:

Skin: Orange
- Home Page / Search Results / container
  - Float: Select
  - Clear: Select
  - Position: Select
  - Display: block
- Home Page / TOC Tiles / container
  - Float: Select
  - Clear: Select
  - Position: Select
  - Display: None

Generate. Home page correctly loads, TOC tiles are suppressed, and my home page topic is the only home page content displayed. Type a known-good search term and click search icon or press Enter. Nothing. No search results.

So how do I configure the home page to never display the TOC tiles container, but display the Search Results container when an end-user performs a search?

New UI

This topic has been closed for replies.

R

RoboFanAuthor

Inspiring

Peter,

Thank you! Your advice got me half-way there. The TOC tiles were suppressed and search worked, but I still had a big blank space between the bottom of the header container (with search box) and the top of my custom home page topic. So much so, that it pushed my home page topic down below the visible area in the web browser (when viewing the compiled/generated output). As a result, users would have to scroll down to view the home page. None of the RoboHelp output (skin) settings were able to resolve this. Instead, I had to manually edit min-height and padding settings under .RH-LAYOUT-HOMEPAGE-TOC-container (starting on line 1218) in layout.css of my output.

Here are the default settings:

.RH-LAYOUT-HOMEPAGE-TOC-container {
flex-grow: 1;
min-height: calc(100% - 29rem);
padding: 3rem 5rem;
}

Here are my corrected/edited settings:

.RH-LAYOUT-HOMEPAGE-TOC-container {
flex-grow: 1;
min-height: 1%;
padding: 1rem 1rem;
}

IMPORTANT: The above corrections in layout.css get overwritten each time you build/compile/generate the output - so you'll need to perform this change after building/compiling/generating your output every time.

Hopefully, Adobe gets this issue resolved in update 11.

Vivek Kumar

Adobe Employee

We will take it up to fix in Update 11.

But correct way to customize the CSS is to put it in layoutDiff.css which you will find in the skin folder. This css file is designed for such changes only.

Peter Grainge

Community Expert

The wrong field is being referenced in the code. Restore TOC Tiles > Container > Display to Select and go to TOC Tiles > toc-list and set that to None. The search then works.

This has been noted for the next update so check your settings again after Update 11.

www.grainge.org

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

R

RoboFanAuthor

Inspiring

Peter,

I can confirm. I created a new, blank project as well. Tried both Oceanic skin and Orange skin with frameless output. The result was the same. I would appreciate further inquiries. Too, if there's a code workaround - such as manually editing the layout.css, or some other text-based system/project/output file, I'm game for using that until Adobe can get a true fix deployed.

Thank you for looking into this!

Peter Grainge

Community Expert

I think the problem can be created more simply. I created a new project using the Orange skin and generated an output. The search worked.

Then I went to TOC Tiles > Container and set Display to None. The search fails. It doesn't seem to be anything to do with your use of your own home page.

If you can just confirm you get the same with a clean project, I will make further enquiries.

www.grainge.org

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

R

RoboFanAuthor

Inspiring

It is as though the Search Results container is inheriting the TOC Tile container's "display: none" setting.

R

RoboFanAuthor

Inspiring

R

RoboFanAuthor

Inspiring

Correct. And I have that set and it's displayed below the TOC Tiles. However, I don't want the TOC tiles to display. So I can set the TOC Tiles container to not display. And everything looks good in my output until I go to run a search from the home page - at which point I get no search results.

Peter Grainge

Community Expert

I'm not sure I have followed but you seemed to be saying you want your own topic as the home page. Browsing to it here is supposed to let you choose your own home page.