Canvas Theme – Working with Columns

Home Pootlepress Academy Support Forums Academy Support Forum Misc Canvas Theme – Working with Columns

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #4708
    Canvas Theme – Working with Columns 2Trish Mullen
    Participant

    Jamie, do you know if I can adjust the width of one column as opposed to having them all equal please? Here’s the page I refer to – http://ollarhairteam.com/price-list/

    The price lists are OK but it’s that first column that needs to be wider to allow for all the prices to line up. Do I need to amend the CSS and if so, could you give me some idea where to find that particular bit please?

    Thanks
    Trish

    #4709
    Canvas Theme – Working with Columns 2Trish Mullen
    Participant

    Sorry, I meant to add – those last prices £8 and £25 should line up with the last 2 treatments i.e. scalp etc!

    #4822
    Canvas Theme – Working with Columns 2Trish Mullen
    Participant

    Hi, I asked the question of the support team at Woo Themes and just in case anyone else would like to play around with the column sizes in Canvas, here is the page that will help you – http://www.woothemes.com/woocodex/shortcodes/

    Please believe me when I say that I am no coder, I’ve never been taught code and I’ve just learned by asking or going online to find out. I only learn what I need to know to do something with WordPress.

    Scroll down to section 8 and I’ll try and explain how you widen your columns as I was instructed by WooThemes Support and it worked:

    I will use the example I needed help with and it was a price list. I had the text in Column 1 and 3 other columns each displaying a price, so I had chosen a 4 column layout. Some of the text in Column 1 was too long for one line so spilled over into two. This pushed all the prices out of alignment with the text. I was tearing my hair out as I had no idea how to fix it.

    So here goes:

    To enable all the text to go on one line, I needed to choose a 5 column layout and combine the first 2 columns together. This is done very easily, and although it’s a bit of coding, it’s really just copying and pasting.

    When you select your columns and let’s say you want, like I did 4 columns with the first one wider than the others. All you do is select your columns as a 5 column layout. In your ‘html’ section of the page go in and change a couple of things. You will see that each column starts with – [fivecol_one] – this is what needs to be changed. In the first column (presuming that is the one you want widened) just change the ‘one’ to ‘two’ – it is that simple. It should now look like this – [fivecol_two] – the rest of your columns will remain as ‘one’ unless of course you want them widened too and in which case you would do exactly the same.

    Don’t forget to change the code at the bottom of each column that you change – it will look like this – [/fivecol_one] – the / indicates the end of the code. You need to change the ‘one’ or ‘two’ in there.

    I think this would also work if you needed to span 3 columns or whatever, the process is the same and you just change the number.

    Hope this helps others as I really struggled with it over the last few days but it really is just copy and paste.

    Trish

    #4823
    Canvas Theme – Working with Columns 5Jamie Marsland
    Keymaster

    Great thanks for sharing Trish :)

    #8951
    Canvas Theme – Working with Columns 6Hiro SHINOHARA
    Participant

    Thanks Trish,
    Though they also have a semi-visual way of laying out the columns when you create them. I don’t know if it is a recent thing or not.

    View post on imgur.com

    #8967
    Canvas Theme – Working with Columns 2Trish Mullen
    Participant

    aahh, that’s interesting Hiro, thanks for sharing.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.
Scroll to Top