[Jayson Gurney]

Hi Folks, is it possible to have a multiple columns layout (2 or 3) ?

[Steven Zahm]

@ Jayson Gurney

Sorry, no, not with cMap. It was not designed with a columnar layout in mind. Have you looked at Tile Plus?

[Mitch]

Hey Jayson,

Not to jump in, but I stumbled across your Q… here’s what I did to achieve this. I added the word “right” or “left” to the ‘country’ field in each record. I then set up two columns on the page (using columns in my Genesis theme). I created two shortcodes (one for each column), I then modified code in each to have country=right or left, and then modified the shortcode for both to have the address not display the country. Of course, I also need to make width = 400, which allowed two columns on a full page layout.

Just for the fun of it I made the sort=random so I didn’t need to worry about alpha.

I should note this was for an ‘individual’ directory, not an ‘organization’ directory (and obviously, they were all in the same country).  A little wonky work-around, but it works for that specific application.  YMMV.

Of note: I hadn’t looked at TilePlus when I did this… I might have just bought that template too had I seen it. :)

[dm]

Is there definitely no option to display cmaps in 2 or more columns?
I really need this functionality as I do not want to use Tile or Tileplus for this project.

[Steven Zahm]

@ dm

You might want to give Mitches work-around a try. You can also give it a go with CSS, but the results are not usually satifactory…

#cn-cmap .cn-clear {
    clear: none !important;
}
#cn-list .cn-list-row, #cn-list .cn-list-row-alternate {
    float: left;
    width: 46%;
}

[dm]

Hi there Steven,

Thank you. I managed to get the columns to line up perfectly adding margin and height to the css:
#cn-list .cn-list-row, #cn-list .cn-list-row-alternate {
float: left;
margin-left:30px;
margin-right: 10px;
margin-bottom: 20px;
width: 45%;
height:240px !important;
}

However, the notes and bio sections display behind the next listing below it and the map appears large, also behind listings. Could this also perhaps be fixed via css?

[Steven Zahm]

@ dm

You could attempt to adjust the z-index of those div’s. But I don’t think that will work because of the float.

[Author]

Posts