The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Changing Background of New Messages Link

3 posters

Go down

Solved Changing Background of New Messages Link

Post by Mike June 15th 2015, 10:36 pm

I'm working on a really advanced theme design for forumotion, and there's one thing I can't figure out!

I'm trying to get the link on the navigation bar to have a background color on it when there's a new private message.

Is there a simple(ish) way to do this?


Last edited by Mike on June 16th 2015, 4:58 pm; edited 1 time in total
Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by brandon_g June 16th 2015, 12:00 am

Are you trying to use picture based navigation bars, or the standard?


Changing Background of New Messages Link Brando10
Remember to mark your topic Changing Background of New Messages Link Solved15 when a solution is found.
General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

Changing Background of New Messages Link Scre1476
Team Leader
Review Section Rules | Request A Review | Sticker Points
brandon_g
brandon_g
Manager
Manager

Male Posts : 10106
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by Mike June 16th 2015, 12:09 am

Standard Text Navigation.
Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by brandon_g June 16th 2015, 12:12 am

Not sure if it's possible to modify that. Though if it is, it would probably be with CSS. Smile


Changing Background of New Messages Link Brando10
Remember to mark your topic Changing Background of New Messages Link Solved15 when a solution is found.
General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

Changing Background of New Messages Link Scre1476
Team Leader
Review Section Rules | Request A Review | Sticker Points
brandon_g
brandon_g
Manager
Manager

Male Posts : 10106
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by Mike June 16th 2015, 12:34 am

brandon_g wrote:Not sure if it's possible to modify that. Though if it is, it would probably be with CSS. Smile

Thanks I wouldn't have guessed.... Very good Very good Very good

Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by Ange Tuteur June 16th 2015, 11:02 am

Hi @Mike,

You're using PunBB, correct ? Unfortunately that version lacks the .new-message classname for the link, like in phpbb3. You can however, add this class using JavaScript.
Modules > JavaScript codes management > new script

Placement : In all the pages
Code:
$(function() {
  var pm = document.getElementById('i_icon_mini_new_message'); // find the new message node
 
  // check existence before testing the parent node for digits
  if (pm && /\d+/.test(pm.parentNode.innerHTML)) {
    pm.parentNode.className += ' new-message'; // add a new classname to the link
  }
});

After this, you should be able to use CSS to style the link.
Code:
a.new-message {
  color:#F60 !important;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by Mike June 16th 2015, 4:57 pm

Ange Tuteur wrote:Hi @Mike,

You're using PunBB, correct ? Unfortunately that version lacks the .new-message classname for the link, like in phpbb3. You can however, add this class using JavaScript.
Modules > JavaScript codes management > new script

Placement : In all the pages
Code:
$(function() {
  var pm = document.getElementById('i_icon_mini_new_message'); // find the new message node
 
  // check existence before testing the parent node for digits
  if (pm && /\d+/.test(pm.parentNode.innerHTML)) {
    pm.parentNode.className += ' new-message'; // add a new classname to the link
  }
});

After this, you should be able to use CSS to style the link.
Code:
a.new-message {
  color:#F60 !important;
}

You are amazing. Thank you so much!
Mike
Mike
Hyperactive

Male Posts : 4255
Reputation : 471
Language : English, HTML, CSS
Location : Loveland, Colorado

Back to top Go down

Solved Re: Changing Background of New Messages Link

Post by Ange Tuteur June 16th 2015, 5:43 pm

You're welcome ^^

Topic archived

Have a nice day. Smile
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum