Recent
Categories
View Replies (13)

How do I highlight a menu item?

  1. Issue
0
Votes
Undo
  1. Ko3n
    Ko3n
  3. Commercial Templates
  4. Wednesday, 15 July 2020
  5.  Subscribe via email
Hey Ciarán,

hope everything is fine with you in this difficult time ?!
Unfortunately, I have to torment you with a question :)
Is there a css code to highlight a menu item?

for example in your menu
Home – black
Browse Templates – black
Browse Extensions – black
Template Demos – black
Membership – black
Forum – red
Tutorials – black

Or somehow different. I just want to highlight one menu item.
I am currently using the Everly template but would be nice if the code would work on all templates.

Stay healthy,
Chris
Responses (13)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Chris

Sure. Each menu item can be targeted with CSS via the menu item ID. Would you have a URL to an example of your menu?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciarán,

Is meant on the following page: optimalpraesent.at

Do you mean --> Link Type --> Link Class?
But what code do I enter if I want a different color? I tried a few, but none worked :(

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Chris

To amend try adding the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS) where 138 is the ID number of your menu item (edit to taste)....

.hornav .item-138 > a {

    color: #e62c2c;

}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciarán,

I tried it and it works great! Thank you for your help! :D

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 4
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciaran,

The code no longer works with joomla 4.2.2, right?

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 5
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Chris

A possible cause is that the menu item ID (138) has changed with your update?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 6
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciaran,

unfortunately no. The id is correct.

You can find the access data in my site details if you want to check it out.

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 7
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Chris

Unfortunately, I am unable to locate your site details. Could I ask you to resend temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 8
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you Chris

Looking at your menu manager for your 'Main Menu', I am unable to see any menu item with the ID of 138 (right column). Maybe I am looking at the wrong menu?

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 9
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciaran,

The ID '138' was just one example of yours. I don't think I ever had an ID with that number :D

Just try one of the IDs from the 'Main Menu' (101, 110, 194 or 111). It doesn't work with any of the numbers, but I don't know why :(

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 10
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Chris

As some of your parent links are not links try the following instead which includes spans (spans) try...

(edit to taste)

.hornav .item-200 > span, 

.hornav > .item-200 a {

    color: red !important;

}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 11
Ko3n
Ko3n
Accepted Answer Pending Moderation
0
Votes
Undo
Hey Ciaran,

Unfortunately the code doesn't work, but to my shame I found another code that makes it work now. Please don't kill me because of this :p

Kindly,
Chris
  1. more than a month ago
  2. Commercial Templates
  3. # 12
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
All well that ends well :)... thank you for the udpate!

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 13
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!