0

I'm creating a learning platform and I have a separate menu for different sections. What I'd like to do is mark these menu items once the unique registered user has seen it.

Like:

.menu-item li{
[basic-css-menu-style]
}
.menu-item li if $user_visited {
[checkmark-css-menu-style]
}

This is to show the user that they have completed the section. I don't want to restrict them from seeing the menu item again. Just add a style or a word/checkmark etc. to show they're done with a particular section, after visiting it. Any ideas?

|improve this question
1

This can be done with CSS. Get the class of the element in the menu item and add this css:

[class of the menu item]:visited {your own css}
|improve this answer
  • Hmm.. I'll play around with it. I can link the next section on a button, and then have it appear as anything other than :visited will be hidden. Thanks for that. Didn't think about it. I can easily do this by sectioning it off tediously. Like Section 1 (1 page, ~10 paginated), button to next section, different menu with marker on Section 1 to reveal status as viewed. But that's like.. so much repetition. – FlatText Apr 30 '17 at 18:14
  • If this question helped, could you please accept my answer? If not, do you have any questions? – Toufic Batache Apr 30 '17 at 19:04
  • Sorry it didn't really help. What I can do is make the menu hidden with display:none, then go to each individual item and do something like .page-id-1688.paged-2 #menu-aml #menu-item-1654 { display: block; } Problem is when I do this the menus will always look like that. What I'd like to do is make the menu completely visible once the registered user has gone through them all. – FlatText May 1 '17 at 11:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.