How to hide prefixes in widgets ?

[rigarus99]

I would like to hide the prefixes from my resources on some widgets like top resources, latest reviews and latest resources.
Other nice thing to have would be hiding specific prefixes. This would be much greater for me because i modifyd one specific prefix that is sitting on top and is much biger as the other ones. A top prefix for the resource view.

Here an example:

And the problem now is that the pro prefix is also big on my widgets and its waaay to big.
I would like to have it small in the widgets or remove it.

So there are some ideas/ways i think


1. Hide all prefixes in specific widgets
2. Hide one specific prefix in all widgets
3. Just make the prefix on the resource big and not on the widgets but idk how to do that :/






Any ideas how to handle that ?

 

[jim]

To hide prefixes in specific widgets I'll do this.

Right-click on the prefix you want to hide and get the element.

Now you'll need to copy the selector. (You can manipulate elements using javascript as well, i'll show how to do that next)

Once you have copied the selector go to extra.less or xfrm_overview it doesn't really matter.

Now paste in extra.less.

#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme {
    display: none;
}

If you want to do this in xfrm_overview you'll need to use the style tag.

<style>
#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme {
    display: none;
}
</style>

Here's the specific prefix hidden.

To do this with javascript, it's the same as above get the element and copy the js patch it's basically the same as copy selector.

Now you need to paste this into the page template it doesn't work in less templates.

<script>
document.getElementById("#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme").style.display = "none";
</script>

 

[rigarus99]

To hide prefixes in specific widgets I'll do this.

Right-click on the prefix you want to hide and get the element.

View attachment 28033

Now you'll need to copy the selector. (You can manipulate elements using javascript as well, i'll show how to do that next)

View attachment 28034


Once you have copied the selector go to extra.less or xfrm_overview it doesn't really matter.

Now paste in extra.less.

#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme {
    display: none;
}

If you want to do this in xfrm_overview you'll need to use the style tag.

<style>
#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme {
    display: none;
}
</style>

Here's the specific prefix hidden.

View attachment 28037



To do this with javascript, it's the same as above get the element and copy the js patch it's basically the same as copy selector.

View attachment 28035




Now you need to paste this into the page template it doesn't work in less templates.

<script>
document.getElementById("#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.label.label--pre-readme").style.display = "none";
</script>

jimI will try that later when i have time. Thank you so much for this !

 

[rigarus99]

It is not working
maybe i do something wrong.
i didnt have the menu like you when i rightclick on the prefix.
I need to open the Devtool (chrome) and then select the prefix.

Like that:

right click on the prefix line:

& when i copy the selector then i have copyd this:

#js-SideNavOcm > div:nth-child(2) > div > div:nth-child(3) > div > ul > li:nth-child(1) > div > div.contentRow-main.contentRow-main--close > a > span.prefixfree

this alone is not working.


and when i put it like that:

#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.prefixfree {
display: none;
}


It hides all prefixes on all positions on my site.
So i think there is something not right

 

[jim]

It is not working
maybe i do something wrong.
i didnt have the menu like you when i rightclick on the prefix.
I need to open the Devtool (chrome) and then select the prefix.

Like that:
View attachment 28038




right click on the prefix line:
View attachment 28039


& when i copy the selector then i have copyd this:

#js-SideNavOcm > div:nth-child(2) > div > div:nth-child(3) > div > ul > li:nth-child(1) > div > div.contentRow-main.contentRow-main--close > a > span.prefixfree

this alone is not working.


and when i put it like that:

#js-SideNavOcm > div.uix_sidebar--scroller.is_stuck > div:nth-child(2) > div > div:nth-child(2) > div > ul > li:nth-child(3) > div > div.contentRow-main.contentRow-main--close > a > span.prefixfree {
display: none;
}


It hides all prefixes on all positions on my site.
So i think there is something not right

r4z0rknownCan I inspect the page myself? I'd like to see it for myself.