Home Forums Weaver Xtreme Theme 3 Columns Conversion Issue

Viewing 16 posts - 1 through 16 (of 27 total)
  • Author
    Posts
  • #17832
    GR8FL
    Participant
    This is a new issue from the conversion. If you look at the original Weaver Pro site (links below) on the phone, the 3 columns on the front page wrap around the image – each column is stacked.
    For this site, I used <div class=”content-3-col-left”></div> for the two left columns, and <div class=”content-3-col-right”></div> for the right one.
    If you look at converted Xtreme site, the image does not wrap. It looks really tacky. I was told to use the following for all three columns for it to work… <div class=”content-3-col”></div>
    How to fix?

    Weaver Pro II Site: http://weaverhattie.littledropup.com/

    Edit: I don’t know if something changed with an update, but I already had used the 3 columns on another Xtreme site that I did test on the phone and previously worked fine. Now it doesn’t. 🙁
    #22342
    scrambler
    Moderator

    the columns were broken in the last update, so you need to update to the latest 1.2.4

    #22343
    GR8FL
    Participant

    I am using 1.2.2. that was manually updated. The other site has v 1.2.1 

    Can you provide a link please for 1.2.4.?
    #22344
    scrambler
    Moderator

    You need to Update the Theme Support plugin, and the new version of Weaver Xtreme will be included on the WP Dashboard Updates admin panel.

    #22345
    GR8FL
    Participant

    I have the latest version installed. 

    #22346
    scrambler
    Moderator

    http://hattiesgarden.com/ is running 1.2.3 not 1.2.4

    #22347
    GR8FL
    Participant

    It doesn’t wrap properly no matter what version and does not function same way as Weaver Pro.

    Please compare both sites for the difference.
    It’s very obvious on a cell phone.
    #22348
    Weaver
    Keymaster

    Weaver Xtreme does not have content-3-col-left or -right – just content-3-col.

    You must wrap the whole set of columns in <div> … </div> if used in hand coded columns.
    #22349
    GR8FL
    Participant

    It was working fine on another Xtreme version until some update ago that I cannot recall.

    This is maddening.
    On http://lavenderfieldsde.com/ which I set up in Xtreme a couple of months ago, I was told to and did the following which worked until ???
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col mycol3″>content</div><div class=”clear-cols”></div>

    Note that the last column has the following in Custom CSS, which I was told was an option to have the first two columns side by side and the last be stacked underneath:
    .is-mobile .mycol3.content-3-col {width:96%;margin-top:20px;}

    On http://hattiesgarden.com/, I just used 
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div><div class=”clear-cols”></div>
    None of the columns wrap around the image. Instead now the first column stays in one column with the image over the text and does not wrap, so there is all this white space on the right, while the 2nd two columns appear as columns. I don’t really care how it looks, but I do want it to look consistent and would prefer it look the way it does in Weaver Pro II which you can see here > http://weaverhattie.littledropup.com/
    #22350
    GR8FL
    Participant

    I just saw this updated page: http://forum.weavertheme.com/discussion/11220/weaver-xtreme-tips-and-tutorial-part-5

    For 2 columns:
    <div>
    <div class=”content-2-col”>First column content</div>
    <div class=”content-2-col”>Second column content</div>
    </div>
    <div style=”clear:both;”></div>

    For 3 columns
    <div>
    <div class=”content-3-col”>First column content</div>
    <div class=”content-3-col”>Second column content</div>
    <div class=”content-3-col”>Third column content</div>
    </div>
    <div style=”clear:both;”></div>

    What I am finding is most of the two column div codes seem broken. I used them a lot on different pages. I am now looking at this on my desktop (in Chrome).
    Some work. Some don’t. 
    This is with or without wrapping in <div> and or using <div style=”clear:both;”></div> or <div class=”clear-cols”></div> at the end.


    #22351
    GR8FL
    Participant

    If I could have a preference, I would rather have these columns (whether 2 or 3) on the phone behave as if there weren’t columns. It would look like it does on my phone now if you see http://weaverhattie.littledropup.com/

    These appear as separate paragraphs, and I have an option whether to wrap or not wrap text and image, using the my-img-clear class.
    #22352
    GR8FL
    Participant

    Update…

    On the page: http://hattiesgarden.com/delivery/order/ I found that every other 2 column rows worked which led me to believe this had to do with the clear. On a whim, I added in between every two column:  <div class=”clear-cols”></div>. I did this because even with wraping all the columns <div>s with an outer <div>, it still didn’t work. Every other one was not in any column. 
    This page has a 3 column div too and I found I needed to put in two <div class=”clear-cols”></div>.

    I am going to save the page this way since it looks like it “should” on the desktop. Then will see what the phone looks like.
    #22353
    scrambler
    Moderator

    I don’t know how many times I need to say this…

    You site is running xtreme 1.2.3 which has BROKEN columns. SO you need to stop trying to make the broken version work by messing the code, and you must Update to 1.2.4.

    If you are not seeing the update in the admin interface, @weaver would have to tell you where you can download it manually

    #22354
    scrambler
    Moderator

    ONCE you are on 1.2.4 your code will just need to be modified as per the revised tutorial (below)

    <div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col mycol3″>content</div>
    </div>
    <div class=”clear-cols”></div>


    On http://hattiesgarden.com/, I just used 
    <div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div>
    <div class=”content-3-col”>content</div>
    </div>
    <div class=”clear-cols”></div>
    #22355
    GR8FL
    Participant
    Thanks for your help.
    I will wait for an update since there is nothing else I can do then.
    #22356
    scrambler
    Moderator

    @weaver, if she does not see the 1.2.4 update, is there a place to download it?

    the download page only has 1.2.2

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