JenSocial: Social Web Directory and Ning Tips

Social Web Directory :: Social Network Directory :: Ning Tips and Ning Support

Add Special Content to Footer

I've already had a couple of fellow NCs ask "How do I create a footer, like the new footer on Creators Network?" If this tutorial has already been created, I couldn't find it.

Your content and formatting is up to you, of course. But, I can show you how to add your footer content to your Ning Network. This is very similar to the How-To on Creators Network - "Inserting JavaScript ads or content in the header of your networks". So, if you want to learn how-to add/insert content or ads in your header, see Derrick's How-To, above.

How To Add Content to Your Footer:
Summary - Prepare your content and add to an external HTML. Call into your Network Footer via Analytics Box, using an iframe and JavaScript.

Create your HTML.
Upload to a server or to Ning via Blog (be sure to click on document upload icon)
How to center content in your HTML - add a DIV with align=center, around your footer content, within your external HTML. Example start tag: <div align=center>
Background color - the best way to set iframe background color: add the body tag to your external HTML, like in following example. You can add these tags to your Analytics box code. But, I've found that it's better to add to your HTML file. Example start tag: <body bgcolor=white> Note: Don't forget to end both the body and DIV tags in your external HTML file.
Know your HTML path.
Replace the src="your.html" with your HTML file path, in the example code below.
Adjust the iframe width and height to fit your HTML content area.
Add the example code below, to your Analytics box - Manage/Analytics. <script type="text/javascript"> x$("#xg_foot").after("<div id='custom_ads'></div>"); var ad_html = '<iframe frameborder="0" scrolling="no" allowtransparency="true" marginheight="0" marginwidth="0" src="your.html" width="955px" height="100px"></iframe>'; x$("#custom_ads").html(ad_html);
</script>

0 members favorited this

Replies to This Discussion

Permalink Reply by Ashary on January 17, 2010 at 12:16pm

Jen, I got this error message when I pasted the code to the Analytics box...

We're sorry, this site can't be embedded in a frame.

If you're trying to set up your own domain for your Ning Network, please click here for more information on how to set it up properly. Or, click here to go to the original site.

Permalink Reply by JenSocial on January 17, 2010 at 12:18pm

You must be trying to insert a page from your site? You cannot add your Footer content to a new page. Your HTML code must be contained in an external HTML file.

Check your HTML path, and make sure you have added the exact path where you uploaded or are hosting your file?

Permalink Reply by Ashary on January 17, 2010 at 12:31pm

perfect!
thanks a lot Jen.

Permalink Reply by JenSocial on January 17, 2010 at 12:39pm

Great!

Permalink Reply by LeafsZone on January 28, 2010 at 3:44pm

What if I just want to enter custom text?

Permalink Reply by Justin Farrow on January 31, 2010 at 4:42pm

any idea why it breaks and will not show the links on this site? http://landsurveyorsunited.ning.com/ its my father's site and im trying to make it work...thanks

Permalink Reply by JenSocial on February 1, 2010 at 2:16pm

Hi Justin,
Can you elaborate? Exactly, what is not working? Please provide HTML file. When I have time, I'll take a look.
Thanks,
Jen

Permalink Reply by SUPER on March 26, 2010 at 4:17pm

friends I could not help me understand the manual and very interested in this topic I want my ning network has that information at the end of the footnote

Permalink Reply by JenSocial on March 26, 2010 at 10:05pm

Sorry, other than our instructions, I'm not sure what else can be explained. Each case will be 100% unique and customized, like writing a book. You will need to learn HTML and CSS, or pay someone to do this for you. I am not saying it's easy. You are not the only person in this dilemma. I'm sorry for the bad news. Hopefully in the future, Ning will offer a built-in footer box.
Best Regards,
Jen

Permalink Reply by SUPER on March 27, 2010 at 9:16am

my question is where I place HTML and CSS codes not
I am asking the codes of your website, but where I place the custom code of mine thanks

Permalink Reply by JenSocial on March 27, 2010 at 10:05am

Hi SUPER,
Thanks. I understood this. The instructions provided are the best possible.

You may find this other tutorial helpful, but not sure. Although it is for the HEADER, it may give better instructions on how to upload the HTML file.
http://theningdirectory.ning.com/group/ningnetworktips/forum/topics...

If not already, you will really need to learn some HTML. This is critical.

Thanks,
Jen

Permalink Reply by SurferShot on August 29, 2010 at 7:58pm

YyyyES. That was awesome! I was going to pay someone to do that for me. I just happen to stumble across this.
You're money in my pocket.
Thanks so much!