To add a logo and link to your site, that site visitors can grab and copy, to add to another site, here's the code I use at the bottom of JenSocial. The key is the <textarea> HTML TAG:
My Original Code, and Reflects the Image Above:
<div style="background-color:#003366; color:#ffffff;"><b>Grab the JenSocial.com badge/link code:</b></div>
<div style="float:left;"><textarea rows="3" cols="65" style="width: 435px;">
<a title="JenSocial Network Directory - Free Directory for All Social Networks" href="http://jensocial.com" target="_blank"><img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory and Network Creator Hub"></a></textarea></div>
<div><a title="JenSocial Network Directory - Free Directory for All Social Networks" href="http://jensocial.com" target="_blank"><img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory and Network Creator Hub"></a></div>
File to Edit: ShareSiteLogoCode_FullWidth.txt
Code for Center Wide Column, and Reflects the Image Below:
- Critical Note: For each code block example you would use to edit, be sure you do not alter or remove the start and end bracket codes. You will only see this within the code between start and ending <textarea> The bracket codes look like this - -< for left bracket (less than), AND > for right bracket (greater than).
- I have edited my code to offer you a centered textarea, that will fit in the wide column of a Ning Network. This should provide good space if you want to use a banner type image like I have - - 468 pixels wide by 60 pixels in height.
- Your logo needs to be a maximum of 468 pixels in width. This is a good image size to use , since it's one of the standard ad widths/heights for Google Ads. Most of you probably already have a logo banner for this width.
- Upload your logo banner to your Ning site via the File Manager or a Blog. All you need to do is grab the URL, starting with http and ending with .jpg, .png. or .gif (depending on the type of image you are using).
- Your edits will start where you see div align=center. If you don't want to center the DIV, remove the align=center.
- Edit the code below.
- Change my titles, my site link, and my image URLS to yours. I am leaving my banner code, so you have a working example of the code.
- Be sure to change both instances of the image URL, with yours. One is for your visitor to grab the raw code. The other is for displaying your banner below the code. So they know what they are grabbing.
- Be sure to add some type of header in the text box where you offer your banner, like: Please Help Spread the Word, by Adding Our Site Logo To Your Website
<div align=center><textarea rows="3" cols="68" style="width: 468px;">
<a title="JenSocial Network Directory" href="http://jensocial.com" target="_blank"><img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory"></a></textarea></div>
<div align=center><a title="JenSocial Network Directory" href="http://jensocial.com" target="_blank"><img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory"></a></div>
File to Edit: ShareSiteLogoCode_CenterWideColumn.txt
Wide Center Column Final Result:
Code for Right Column and For the Premium Tips Badge - - Reflects the Image Below:
<div align=center><a title="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!" href="http://jensocial.com/page/join-jens-premium-ning-tips" target="_blank"><img border=1 src="http://api.ning.com/files/zy4ZbhXodTxtzn-rWlMhIKKk4lJvwKE4REYymMhuqVsABRyv-j6GO1VvJBFi-95wuykoWRgZaFcp8RAIE0dWMpmT2H-MSQ7N/privateparty2_lg.jpg" alt="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!"></a></div>
<div align=center><textarea rows="5" cols="63" style="width: 135px;">
<a title="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!" href="http://jensocial.com/page/join-jens-premium-ning-tips" target="_blank"><img border=1 src="http://api.ning.com/files/zy4ZbhXodTxtzn-rWlMhIKKk4lJvwKE4REYymMhuqVsABRyv-j6GO1VvJBFi-95wuykoWRgZaFcp8RAIE0dWMpmT2H-MSQ7N/privateparty2_lg.jpg" alt="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!"></a></textarea></div>
File to Edit: ShareSiteLogoCode_RightColumn.txt
Right Column Final Result:
Funny thing, this tip probably seems simple, and it is. But, it's very easy to make mistakes when sharing this type of code and information. Please let me know if I've made any errors. And I may have added to JenSocial before. I don't remember and couldn't find it. Regardless, I know I've never created a tip for this, that is this extensive. LOL!
I can't even figure out how to share the premium tip badge here (what the tutorial is all about, LOL). It converts my code, or displays all of it for you to grab. When you add this type of code in a discussion box, it converts it. Point is: be sure to add this to a text box on a Ning site.
Here's the raw code for the premium tip badge. You can grab this and use it on your site.
<div align=center><a title="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!" href="http://jensocial.com/page/join-jens-premium-ning-tips" target="_blank"><img border=1 src="http://api.ning.com/files/zy4ZbhXodTxtzn-rWlMhIKKk4lJvwKE4REYymMhuqVsABRyv-j6GO1VvJBFi-95wuykoWRgZaFcp8RAIE0dWMpmT2H-MSQ7N/privateparty2_lg.jpg" alt="JenSocial.com: Jen's Premium Ning Tips - Join the Party in our Private Club for Ning Tips!"></a></div>
And here is the raw code to add the JenSocial Banner to your site:
<div align=center><a title="JenSocial Network Directory" href="http://jensocial.com" target="_blank"><img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory"></a></div>
Enjoy!
Post a Comment