"TIP" let's add styles and animation FX's to your main page blogs, events, latest activity and a whole lot more

[George H. Compton IV]

I put it into a stylesheet because of the amount of code it takes to do this.  So it's really easy to add and remove from your NC custom code box

If you'd like to view the Codes in The stylesheet just click here

just add this code to the top of your NC custom code box.

<link rel="stylesheet" type="text/css" href="http://api.ning.com:80/files/HXLvFMxAKuyPQOGcM0VWmoI89uFoZpwLi9nKLm*sn3NXhTu5yYLg5dSQ8COCNrrZ8wQch4NZIoQKcn5tHeIafTLx8To6j2Ij/style_GC_main_page.css" />

 

Remember everyone results may vary because of the differences in Ning networks.

This was tested and design on a Ning pro account.

If you would like me to change anything in this code or remove anything for you just ask I'll be more than happy to help

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

instead of using this stylesheet I recommend my new Discussion

"TIP" "style_GC_whole_network.css" Version 5 it adds styles and ani...

Posted by George H. Compton IV on September 9, 2012

it's a lot more compatible than this version.  For the most part it has all the codes From this discussion plus all the fixes, compatibility and color code changes + a whole lot more Animations and FX's for your network.

 

[Aanu Bello]

this man brings great tips every 5munite. lolz

[George H. Compton IV]

Awww thank you Aanu

I see you've done a lot of work on your network today..  it's looking great!! :-)

[solo]

nice tip..but it cuts off half the video in the latest activity feed..or i should say it reduces the size of video by 75% any fix for that...heres the link to show what im talking about

[Aanu Bello]

how can we change the bg color from blue to any other color?????????????????????

[George H. Compton IV]

okay put this code at the bottom of your NC custom code box. I've already changed the color for you I'd know what color you wanted LOL :-)

<style>

.xg_widget_main_index_index DIV.xg_module.module_groups LI.xg_lightborder:hover{background-color:black!important;}

</style>

[Aanu Bello]

thanks that worked only for side models and not for latest activities. i mean status

[George H. Compton IV]

I've already gone to your network and fix that for you :-)

[Paul Crane]

Hello George,

            I was trying to get the color of the blogs and forums changed to light blue besides purple.Is there a code I can use to change this. I love this option, just wanted to get the color changed. Thanks

[George H. Compton IV]

of course I can help :) really it's a dark blue but with your background color it just appears purple LOL

in these codes just change the word transparent to any color you want.

this code will change the group's mouse hover color

DIV.xg_module.module_groups LI.xg_lightborder:hover{
   background-color:transparent!important;}

These three codes will change the activity feed colors

.xg_module_activity .feed-story-status .status-update:hover{
   background-color:Transparent !important; }
   
   
.xg_module_activity .feed-story-status .status-update{
   background-color:Transparent !important; }

.xg_module_activity SPAN.comments-number {
   background-color:transparent !important; }

This code will change The forum Mouse hover color

.xg_widget_main .module_forum div.vcard div.topic:hover{
   background-color: transparent!important;}

and this one will change the color of the blogpost mouse hover Color

.xg_widget_main_index_index .module_blog .blogpost:hover{
   background-color:transparent !important; }

And this code will change the red continue button

.xg_widget_main_index_index A.xj_expandable {
   background:transparent !important;}

I believe that's all the major colors there are in the stylesheet

you have a great day enjoy the Codes

[George H. Compton IV]

    of course I can help :) in these codes just change the word transparent to any color you want.

    this code will change the group's mouse hover color

    DIV.xg_module.module_groups LI.xg_lightborder:hover{
       background-color:transparent!important;}

    These three codes will change the activity feed colors

    .xg_module_activity .feed-story-status .status-update:hover{
       background-color:Transparent !important; }
       
       
    .xg_module_activity .feed-story-status .status-update{
       background-color:Transparent !important; }

    .xg_module_activity SPAN.comments-number {
       background-color:transparent !important; }

    This code will change The forum Mouse hover color

    .xg_widget_main .module_forum div.vcard div.topic:hover{
       background-color: transparent!important;}

    and this one will change the color of the blogpost mouse hover Color

    .xg_widget_main_index_index .module_blog .blogpost:hover{
       background-color:transparent !important; }

    And this code will change the red continue button

    .xg_widget_main_index_index A.xj_expandable {
       background:transparent !important;}

    I believe that's all the major colors there are in the stylesheet

    you have a great day enjoy the Codes

[solo]

I forgot to mentioned that.the network is a little wider than most ning networks

[George H. Compton IV]

I have fixed that part of the code and added a little padding in a couple other spots.  Try it again it should work perfectly for you now :-)