Hmm bit of a hard title to describe this but let me explain
So far as I can tell we have a list of achievements from 1 to 9 but if you only want certain ones to show you still have to have them all show as you cannot pick and choose which ones you want. For example I may want them all to show except for Polls as I don't use them but to get the others to show after it I still have to have the polls show up.
So here is some css which will allow you to pick the ones you want to show up. So how it works is we are going to target the divs which hold the achievements we want to remove ( NOTE: As there is a div which hold the count of points it counts in the list so we have to add 1 to the div we want to remove
Here is the list of achievements
As you can see the Poll One is number six in the list so six + 1 =7 and 7 is the number we add into the line of css like this
.mrs-listAchievement .mrs-listColumn:nth-of-type(7){ display: none }
That will remove that one from our list and the others below will still show up. Now you can pick and choose which you want to display by simply adding more lines into the css. So for example suppose I want to remove the new comment one as well, so we can add into our code that line which is number 3 + 1 =4 so that will look like this in the code ( not the comma at the end of the fist line, we use a comma to add multiple lines to one method of css. You can write each line individually if you want also )
.mrs-listAchievement .mrs-listColumn:nth-of-type(4),
.mrs-listAchievement .mrs-listColumn:nth-of-type(7){
display: none }
or you can write it like this, which ever you prefer
.mrs-listAchievement .mrs-listColumn:nth-of-type(4){ display: none }
.mrs-listAchievement .mrs-listColumn:nth-of-type(7){ display: none }
So there you go, how to display only the ones you want to show up. To have them show up again just remove the line off css for the ones you want to show up again.
Replies