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

Replies

  • There is a way of doing it by using an add content html box and a little code to load the groups so you are not limited to the 20 display. If you look at my home page I have added this and also added some test groups so I get the 21. I will give you do instructions below but we may need to add some more css as so we can get the sizes right so we can get it looking like the list you had before.

    Here you can see my example of loading the 21 groups: https://jr-images.ning.com/

    Well here is how to add the group list to start off with.

    First go to your social site builder and add an Add Content HTML BOX To Your Home Page

    9004895699?profile=RESIZE_584xKeep it as HTML content type

    Next we need to add some html for the groups list to load into

    9004896877?profile=RESIZE_710xOnce you have added the name you want click on the HTML button in the toolbar and add this line of code

    <div class="groupList">Groups Loading..</div>

    And it should now look like the image above

    At the bottom click the Save/Update button

    Next move the box where you want it on your home page and save the main homepage page.

    Next go to your Social Site Builder > Cstom Code > End Of Page Section and add this code to it and save

    ( I am presuming your groups is still called squadrons-and-commands, if not change that in the code to what your groups page is called )

    <script>
    x$(document).ready(function() {
    x$('.page-home .groupList').load('/squadrons-and-commands .groupHub .matrix');
    });
    </script>

    Now we just need a little css to remove some padding and markers that show as default and you add this to your design studio > custom css

    /** GROUPS LIST ON HOME PAGE CUSTOM LIST **/
    .groupList ul {
    list-style-type: none!important;
    padding-left:0px;
    }

    That's it all done, you should now see your groups load into that box, as I mentioned before it will show the default style of the groups list so we may need to tweak some css you already have to resize the groups etc as you had before.

     

    jr-images
    jr-images is a social network
    • Thanks Biz for the information.

      I have just one issue...I have no idea how to "Next go to your Social Site Builder > Cstom Code > End Of Page Section and add this code to it and save"

       

      • 9005248086?profile=RESIZE_930x

        • My social site manager page doesn't have even half of those options.

          9005379092?profile=RESIZE_930x

           

          • This is normally what an admin see's, only the network creator can see all the other options. You can check how you are logged in by clicking on members in the green bar then in the list look for your name, in the categories/roll it should say Network Creator, if it says admin then you will need to contact Ning as I presume you are the network creator. Did you sign into your network with your Ning account details ?

             

            • I'm just an administrator. I'll forward a link to this thread to the Network Creator and see if he can't add everything.

              Thanks!!

               

            • The Network Creator added everything, Now I guess it needs "tweaked" to make the new "Group" display properly like the old Group Hub displayed.

              Old Hub icons/fonts look like this:
              9005999670?profile=RESIZE_930xNew group icons/fonts look like this:

              9006000101?profile=RESIZE_930x

               

              • It suddenly dawned on me to copy the CSS that set all the parameters that made the original list appear correctly and so I renamed all the names from "groupHub" to "groupList" and that fixed the alignment and size issues in the new group when I pasted it into the Global CSS box in Design Studio>Custom CSS>Global CSS. The one thing doing that didn't do is change the font and color of the number of members text (I'm not even sure how it knows to show that infomation). Is there some additional CSS code that can change that?

                Also, I moved the old Content box for the Group hub to another column temporarily. Can it be deleted without causing a problem with the new content box?

                 

                • This css will change the font size and colou . Replace with the colours you want and also font size

                  .groupList .groupHub-groupInfo{ color: blue; font-size:10px }

                  Yes you can remove the old content box as it's not needed and will not affect the new one.

                  • Bizz,

                    Both I and our Network Creator thank you for all the help!! We now have all groups displaying in the proper format and colors!!

                     

This reply was deleted.
 

Some interesting articles related to community management, digital marketing etc. could be found in our digest. Don't hesitate to leave a feedback so we would know that we should continue :-)

Latest Activity

TJ @ jQueryHelp posted a discussion
Hi everyone! This is TJ, a Ning Apps developer for many years.  Looks like some Ning Creators are…
5 hours ago
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"thank you very much I come from the times of this site now I put the photo, it was hard to survive…"
yesterday
Bizz replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"To do a border without the ridge and using dots you would just write it like this
border:13px…"
yesterday
Steve C posted a discussion
 I want to put ads above individual groups.Jen showed me how to put text above forum categories…
Wednesday
Rosas † Negras replied to George H. Compton IV's discussion
(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"I don't use file manager for photos, so if it's a photo I'm not interested even if after I close…"
Wednesday
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"I agree with you, but I want it rounded, on the square it gives no problem,this is an impossible…"
Tuesday
Bizz replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"It's because you are using the ridge as a border, to create the ridge the border property adds the…"
Tuesday
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"I don't want to go below 13 px I know all would be ok but it's too logical"
Tuesday
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"#xg_masthead /*Top Image*/ {margin: auto;display: block;height:600px;width: auto…"
Tuesday
Bizz replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
" show the css you have used for the border"
Tuesday
Rosas † Negras posted a discussion
Tuesday
Anam replied to George H. Compton IV's discussion
(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"OH MY GOD!!!! :D :D :D It worked!!!
 
I am so pleased. Thank you Bizz and Rosas for your help. I…"
Tuesday
More…

Meanwhile, you can check our social media channels