• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers

How to hide or disable buttons on home page

Contributor ,
Dec 21, 2021 Dec 21, 2021

Copy link to clipboard

Copied

Hi Everyone.

 

We don't want the buttons of our skin to appear on the home page. I've looked all over the skin editor (see screenshot). But I don't see any way to hide or disable the buttons.

 

Is there any way to do this?

 

Thank you!

 

SCREENSHOT:

martinl83372021_0-1640120238922.png

 

 

Views

295

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

correct answers 1 Correct answer

Community Expert , Dec 21, 2021 Dec 21, 2021

I don't have RH2020 right now, but check there isn't anything in the Output Preset (unlikely but worth checking) or on the Skin > Layout tab.

 

Assuming nothing there, try selecting "button-x", expanding Layout and setting Display to 'none'. (Working off screenshots and guesswork - hopefully reasonably accurate guesses 😛  )

Likes

Translate

Translate
Community Expert ,
Dec 21, 2021 Dec 21, 2021

Copy link to clipboard

Copied

I don't have RH2020 right now, but check there isn't anything in the Output Preset (unlikely but worth checking) or on the Skin > Layout tab.

 

Assuming nothing there, try selecting "button-x", expanding Layout and setting Display to 'none'. (Working off screenshots and guesswork - hopefully reasonably accurate guesses 😛  )

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
Advisor ,
Dec 21, 2021 Dec 21, 2021

Copy link to clipboard

Copied

I think you're getting close, Martin. Try this.

The idea is to delete the default button images in the template under the Skin Editor Home Page tab.

For example:

Open Home Page  > Buttons > button-icon (under button-1-applied)

From the right, scroll down to the Background section > Image Path and delete the homepage-bookmarks.svg graphic, 

homepage-bookmarks-applied.svg, etc. and continue for each Home Page default Image.

Click Save. Create an Output Preset and specify the newly edited Skin. Generate and test.

Here are before and after screen shots.

Oceanic-No-Home-Page-Buttons-Skin-Editor.jpg

Here is the generated Home Page after editing the Skin.

Oceanic-No-Home-Page-Buttons-Generated-Output.jpg

 

 

John Daigle
Adobe Certified RoboHelp and Captivate Instructor
Newport, Oregon

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 Expert ,
Dec 21, 2021 Dec 21, 2021

Copy link to clipboard

Copied

@johndaigle do you have some time to try out my suggestion using button-1 as an example? (I don't currently have access to RH2020.) If it works it will get around a problem I remember being mentioned, where the link still exists and is clickable, you just can't see it without hovering the mouse over it.

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 Expert ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

@johndaigle's solution will work but I think the area will still be clickable. What @Amebr is referring to is this option.

 

image.png

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

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

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
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Thank you, Amber, John, and Peter.

 

I've gone with Amber's solution b/c I don't want the area to be clickable. So I'm glad you all have given me solutions for both hiding and removing. Thank you!

 

What's left now is the filter:

 

martinl83372021_0-1640184743488.png

 

Can you please tell me how to do two things with the filter:

 

  1. How to remove the filter
  2. How to adjust the filter's appearance (in case we decide to keep the filter on the home page)

 

If we keep it, we'll want the text to show better on this dark background.

 

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
community guidelines
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

PS:  Here's a question related to John's solution. John's solution involves deleting the graphics file from the button (Background section > Image Path and delete the homepage-bookmarks.svg graphic, homepage-bookmarks-applied.svg).  Where do we get those graphics, such as the "homepage-bookmarks-applied.svg"?  

 

Is there a library of these graphics files somewhere? I ask in case we need to change the graphic or icon, for a dark vs. light background, for example?

 

Thanks!

 

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
Advisor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Thanks to Amber and Peter for their enhancements. Deleting references to the images and selecting "none" as Amber suggests works for me and I find no clickable ghost links :-).

I'm enroute to family holiday gatherings now, but here is a screenshot of what I think you want for Font color change should you elect to include Favorites and/or Filters in a different scheme. I changed all the Font color for all the buttons as a test (with magenta!) and it works for me.

Font Color Home Page Buttons.jpg

I have to ring off now, but you may also want to take a look at this online help page with a bit (not enough) documentation on the Skin Editor. https://helpx.adobe.com/robohelp/using/frameless-skin-editor.html

 

Thanks and Happy Holidays.

john

John Daigle
Adobe Certified RoboHelp and Captivate Instructor
Newport, Oregon

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
Advisor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

One more thing. I noticed that on occasion, the Skin Editor can be contrary and replace default button graphics after having deleted them and saved them. So be aware of that in case a gremlin creeps in.

John Daigle
Adobe Certified RoboHelp and Captivate Instructor
Newport, Oregon

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 Expert ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

If you delete it from the skin settings, to the best of my knowledge the image remains in the skins folder in your project, it simply isn't used.

 

Use a good search tool on your local drives to find instances of such files.

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

 

 

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

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
Advisor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Right, Peter. For me and my test project, "No_Home_buttons", I found the ingredients here:

C:\Users\daigl\Documents\My RoboHelp Projects\No_Home_buttons\publish\skins

Warning though. SVG graphics are cool but not very friendly for viewing in File Explorer. It's an acquired taste 🙂 and a deeper understanding of CSS and even Javascript is required if you really want to trick out your Skins.

 

John Daigle
Adobe Certified RoboHelp and Captivate Instructor
Newport, Oregon

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 Expert ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

