(TIP) Ning 2.0 responsive fullwidth network at any screen resolution. :O Cellphones to TV's ;)

[George H. Compton IV]

Updated 06-25-2020

All the features of Ning 2.0 with  Ning 3.0 responsiveness.. ;) This code has been updated. It'll work on any layout but it works the best with the (A) layouts ( layout A1 - A4)

Tested and working in all newer browsers IE 9, 10, 11 - Firefox - Google Chrome - Safari. for cell phones, Laptops, PCs, Macintosh and yes TVs....

The fullwidth portion of this code also works in IE 7, 8. for Laptops, PCs and TVs...

It's compatible with all operating systems...

Compatible hardware - cell phones, Laptops, PCs, Macintosh and yes TVs....

Most pages will fit on the smallest of cell phones but I recommend a screen resolution of 480 pixels and wider. But like I said most of the network will fit on screen resolutions of 250 pixels and greater.

With this code your N2 will pass Google developers, mobile friendly test, without using Nings mobile app.

click here to see it live on "The Constitutional Conservatives".

 

If anyone would like help setting this up I'll be more than happy to give you a hand.

GEOCOMs Ning 2.0 Responsive Fullwidth Network v5 part 1

Part 1 goes in your (ad-box above the header) Make sure you press the HTML button before inserting the code.

<meta name="viewport" content="width=device-width, initial-scale=1" ></meta><link rel="stylesheet" type="text/css" href="https://storage.ning.com/topology/rest/1.0/file/get/14338574?profile=original" id="N2_R_F_W_N_v5_P1" ></link>

   

Part 2 goes in your (custom code box)

The video enhancements come with my "profile text box video mod". To turn the mod on change the ID name in the video enhancement script from this  id  " id='gframe' " to this id   id='MOD_FN' ..

<!-- Start GEOCOMs Ning 2.0 responsive fullwidth network v6 part 2 -->
<script src="https://storage.ning.com/topology/rest/1.0/file/get/6335680082?profile=original" type="text/javascript"></script>
<!-- START Ning 2.0 Video enhancements -->
<script src="https://storage.ning.com/topology/rest/1.0/file/get/6359602678?profile=original" type="text/javascript" id='gframe' class="gf_helper" ></script>

 

Part 3 goes in your (design studio CSS session)

/* Start GEOCOMs Ning 2.0 responsive fullwidth network Part 3 */
@media screen and (max-width:1144px)  {
DIV#xg.account.external-auth DIV#xg_body,        
DIV#xg.account.external-auth .xg_lightborder{
     width: 92%!important;
     min-width: 100px!important;
     max-width: 500px!important;
    left:0px!important;
    right:0px!important;
    margin-left:auto!important;
    margin-right:auto!important;     } }
@media screen and (max-device-width:1144px)  {
DIV#xg.account.external-auth DIV#xg_body,       
DIV#xg.account.external-auth .xg_lightborder{
     font-size: 34px!important;
    line-height: 35px!important;    } }
@media screen and (max-width: 760px)  {
table.categories p, table.categories ul {
    padding-left: 0px!important;
    padding: 3px!important;
    margin-top: 0px!important;}
  TD.xg_lightborder H3{
    margin-top: 70px!important;
    margin-left: 0px!important;
    padding-left: 0px!important; }
BODY TD.xg_lightborder {
    padding-right: 0px !important;
    padding: 2px !important;
    width:45%!important;}
BODY .xg_theme TD.xg_lightborder,
BODY .xg_theme th.xg_lightborder{
  width:45%!important;
  min-width:45%!important;
  max-width:45%!important;}    
BODY .body_events_main ul.clist div.tb {
    margin-left: 10px;
    margin-top: 110px;}
BODY .body_events_main ul.clist li a span.image {
    margin-right: 16px !important;  } }
/* End Ning 2.0 responsive fullwidth network Part 3 */

 

 

 

 

maB N_2.0_FWN_mobile_app_V3.0.js

 N2_GEO_mod_RT_v2.5.044_3x.js

N2_GEO_mod_RT_v2.6_3x.js

[Scott Bishop]

 Hi George, 

This code isn't working anymore. I've looked at some of the other sites using your code and they aren't working anymore either. 

Do you know what happened?

Thanks!

[Kos]

George it stopped working on Suzies site as well. https://theconstitutionalconservatives.com I instructed her to contact Ning but Scott Bishop is not alone here.

[Bizz]

Kos I just looked at the links to the scripts which don't bring anything up, this either means they have been removed or the site they where on has been removed and so the links will not work as the styles are in those scripts. The css that you would have copied will still be there as it's on your own site.

Maybe George has closed these down which would result in the code where the link points to will also be gone

[Scott Bishop]

I was affriad of that. Do you or anyone out there know how to get it re-hosted somewhere else or better yet maybe Ning can host it...?

[Steve C]

George did a lot and was very generous with his time but he may have moved on.

My Ning 2 site's responsive. Take a look and LMK if you want the code. I'll get it to you next week when I'm available but it'll need some tweaking for your site and that's above my paygrade.

https://live.autographmagazine.com/

[Scott Bishop]

Wow, Impresive George. I love it! 

My site is community.surfoutlook.com 

I could really use your help. If it consist of a lot of time I'm willing to compensate. 

Please either hit me up here or message me. 

Thanks! 

Btw, you're absolutily right about George, awesome guy. I believe he's moved on to somthing else too. 

[Suzie Nielsen]

Scott, I have the same problem... If you find  a fix -please share My site looks odd right now!

Thanks, Suzie

[Scott Bishop]

George must of had the coding hosted on a site he owned and let go.

I justed replied to Steve for help from his developer and will hire his services and let you know. 

[Steve C]

Scott,

Glad you like it! I'll give you the code and you may want to hire the developer who fine-tuned it last year to make it the best it can be for you.

[Suzie Nielsen]

Steve,

So you did not have a problem with Georges code? Does that mean this is not a Ning problem- but it is a code problem?

George was always so kind... I hope he is not gone because my site does not look good! and I have no clue what to do about...KOS usually helps me but even she can't figure this out!!! Any ideas?

THanks

https://theconstitutionalconservatives.com/