Forum Discussion

Jhansi_k's avatar
Jhansi_k
Adept
6 years ago

how to hide a button in standard component?

Hi, We need to hide a button in standard component, Since we do not have access to standard component code, I couldn't change or modify the existing standard page. Is there anyway that I can hide th...
  • Tarun's avatar
    Tarun
    6 years ago

    Hi Jhansi_k 

    Please try adding the following CSS

    .lia-button.lia-button-primary.create-support-link{

    display:none;

    }

    If you find my post useful please Give Kudos or if this is the required solution please mark it asaccept as solution

    Hope this helps!!!🙂

    Regards

    Tarun Kumar

Tarun's avatar
Tarun
Maven

Hi Jhansi_k ,

You can hide the button in following ways

1. If it is a functional button then you can just go to Admin section and deny permissions for users to use that functionality.

Eg. you don't want users to post in a particular board/ category you can go to Admin settings and deny their permission to post, this will hide the button or make it disabled.

2. You can simply remove that button from the quilt of that page if you have access to the quilt.

3.If you don't have any permission to disable or you don't have access to page quilt to remove standard button component from page, you can also hide it with styling.

To add styling just go to studio>community style>select the required skin> add the required SCSS or css to hide the button.

Hope this helps.

If you find my post useful please Give Kudos or if this is the required solution please mark it as accept as solution

Regards

Tarun kumar

Jhansi_k's avatar
Jhansi_k
Adept
6 years ago

Hi Tarun, thanks for your quick response.

I do not have access to quilt, I do need to add some css styles in the active skins.

We are using the standard search component (crmsupport.widget.crm-support-cases-tabs) for our custom community portal. 

Of course I don' t have access to the id or class selectors that are used for the input box of the standard search component, so I use the browser inspect mode to find the selectors. When inspecting the element that I need to hide,Chrome inspector gives me this selector, in the below code I need to hide the create support case button.

<div class="lia-button-group">

<span class="lia-button-wrapper lia-button-wrapper-primary">

<a class="lia-button lia-button-primary create-support-link" id="link_8" href="/t5/forums/postpage/board-id/%40support"><span>Create Support Case</span></a></span>

</div>

 

 

How do I reference (select) the input element in my CSS skin file based on the above? 

 

in the active skin I added the below CSS:

select[id="link_8"]{
visibility: hidden;
display:none;
}

But it did not work, I'm not sure how to reference to the standard component from one of the  active skins.

Could you help me on this