Replies to This Discussion

Permalink Reply by JenSocial on March 7, 2011 at 10:14pm

Hi Tracy,

I have only added the code for 2 columns on custom projects. As far as I remember, I have never shared this code publicly, but could be I don't remember sharing it. Each case is unique and will cause a domino effect. The questions and issues would no doubt be overwhelming.

 

Maybe someone else knows an easier way than how I do this.

 

I will share the critical part of this code, with this stipulation: :-)

I cannot help with tweaking this code, except "for hire" at my hourly Design rate. It takes too much unique coding.

Notes:

1. This changes the columns on home page from 3 to 2 columns.
2. The modules in wide column will remain. The left narrow column will not, so all of your modules in narrow left column need to be dragged to wide column.
3. This only works for old Ning Editor and themes.
4. For all who read and use this code: I don't want to come off as tacky, but want to make this clear. I can't answer unique questions, free. Please don't ask. As in all tips/hacks offered on JenSocial, use at your own risk.

 

/* Special 2 Column Format for Home Page */
.xg_widget_main_index_index .xg_3col .xg_1col {
display:none;
}
.xg_widget_main_index_index .xg_3col .xg_2col {
width:747px;
margin-left:0;
padding:0;
}
.xg_widget_main_index_index .xg_3col .xg_2col img {
max-width:737px;
_width:expression(this.width > 737 ? 737: true);
}
.xg_widget_main_index_index .xg_3col .xg_2col .xg_reset img {
max-width:721px;
_width:expression(this.width > 721 ? 721: true);
}
.xg_widget_main_index_index .xg_2col .feed-timestamp {
left:645px;
}
.xg_widget_main_index_index .xg_3col .xg_2col .xg_reset img {max-width:730px;}

/* Adjustments to Col3 */
.xg_3col {
margin-left:-10px !important;
width:767px!important; }

 

 

Best Regards,

Jen

 

• ▶ Reply

Permalink Reply by Tracy Mount on March 7, 2011 at 10:29pm

Jen, I appreciate you sharing this and do hear the "moment of pause" in your disclaimer.  Irrespective of the outcome, I'll report back my findings.

• ▶ Reply

Permalink Reply by JenSocial on March 7, 2011 at 10:31pm

Thanks Tracy, would love to hear your experience.

Best Regards,

Jen

• ▶ Reply

Permalink Reply by Tracy Mount on March 7, 2011 at 10:35pm

Jen, I just dropped in into my test network and it worked beautifully.  Thanks very much.

 

• ▶ Reply

Permalink Reply by JenSocial on March 7, 2011 at 10:56pm

Wonderful, and thank you for the feedback!

Tip: Keep in mind these sort of things, any module that has rows and columns like photos, groups, videos - - the number of icons displayed in columns will likely only fill the area of the original wide column width, leaving gaps. Modules like Text Boxes, Latest Activity, Blogs and Discussions, should work nicely.

Good luck,

Jen

• ▶ Reply

Permalink Reply by Tracy Mount on March 7, 2011 at 11:04pm

Jen, I took the leap and placed the code into my live network and am happy to report that it worked perfectly! What a sweet little tip, as you like to say.  I am thinking of how I can now make the slider from 728 x 90 to something larger, for example, 950 x 150; that may be more difficult.  I appreciate your help.  Best, Tracy

• ▶ Reply

Permalink Reply by JenSocial on March 7, 2011 at 11:43pm

Tracy, very cool!

If you are referring to the JenSocial Slider tip in Premium Group, I offer a wider version of that same slider tip that has 2 columns and fills the entire width. You should be able to use that tip. I may need to help you with a couple of adjustments.

http://jensocial.com/group/premiumningtipsbyjen/forum/topics/jensoc...

Let me know,

Jen

• ▶ Reply

Permalink Reply by Tracy Mount on March 8, 2011 at 8:45am

Jen,

I'm sorry to continue on this but when you change to the wide column, how do you control items within the module so that images and videos span the entire width?  My groups are aligned left within the module and I can't seem to find the code controlling this; you can see this here.

 

Also, the slider with the wide format worked nicely in my test network.  Would you recommend a particular method or platform for developing the slides?

 

Best, Tracy

• ▶ Reply

Permalink Reply by JenSocial on March 8, 2011 at 11:36am

Hi Tracy,

The images spanning the entire width is what I was referring to on unique code. I can't get into trying to tweak each case, so sorry. There are too many variables. This is why I didn't want to give this code, and why I said that blogs, discussions and latest activity work the best.

 

When you ask for platform to develop slides, do you mean the software to create the images? If yes, I use photoshop but it's pricey and a lot to learn. There are several online software apps that work well. One that comes to mind is:

http://pixlr.com/editor/

 

Best Regards,

Jen

• ▶ Reply

Permalink Reply by JenSocial on March 8, 2011 at 12:04pm

Tracy,

For your Group images, here's a fix that's not great, but much better. After you confirm you have read this, I would very much like to delete this discussion. I hope you understand why. It took 30 minutes to come up with this one fix. I did it for you because you are a Member of the Premium Group. ;-)

 

I did not check this in any browser except FireFox. Honestly, it could be totally messed up in IE, etc... You must check other browsers. This code spreads the group images out, and adds a nice border behind each group.

/* Group Fix */
.xg_widget_main_index_index .module_groups .clist {clear: none;}
.xg_widget_main_index_index .module_groups div.xg_module_body .clist li { width:120px; padding:8px; border:dashed 1px #dadada!important; height:150px; }

 

Best Regards,

Jen

• ▶ Reply

Permalink Reply by Tracy Mount on March 8, 2011 at 10:22pm

Jen,

Wow, you are amazing; this small piece of code completely did the trick and turned a disjointed group module into an attractive area of the home page.  I am running Google Chrome and it looks great.  It goes without saying that the premium group is worth every penny; I won't make of habit of prying for free advice.  I'm happy to pay for extra services especially if they prove to be this seamless.  Thanks very much.  Best, Tracy