Current status of the Ning Platform is always available on the Ning Status Blog.

Forum

This tip is to show how you can the boring old gray options drop down list into something with a little more colour. You can change the setting to fit your site in the code.

Key

.optionsDropdown-list background color: this is the colour for the list itself

.optionsDropdown a background color: this is for each of the links

.optionsDropdown-button background color: this is for the options button

color: this is the text colour

Here is an example

First we need just to add a small bit of custom code for the events page, this code goes in your site&pages custom code

<script>
// Add Class to events detail page
x$(document).ready(function(){
x$('.eventDetailPage').closest('body').addClass('eventDetail');
});
</script>

Next is all the css for the colour changes, this goes in your design studio custom css

/* Profile Settings for the options drop down box and list And Events detail page drop down list */
.profileCoverArea-actions .optionsDropdown-button, .eventDetail .content-actions .optionsDropdown-button {
 background-color: #d1e0f8;
 }
.profileCoverArea-actions .optionsDropdown a, .eventDetail .content-actions .optionsDropdown a{
 padding: 6px 8px;border-radius:4px; color:black;
 }
.profileCoverArea-actions .optionsDropdown a:hover, .eventDetail .content-actions .optionsDropdown a:hover{
 text-decoration:none; background-color:royalblue; color:white;
 }
.profileCoverArea-actions .optionsDropdown-featureButton.feature-button.is-selected, .eventDetail .optionsDropdown-featureButton.feature-button.is-selected{
 background-color:darkblue;color:white; border-radius:4px;
 }
.profileCoverArea-actions .optionsDropdown-list, .eventDetail .content-actions .optionsDropdown-list{
 background-color:#c9d3f2; border-radius:4px; box-shadow: 0px 8px 7px darkgray;
 }

You need to be a member of Ning Creators Network to add comments!

Join Ning Creators Network

Email me when people reply –

Search the Creators Network

Latest Activity

Kos replied to Michele Mickey Crawford-Carnegie's discussion Migrate blogs, members, pictures from Ning to WordPress
"Michele You need to upload Buddypress to your WP site - and there you will find the 'upload' option…"
15 minutes ago
Matt replied to Michele Mickey Crawford-Carnegie's discussion Migrate blogs, members, pictures from Ning to WordPress
"This might be a option if you have the funds.
https://www.buddyboss.com/ning-to-buddypress/"
45 minutes ago
Erika Hoff Holmgren replied to Erika Hoff Holmgren's discussion How do I edit my opening posts on the forum? Sticky options?
"OH, I finally realized what my problem was. I had managed to hide the buttons under my menu =u=; It…"
1 hour ago
Bizz ( John ) replied to Bizz ( John )'s discussion Video Issues Again For Embed Videos Showing Blank Box
"Well I do believe this has been fixed now. Just added a video via an embed from youtube and the ima…"
15 hours ago
Bizz ( John ) replied to Bizz ( John )'s discussion Videos Playing In Activity Feed, check it out on my site ( Updated: 25-04-17 )
"Thanks, will share it once I get a few little options finished like adding it's own comment contain…"
16 hours ago
⚡JFarrow⌁ replied to Bizz ( John )'s discussion Videos Playing In Activity Feed, check it out on my site ( Updated: 25-04-17 )
"Wow that is killer Jon!  How did you do that?"
17 hours ago
Bizz ( John ) replied to Erika Hoff Holmgren's discussion How do I edit my opening posts on the forum? Sticky options?
"To edit a post you first open it then in the top right before the +icon you will see a pencil icon,…"
19 hours ago
Ning via Facebook

#NINGread Blogging is an extremely inspiring activity, especially when you can make a buck with…

Kos replied to Thisisbully's discussion Chat is available on 3.0
"Well thank goodness for updating the servers b/c it worked perfectly all day.  I'm sooo happy!  Tha…"
yesterday
Kyryl_Ning_Support replied to Thisisbully's discussion Chat is available on 3.0
"Hi there,
Only the server part has been updated by the admins so the performance could have increas…"
yesterday
Solveig Parekh Bock is now a member of Ning Creators Network
yesterday
Steve C replied to Anastasiia_NING support's discussion Ning 2Q 2017 plan!
"Thank you! That's how it was from 2009 to recently, but the system must have reset it and I forgot…"
yesterday
Bizz ( John ) replied to Bizz ( John )'s discussion Video Issues Again For Embed Videos Showing Blank Box
"When is this going to be fixed? Been a while now as it's not just the image not displaying ( by the…"
yesterday
Kos replied to Thisisbully's discussion Chat is available on 3.0
"Kryrl I could be speaking too soon (hope not!) but it appears someone did something b/c Chat is now…"
yesterday
Kyryl_Ning_Support replied to Anastasiia_NING support's discussion Ning 2Q 2017 plan!
"Hi Steve,
We are sorry to hear that you are experiencing such an issue but you can control the orde…"
Monday
Kyryl_Ning_Support replied to Ian's discussion Side Backgound Image keeps shrinking and orienting left & animated gif header isn't working
"Hi there,
We are sorry for the inconveniences, and yes you are right this issue isn't connected wit…"
Monday
Oleksii is now a member of Ning Creators Network
Monday
Steve C replied to Anastasiia_NING support's discussion Ning 2Q 2017 plan!
"I'm having a HUGE problem with blog comments on my Ning 2 site. It used to be that blog comments po…"
Monday
Ning via Facebook

#inspirewithNING #success Explore new horizons with NING and NING Creators Network! Find your…

Bizz ( John ) replied to Bizz ( John )'s discussion Videos Playing In Activity Feed, check it out on my site ( Updated: 25-04-17 )
"Would be interested to hear if anyone has tried this and encountered any problems. Works fine for m…"
Friday
More…