@johndaigle No Home Buttons is the name of your project and skins is where the images in question are in your project. That's what I was pointing to.

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

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

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
Explorer ,
Jan 24, 2022 Jan 24, 2022

Copy link to clipboard

Copied

"Warning though. SVG graphics are cool but not very friendly for viewing in File Explorer."

 

Tip to that issue:
Just search, download for free, and install "PowerToys" for Windows. 
All the nice SVG files are getting their preview while you view the content in any folder.

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
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Thanks, again, for all your help, Everyone.

 

I think I might have a unique situation:  Neither of the button controls (button-1, button-2) corresponds to my Filter. 

 

  • Button-1 corresponds to Favorites (Screenshot 1)
  • Button-2 does not correspond to Filter.
    • I've changed the font color to pink, but the change does not show up in either the Preview (Screenshot 2) or the generated output (Screenshot 3).

 

NOTE:  I have a vague memory of changing the sequence of the button controls. I don't remember why. Notice that, of the two buttons (Filter, Favorites), Button-1 controls the one on the right. Wouldn't a stock skin editor assign Button-1 to the one on the left?

 

SCREENSHOT 1

martinl83372021_0-1640196380476.png

 

SCREENSHOT 2 (skin preview)

martinl83372021_1-1640196437670.png

 

SCREENSHOT 3 (output in browser)

martinl83372021_3-1640196592657.png

 

 

 

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
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Hi, again, Everyone.

 

I've remembered something hugely important. Early on, I felt I wanted the filter on the home page. (The default skin has two home page buttons, neither of which is the filter.) At that time I found a way to replace Button-2 with the filter on the home page. But I have no idea how I did that.

 

My current need is simply to control the filter on the home page -- change its font color or delete the filter if we decided we no longer want it. However, the button-2 controls do not affect the filter in any way.

 

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
community guidelines
Community Expert ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

In a new orange skin, button 2 is the filter. If you click on it in the settings, the filter image is highlighted. If you have somehow changed things and can't remember how yourself, I don't think we have much chance. 🙂

 

image.png

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

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

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
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Oh, you're right, Peter, a fresh Oceanic also has the filter as Button 2.

 

I hear you re. not having much chance if I can't remember what I did. Do you think Adobe Tech Support would have any chance?

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 Expert ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

Click on button 1 and then button 2. What do they highlight in the skin editor? 

 

I can't see how Support have any more chance of knowing what you did but the might be able to get those settings back to default. 

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

Help others by clicking Correct Answer or Like if helpful. Found your answer elsewhere? Share it here.

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
Contributor ,
Dec 22, 2021 Dec 22, 2021

Copy link to clipboard

Copied

When I click Button-1, Favorites gets highlighted.

 

When I click Button-2, nothing gets highlighted.

 

Thanks for that -- I'll ask Adobe Support if they can return the buttons to default settings.

 

John, thank you for the link to the Skin Editor Documentation.

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 Expert ,
Jan 24, 2022 Jan 24, 2022

Copy link to clipboard

Copied

If you use the developer tools to inspect the output you should be able to find out what style of the Favourites button is. For example, maybe it's button-3, but for whatever reason the skin editor has gotten confused. Theoretically then you would add the correct name back in the skin editor and you'd be good to go.

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
Contributor ,
Jan 25, 2022 Jan 25, 2022

Copy link to clipboard

Copied

Hi Amber.

 

Thanks so much for this!! I understand your instruction.

 

But here's what the developer tools show. Can you please help me understand what we're looking at -- and how it correlates to Skin Editor controls?

 

martinl83372021_0-1643117776524.png

 

ENLARGED:

 

martinl83372021_1-1643117895062.png

 

ENLARGED:

 

martinl83372021_2-1643117950401.png

 

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
community guidelines
Community Expert ,
Jan 26, 2022 Jan 26, 2022

Copy link to clipboard

Copied

In the output, right-click on the filter icon and select Inspect. The relevant code for the icon will be selected in the developer tools. If a div tag is selected, check the class for "button-x". If a div isn't selected, look for its parent div and that should have a class that includes "button-x" (button-0, button-1, etc). That's the button style you could try adding to the skin.

 

If you're still unsure or can't see anything that looks right, post another screenshot like your first one with the dev tools window. (Sorry, it can be hard to be precise with the dev tools, depending on what people click on and different outputs and versions of RH. 🙂 )

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
Contributor ,
Jan 27, 2022 Jan 27, 2022

Copy link to clipboard

Copied

Thank you, Amber.

 

Here are two screenshots, below.

 

  1. What the filter button looks like
  2. The dev tools after I right-click the filter and select Inspect

 

Can you make anything of them?  Should I open either of the drop-downs in the dev tools and show you the contents?

 

Thank you!

 

SCREENSHOT 1

martinl83372021_0-1643306560611.png

 

SCREENSHOT 2

martinl83372021_1-1643306823927.png

 

 

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
Contributor ,
Jan 27, 2022 Jan 27, 2022

Copy link to clipboard

Copied

Ah! Here might be something! 

 

While still in the dev tools, I right-clicked the favorites icon. The gray highlight focused on code for that icon. 

 

But then I hovered over other lines of code. And voila! The light-blue highlight focused on the filter area (in the preview, it's the dashed lines.)

 

Does that tell you anything?

 

martinl83372021_0-1643307400177.png

 

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
Contributor ,
Jan 27, 2022 Jan 27, 2022

Copy link to clipboard

Copied

One more screenshot:

 

martinl83372021_0-1643307836006.png

 

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