Multi-Column Option at the Article Level

For Joomla! 1.5 Coding related discussions, please use: http://groups.google.com/group/joomla-dev-general
Locked
herb200mph
Joomla! Virtuoso
Joomla! Virtuoso
Posts: 3592
Joined: Sun Jun 25, 2006 12:12 am
Location: Salisbury, NC/USA (N. of Charlotte)
Contact:

Multi-Column Option at the Article Level

Post by herb200mph » Fri Dec 14, 2007 7:51 pm

At present, J!1.5 allows selection of single or multiple column display on the front page, within Sections and within Categories

I'd like to suggest a new element whereby single or multiple, let's say maximum of 3 or 4, columns could be selected for layout of individual articles that appear by themselves as single articles that are intended to be listed as "Uncategorized" or static content.

I believe that allowing users to create 2-column layouts at the article level would be a good addition and allow more creative use of space to create narrower, easier-reading columns, vs screen wide run-on text for static content not assigned to sections or categories.

If I've missed something in the process of article-type selection, please reply and advise.
Author: Joomla! 5: Boots on the Ground, Volume 1 @ Amazon.com
Author: Joomla! 4: BASIC TRAINING - Boots on the Ground @ Amazon.com
Joomla! Magazine - https://magazine.joomla.org/all-issues/ ... c-training

User avatar
kelb
Joomla! Guru
Joomla! Guru
Posts: 602
Joined: Mon Oct 02, 2006 3:08 am
Location: Turkey
Contact:

Re: Multi-Column Option at the Article Level

Post by kelb » Wed Dec 26, 2007 12:49 am

Trying to columnize (!?) in article level is not an easy option. So many people wouldn't need this type options.
Last edited by kelb on Wed Dec 26, 2007 6:53 am, edited 1 time in total.
Every soul will taste of death.

User avatar
tcp
Joomla! Ace
Joomla! Ace
Posts: 1548
Joined: Wed Sep 21, 2005 9:25 am
Location: Thailand
Contact:

Re: Multi-Column Option at the Article Level

Post by tcp » Wed Dec 26, 2007 9:45 pm

Not a Q&T issue.  Moving to the parent forum.

tcp
Your solution for a single-page checkout on any website.
http://moolah-ecommerce.com

hamsel
Joomla! Apprentice
Joomla! Apprentice
Posts: 27
Joined: Sun Oct 30, 2005 1:39 am
Location: Denmark
Contact:

Re: Multi-Column Option at the Article Level

Post by hamsel » Mon Mar 24, 2008 4:06 pm

herb200mph -

I agree with you - the readability of a text-savvy article is poor with the one-column approach at the article level. The only way I've found around the problem is to stuff the text into a table and make the text divisioning the hard way.

It would be a real nice feature to be able to select a multi-column lay-out at the article level, making the text flow from one column to the next.

Anyone having a more elegant solution than mine?

/Per Hertz

herb200mph
Joomla! Virtuoso
Joomla! Virtuoso
Posts: 3592
Joined: Sun Jun 25, 2006 12:12 am
Location: Salisbury, NC/USA (N. of Charlotte)
Contact:

Re: Multi-Column Option at the Article Level

Post by herb200mph » Mon Mar 24, 2008 4:13 pm

Don't you know it!!! Maybe a script driven thingy that will allow "column linking" for text flow from Col 1 > Col 2 > Col 3, for example. The static table requires manual breaking of the article text flow and that can be a pain when doing back-edits.

Hey....we can dream and hope...LOLLLL
Author: Joomla! 5: Boots on the Ground, Volume 1 @ Amazon.com
Author: Joomla! 4: BASIC TRAINING - Boots on the Ground @ Amazon.com
Joomla! Magazine - https://magazine.joomla.org/all-issues/ ... c-training

User avatar
logicalnot
Joomla! Apprentice
Joomla! Apprentice
Posts: 16
Joined: Mon Feb 18, 2008 10:01 am

Re: Multi-Column Option at the Article Level

Post by logicalnot » Tue Oct 14, 2008 9:01 am

I am looking the same features.

Most of the screens are horizontal, so why bother scrolling down if you have enought screen real estate to have your text spanning on two or more collumns.
And yes, it will be SO much easier to read.

jjsmulo
Joomla! Apprentice
Joomla! Apprentice
Posts: 31
Joined: Fri Dec 08, 2006 8:59 am

Re: Multi-Column Option at the Article Level

Post by jjsmulo » Fri Oct 17, 2008 9:19 pm

I have a client who desires this. I wish it were already a possibility.

docdik
Joomla! Apprentice
Joomla! Apprentice
Posts: 9
Joined: Sat Jan 10, 2009 12:39 am

Re: Multi-Column Option at the Article Level

Post by docdik » Mon Feb 02, 2009 1:37 pm

I guess this is still not possibe is it I could do with this too

corradomatt
Joomla! Fledgling
Joomla! Fledgling
Posts: 4
Joined: Fri Feb 03, 2006 12:36 am
Location: California

Re: Multi-Column Option at the Article Level

Post by corradomatt » Sat Apr 25, 2009 4:28 am

I managed to get the page to divide into multiple columns through css....(actually I stole the code from another website!)

The only problem is that I can't get the text to move over to the other columns.


Here is the css....

Code: Select all

/* All */
.col2-set, .col3-set, .col4-set, .col5-set { column-count:2; }

/* Col2 */
.col2-set .col-1, .col2-set .col-2 { width:48.5%; }
.col2-set .col-1 { float:left; }
.col2-set .col-2 { float:right; }

/* Col2-alt */
.col2-alt-set .col-1 { width:32%; }
.col2-alt-set .col-2 { width:65%; }
.col2-alt-set .col-1 { float:left; }
.col2-alt-set .col-2 { float:right; }

