AYM

Better Engagement with a Wider Forum Box on Home Page

* I may have added this to JenSocial in the past. But, don't think so.



This CSS will make your home page Forum Module fill the width of 2 columns. You must have the Forum Module at the very top of your site, in the top center wide column. I added to the Ning Creators site via FireFox, so you can see an example.








This hack as in any, may have to be tweaked for your unique CSS. However, I have installed this on several Client sites without issue. I have tested on the wide and standard layouts. It will not work without more tweaking, where the wide column has been moved to the far left.



What You Need To Do After You Install CSS:

You will need to adjust your column content, as-in, you will have a gap in bottom center. All you'll probably need to do - - move another module in that spot via My Network/Settings/Features Layout.



If you want this styling on your site, I hope it works well for you!





Edit the following code, and add to your Advanced CSS via: My Network/Settings/Appearance/Advanced



CSS YOU WILL ADD:

 .xg_widget_main div.module_forum {width:738px;margin-left:-250px;height:255px; overflow:auto; position:relative;}.xg_widget_main div.module_forum .xg_module_head {width:738px!important;}
/*** MOVE ENTIRE COLUMN DOWN TO ADJUST FOR FULL WIDTH ON FORUMS ***/
.xg_widget_main_index_index .xg_3col .xg_1col {margin-top:268px!important;}

Get A Skype Button



If you would like to add a Skype Button to your site, go here:

http://www.skype.com/intl/en-us/tell-a-friend/get-a-skype-button/

Select the button you want, and copy/paste the code into a text box, or other area of your Ning Network that accepts scripts. BTW, if the code is stripped, try wrapping a DIV around it like this:

<div id="myskype">your Skype Button code</div>



In order for your button to work and accurately reflect your Skype Status, set-up your Privacy Settings:

• To access your Skype Privacy Settings, click on the main menu option (upper-left) titled Skype, and then Privacy.
• Select the appropriate radio boxes with your preferences. The one circled in red must be checked:

How To Share Your Logo Banner and Link - "Grab This Code"



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;">
&lt;a title="JenSocial Network Directory - Free Directory for All Social Networks" href="http://jensocial.com" target="_blank"&gt;&lt;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"&gt;&lt;/a&gt;</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 - -&lt; for left bracket (less than), AND &gt; 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.

1. 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.
2. 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.
3. 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;">
&lt;a title="JenSocial Network Directory" href="http://jensocial.com" target="_blank"&gt;&lt;img border=1 src="http://api.ning.com/files/ht2bDLLex1gqPnPETRZSyD7JPldn2Tz4nCUmOBEQAIzQb9J83ABlaJwJ3R-*rm5oUeFXSu0c*7ygDm0*xw9YGRZBgxqrFCxE/jensocial_banner468by60.png" alt="JenSocial.com: Social Network Directory"&gt;&lt;/a&gt;</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;">
&lt;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"&gt;&lt;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!"&gt;&lt;/a&gt;</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!