Add Footer like Creators.ning.com for Ning 3.0! (Great example of a JenSocial VIP Tip!)

Add a Footer like Creators.ning.com - - overall look and feel, for Ning 3.0!

A few notes first:

  • Time will not allow me to support customization of this tip, except in JenSocial 2.0 VIP Club. New Ning 3.0 Club coming soon!  You should find this tip very easy to install. It looks overwhelming at first. I'm just thorough. It's quite easy.
  • I used the blueprint of the Footer on Creators - - thanks Ning for inspiring so many NCs. However, the code has been completely rewritten and re-purposed, for ease of installation.

Below is an example of the Footer like Creators.ning.com, and the results of the code from this tip.


Click Image below for Full View.

I have documented the HTML. It's easy to edit, just look for my comment lines as your lead to change colors, fonts, etc... I have written this so all code goes in the "Above Footer HTML Box" (previously known as our "Bottom Instant Ad Box"). You will not have to add any code to Advanced CSS or Custom Code Box.

 

Instructions:

  • Edit the code in the following text file. I suggest editing your code from a simple Text Editor: Footer_Like_Creators_Ning3.0.txt
  • Note: If you want your Footer Header Titles and Links to default to your Network's defaults, remove all code for font-family. You will find 2 cases.
  • Within the <style> tag you will find all of the CSS. Locate each line that has the numerous asterisks like this example:
  • /****************************** Copyright Links - Color *****************************/
  • Change your font attributes, the overall background color, and you are done with the CSS edits. If you like the colors in the screen shot example, you don't need to change anything.
  • Then, you will see 4 blocks of links. Each header is titled: Column Header #1-Column Header #4. Well actually, I named the Last Column: "Site Links" as a suggestion. Change the Header Titles to suit your needs. Don't change anything else.
  • Under each Column Header you will see 4 generic links, titled: Link #1-Link #4. Change the link titles and the href URLs to your links.
  • For Column #4 ("Site Links"), I have added the generic links for: Report an Issue and Terms of Service. You do not have to change those 2 href URLs. They will work on your site as-is.
  • Save all of your edited code to a text file for future edits. It's always best to edit this type of code in a text file, and then paste into your HTML Box.
  • After your edits are complete, add all of your code to your "Above Footer HTML Box" (previously known as our "Bottom Instant Ad Box").
  • Instructions for Adding Code to "Above Footer HTML Box"
  • From your Ning 3.0 Toolbar click on "Social Site Manager".
  • Click on Sites & Pages.
  • Locate your Home Page Menu Tab.
  • At bottom of right column, locate: "Above Footer HTML Box" and click on box.
  • To Display Footer on All Pages: The "Use default above footer HTML" must be checked. If you choose this option, it's a little confusing here. Just click on the link "default above footer HTML". You'll see a window open. Paste your code into this window and then click OK.
  • If you do not want Footer on All Pages, uncheck "Use default above footer HTML", and add your code to the default box.
  • Click on Update.
  • Be sure to SAVE your Home Page.
  • And you are done!

 

For more tips and support of this quality, join us on JenSocial, in our Ning 2.0 VIP Club for Ning Tips! Watch for the new Ning 3.0 VIP Club, coming soon!

Obviously as of the writing of this tip, there hasn't been much time to test this code in Ning 3.0. Let me know if you experience any issues.

I hope you enjoy this tip!

Jen

Load Previous Replies
  • up

    The York Paranormals

    I am kind of laughing at myself and kicking myself at the same time. LOL! I went to work on the footer Links Section myself because I hadn't seen this post yet. I have taken a screen capture of how it turned out. I like the look myself though, I'm glsd I did it. Let me know what you all think. :-)

    • up

      Julie Clarke

      Hi Jen,

      Great tip Jen, I'm really pleased with it. It also got me to thinking about the Ning bar too and used a variation on my background there too! So double thank you.

      www.class-rep.com

      Julie

      1
      • up

        7H

        finally got around to adding our footer

        Thank you for your help here, Jen!