/* Col3 */
.col3-set .col-1, .col3-set .col-2, .col3-set .col-3 { float:left; width:31.3%; }
.col3-set .col-1, .col3-set .col-2 { margin-right:3%; }

/* Col4 */
.col4-set .col-1, .col4-set .col-2, .col4-set .col-3, .col4-set .col-4 { float:left; width:22%; }
.col4-set .col-1, .col4-set .col-2, .col4-set .col-3 { margin-right:4%; }

/* Table Columns */
table .col-1, table .col-2, table .col-3, table .col-4 { float:none !important; margin:0 !important; }
.col3-set td.spacer { width:3%; }
.col4-set td.spacer { width:4%; }
Here is the way that I was using the code in the html for a 3 column layout.....

Code: Select all

<span class="col3-set">
<span class="col-1">blah blah blah</span>
<span class="col-2">blah blah blah picture or something</span>
<span class="col-3">more blah blah blah</span>
</span>
As I said, the columns break up nicely...but not text is sent over to the columns. Maybe that has something to do with my particular template css (I didn't design the template or right the majority of the CSS for it.) I am going to try this with another template and see what happens.

Maybe someone here can help me sort this out and figure out what I'm missing.
CorradoMatt

corradomatt
Joomla! Fledgling
Joomla! Fledgling
Posts: 4
Joined: Fri Feb 03, 2006 12:36 am
Location: California

Re: Multi-Column Option at the Article Level

Post by corradomatt » Sat Apr 25, 2009 4:33 am

Ok...so testing within another theme and the above code works.....now I just need to figure out why this doesn't work with the theme I am currently using. Maybe something to do with the floating divs or something.....I don't know CSS that well......

Wish me luck!
CorradoMatt

becyn
Joomla! Explorer
Joomla! Explorer
Posts: 458
Joined: Mon Aug 11, 2008 1:16 am
Location: Newburgh Ny , USA
Contact:

Re: Multi-Column Option at the Article Level

Post by becyn » Sat Apr 25, 2009 4:26 pm

You really don't need anything but span or divs with a bit of CSS.
I read somewhere that future versions of Joomla will be "tableless" designs.
So i've been honing my skills( such as the are). None of my components use tables for positioning.

Something like this may work for you:

Code: Select all

/*CSS*/
div.main{width:100%}
div.col{width:33%}

<body>
<div class="main">
<div class="col">bla bla</div.<div class="col"> more bla</div><div class="col">excesssive blather</div>
</div>
Of coarse the css has to be in the head with the appropriate style tags.
Learn something new every day!

petermatra
Joomla! Intern
Joomla! Intern
Posts: 91
Joined: Fri Mar 28, 2008 6:45 pm
Location: New York
Contact:

Re: Multi-Column Option at the Article Level

Post by petermatra » Tue May 19, 2009 4:58 am

So has anyone figured out the ability to get article text to flow through columns without a manual layout?
Peter Matra
http://www.petermatra.com
[url]mailto://[email protected][/url]

cool_edward
Joomla! Fledgling
Joomla! Fledgling
Posts: 2
Joined: Thu Apr 09, 2009 12:32 pm

Re: Multi-Column Option at the Article Level

Post by cool_edward » Wed Nov 04, 2009 7:01 pm

The beset solution I found (it's easy to integrate with a joomla template):
http://randysimons.nl/125,english/129,m ... lumn-text/
http://randysimons.com/overige/multicolumn/

petermatra
Joomla! Intern
Joomla! Intern
Posts: 91
Joined: Fri Mar 28, 2008 6:45 pm
Location: New York
Contact:

Re: Multi-Column Option at the Article Level

Post by petermatra » Sat Nov 07, 2009 8:06 pm

Cool, thanks. It definitely looks cleaner than everything else I have seen out there. How are you invoking the JS? Do you put it at the end or the beginning of the text? What plugin do you use? My site is 950 wide which is very wide and hard to read long lengths of text. I have had several comments on this.

My other concern is adding images? I like to float images in the text as you can see from my site. Have you experimented with this. Unfortunately we are about to launch our next issue so I need to wait before I implement this as I need to test the code.

You can see my site at http://www.awantedmag.com
Cheers :pop
Pete
Peter Matra
http://www.petermatra.com
[url]mailto://[email protected][/url]

cool_edward
Joomla! Fledgling
Joomla! Fledgling
Posts: 2
Joined: Thu Apr 09, 2009 12:32 pm

Re: Multi-Column Option at the Article Level

Post by cool_edward » Sun Nov 08, 2009 7:54 pm

Peter,
Quite nice layout but the code is at least messy! Keep a proper DIVs structure - that's crucial for the multicolumn solution. Just try the code below.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<script type="text/javascript" src="multicolumn.js"></script>
<script type="text/javascript">	
multiColumnSettings=new MultiColumnSettings;
multiColumnSettings.classNameScreen='columnized';					
window.onload = function () {
new MultiColumn(document.getElementById("content"),multiColumnSettings);
}
</script>

<style type="text/css">
.columnized div {float:left; width:18em; padding:10px; position:relative; text-align: left; margin:0;}
/*.columnized div .readOn {position: absolute; right: 1em; bottom: -0.5em; color: #999999; }*/
</style>

</head>

<body>
<!--BEGIN: SIMPLIFIED CONTENT-->
<div id="content">
	<div id="proper_content">
<p>
<!-- paste here a lot of text -->
</p>
	</div>
</div>
<!--END: SIMPLIFIED CONTENT-->
</body>
</html>
I experimentally integrate multicolumn layout into my jooma template (based on beez): http://ci.swps.pl/test/index.php?option ... Itemid=126 - thats only a test so the layout is rather obscure.

Good luck
Krzysztof


Locked

Return to “Joomla! 1.5 Coding”