Jump to content


Photo
- - - - -

How to create columns?


  • Please log in to reply
9 replies to this topic

#1 winning

winning

    Newbie

  • Members
  • 2 posts

Posted 02 April 2012 - 05:40 AM

How to create 2~3 columns like this page:

Please Login or Register to see this Hidden Content

Left side is the marketing massage content, right side is the contact form (I may use the gravity form). In sections, I do not see column as an option, but I see it here in the image on the top:

Please Login or Register to see this Hidden Content

Thanks!

#2 gyoery

gyoery

    Advocate

  • Members

  • 252 posts
  • Country: Country Flag

Posted 02 April 2012 - 10:13 AM

By that the footer columns are meant. The two ways that come to my mind (probably there is more and maybe better ones) would be to either use the footer multiple columns, though then it is universal for all pages, or to use boxes. With boxes you can select how many you want to display in a row, so if you display 2 boxes you effectively have 2 columns which you can style the way you want. That is the better solution. Ohh... And option 3 is to use your sidebar as second column since u can enter html in there as well. Though I would recommend you go with the box solution.

#3 Danny

Danny

    Is Awesome!

  • Moderators
  • 17965 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 02 April 2012 - 11:55 AM

Hi,

You can either simply use sidebars and change the width of the sidebars to match the content via Layout Editor view screenshot! However, this will effect all your pages using the Content & Sidebar on Right layout.

Please Login or Register to see this Hidden Content



Or you can use the column HTML provided in PageLines Simply use the code below and add your content between the divs.

Please Login or Register to see this Hidden Content


that should make a three column, responsive/fluid layout for you.

Use pp2, pp4, pp5 for 2, 4, and 5 column setups respectively.

There is also a 'ppfull' mode e.g.

Please Login or Register to see this Hidden Content


If you view my screenshot below, this is a two column layout using the pp2 and full width layout i.e. no sidebar.

Please Login or Register to see this Hidden Content



#4 gyoery

gyoery

    Advocate

  • Members

  • 252 posts
  • Country: Country Flag

Posted 02 April 2012 - 12:06 PM

@danny whats wrong with using boxes?

#5 Danny

Danny

    Is Awesome!

  • Moderators
  • 17965 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 02 April 2012 - 12:14 PM

Nothing wrong with using boxes, but using the column code above allows for more control in my opinion that's all. Lets not hijack this topic, if you want to discuss further, feel free to send me a PM @gyoery :D

#6 winning

winning

    Newbie

  • Members
  • 2 posts

Posted 02 April 2012 - 01:33 PM

@Danny Thanks for the prompt support! The column code is exactly what I need. It would be better if you can make columns as a section type to drag and drop and adjust and enter content right inside, just like the highlight. The reason I want drag and drop for column is I can change number of columns and adjust each column width on the fly (for each page to have different column counts and width). For instance, on page 1, I can have 50%, 50%; on page 2, 50%, 25%, 25%; page 3, 45%, 30%, 25%. I want to create different columns on page basis (each page may be different), so sidebar is not really good here unless I want to assign different widgets on different pages (too much work and not easy to manage). Anyway, where can I find more similar things as "pp2, pp4, pp5" provided in PageLines? I guess you may have some other useful codes like that. Love to hear more from you :)

#7 gyoery

gyoery

    Advocate

  • Members

  • 252 posts
  • Country: Country Flag

Posted 02 April 2012 - 01:59 PM

tell us what you need, and we tell you how to do it. btw. it is quite easy to do this yourself. This is all you (basically) need in CSS: .ppfull {width:100%;} .pp3 {width:33%;} Use this info to generate your own off-balance columns.

#8 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 02 April 2012 - 06:36 PM

The "pp" number is how many columns. pp5, is 5 columns, pp3 is 3 columns, and so on.

#9 8216az7373

8216az7373

    Super Member

  • Members
  • 128 posts
  • Country: Country Flag

Posted 27 February 2013 - 05:16 PM

I had a question on this topic:

 

You stated in your first replay regarding two columns using Pagelines to:

"Or you can use the column HTML provided in PageLines Simply use the code below and add your content between the divs."


I see the code you suggest, but I am unclear on where this goes. Im interested in having just one template page to be in two column format, but not have it effect any other portion of the site. Can this be done? How?

 

Im trying to set up a page with photos in the right column and text describing the photo in the left column.
 



#10 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 27 February 2013 - 09:17 PM

Hi there,

 

Take a look at the Pagelines Grid system on '

Please Login or Register to see this Hidden Content

'. This will allow you to setup custom columns inside each post page using html code. You're able to add your own content inside these shortcodes, so for example you can set up two columns, one spanning a quarter of the page, one spanning three quarters and then enter your content inside each.