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

Fluid profileCoverArea img  click here to see it live

The best size for the image to keep it high quality is
1000 x 300 px

/*! GEOCOMs Fluid profileCoverArea img  */
/*! Design studio CSS section */
@media screen and (min-width:482px)  {
DIV.banner-frame.profileCoverArea-frame.cf{
 max-width: 1400px!important;
 left:0px!important;
 right:0px!important;
 margin-left:auto!important;
 margin-right:auto!important;   }
DIV.banner-header.profileCoverArea {
 height: 0!important;      
 background-size: 100% 100%!important;
 padding-bottom: 30%!important;} }

Fluid group Header img click here to see it live

The best size for the image to keep it high quality is
1000 x 200 px

/* GEOCOM's Fluid group Header img */
/*! Design studio CSS section */
BODY.page-groups DIV.banner-header.groupHeader.groupHeader-coverPhoto,
BODY.page-group DIV.banner-header.groupHeader.groupHeader-coverPhoto {
   background-size: 100% 100%!important;
   padding-bottom: 20%!important;
   height: 0!important; }

@media screen and (max-width:687px)  {
BODY.page-groups DIV.groupHeader-image,
BODY.page-group DIV.groupHeader-image{
   display:none!important;   }
BODY.page-groups DIV.banner-box,    
BODY.page-groups DIV.banner-box.banner-overlay,
BODY.page-group DIV.banner-box,    
BODY.page-group DIV.banner-box.banner-overlay{
   text-align: left; }}

@media screen and (max-width:482px)  {
BODY.page-groups DIV.banner-box.banner-overlay,
BODY.page-group DIV.banner-box.banner-overlay{
   padding: 0px!important;  
   padding-bottom: 15%!important;     } }

@media screen and (min-width:687px)  {
BODY.page-groups DIV.banner-frame,
BODY.page-group DIV.banner-frame {
   max-width: 1100px!important;
   left:0px!important;
   right:0px!important;
   margin-left:auto!important;
   margin-right:auto!important; } }

Fluid network header image click here to see it live

The best size for the image to keep it high quality is
1500 x 400 or 960 x 300

In the code below replace the background-image link "http://www.your.image" with your image link.

/*! GEOCOMs Fluid network header img  */
/*! Design studio CSS section */
HEADER.site-headerFrame {
background-image: url("http://www.your.image") !important;
 background-size: 100% 100%!important;
 width: 100%!important;
 padding-bottom: 27%!important;
 height: 0!important;}

Fluid Social Channels Video player click here to see it live

On the example page I have the max with of the video set to 1000px instead of 750px

You can change the size of the video by changing the 750px in the CSS line of code

<!-- Start GEOCOMs Fluid Social Channels Video player  -->
<!-- Custom Code - HEAD Code box -->
<link rel="stylesheet" type="text/css" href="https://storage.ning.com/topology/rest/1.0/file/get/963872720?profile=original" />
<!-- End Fluid Social Channels Video player -->


/*! GEOCOMs Social Channel Video  set max width */
/*! Design studio CSS section */
DIV.feedListPagePlayer-source {
     max-width:750px!important; }

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

Join Ning Creators Social Network

Votes: 0
Email me when people reply –

Replies

  • Thank you so much George for sharing this code, Fantastic :-)  I'm always amazed with what you come up with :-)

    I love the codes and thank you again and Merry Christmas from us all in Australia.

    3238121?profile=original

    • Thank you Dave. :-) Merry Christmas from all of us in the United States. :-)

  • NC for Hire

    nice work George.... happy holidays buddy~

    • Thank you, JF :-) I hope you have a happy holiday as well..

  • Hi George

    Hope you are doing well  ,  Please can you do this for my N 3 , Thank you so much :D 

    • Hello Mary :-) okay, they're all on your network. :-)

      • Hello there George

        Thank you so much your a star as all ways :D 

        • Thank you, Mary. I hope you have a wonderful new year. :-)

  • Updated,,, I've added a code to make the Social Channels player Fluid

    • Awesome George. It is amazing how quickly you have made many projects happen. Thanks my friend and hope you have a Happy New Year.

      Blessings

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

LEO Mobile App Builder updated their profile
Tuesday
Aase Lillian replied to Aase Lillian's discussion
Community - activity page
"Ok, thank you. Please send me details as I have no idea on how to do it. "
Mar 19
Aase Lillian and ⚡JFarrow⌁ are now friends
NC for Hire
Mar 19
⚡JFarrow⌁ updated their profile photo
Mar 18
⚡JFarrow⌁ replied to Aase Lillian's discussion
Community - activity page
"Yes you can add emojis to your community pretty much anywhere you like.
If you need some help…"
Mar 18
Aase Lillian updated their profile
Mar 18
Aase Lillian posted a discussion
Hi all. Is it possible to add emojis to the community? I also wish the activity page to include…
Mar 18
Donna MacShoe updated their profile photo
Mar 6
Adul Rodri is now friends with ANGE.L LUAR and Margarida Maria Madruga
Feb 14
Shweta Sharma updated their profile
Jan 26
catherine martin updated their profile
Jan 16
Donna MacShoe updated their profile photo
Jan 15
More…

Meanwhile, you can check our social media channels