Rearrange blog layout on mobile

[fastergrace]

Hey guys, I was wondering if any of you had any ideas on what the easiest way to rearrange the blog content and right content would be. www.paleoonthego.com/blog

As it is now, when the site shrinks, it rearranges the right column on top, and blog content on bottom, I would like to reverse that, and show blog articles first, and have the contents of the right column come AFTER that. Is there an easy way to do that?

I have been messing with the blog.html file, and it seems I only screw things up when I try. If you have any ideas please share!

Thanks.

[TMS Clint]

At a quick glance, it looks like the content on the right is in its own <div> and that it precedes the blog content in the HTML. If you can put the blog content in its own <div> or <section> and have it precede the navigation <div> in the HTML, then it should collapse the way you want it to.

[fastergrace]

Thanks, that's what I was seeing too. Seems as though the column div comes first as well. I will keep trying!! =)

[fastergrace]

So, I have them switched, but the blognav (right column) is not even starting to show up util the last post, so there is a ton of space above the column, and a ton of space below the last post. Any ideas?

[fastergrace]

the blognav is starting at the top of the LAST blog post. So basically it IS lining up at the top of the blog post, just not the top one, the bottom one.,

Any ideas?

[TMS Clint]

As of this post, your .blognav appears in the html before the .blogpost content. The .blogposts need to be in their own <div> or <section> instead of individually. Then you won't have to worry about them getting interrupted or stacking out of order.

<div id="mainContent" style="width: 100%;">     <section id="blog">      <div id="blogHeader" class="category-header">       <div class="blogNav">       <div class="blogPost">       <div class="blogPost">       <div class="blogPost">       <div class="blogPost">      <div class="blogPost">

[fastergrace]

Hey TMS, I actually switched everything back last night when I went to bed so customers wouldnt see the blog messed up. I will put the edited files back up so you can see where I got to last night. Give me just a few mins.

[fastergrace]

OK, it is back to where it was before. I moved the blognav to below the blogpost class in the blog.html file. So they are on the correct side, and will flow correctly now when shrunk down. BUT, the blog nav is starting at the top of the LAST blogpost. I even tried putting the blogpost div inside another div to see if maybe all the blogposts can be contained in there and the blognav would start at the top of that div. This is starting to sound confusing, I hope you can somewhat understand what I am saying =)

[TMS Clint]

It looks like you sectioned it off in the wrong place in the template. Each blog post is creating a <div> within a <div> within a <div> for each new post instead of containing all posts within one <div>. Check out the 3dcart Design Doc for the Blog Page. Generally speaking, the content inside items that repeat (like your blog posts) goes between the <!--START and <!--END of those sections. If you want it to contain all the content, you'll need to put it outside of those tags.

The design doc also shows the navigation below the content in the template, so I'm not sure why your default template has it another way.

[fastergrace]

The actual default template had a few other problems too I have fixed, but I can't complain too much, because it saved a lot of time customizing a template than writing all new coding.

Thanks again for the response, I will check out those design docs and see if I can't figure it out. =)

[fastergrace]

I think that did the trick! Thanks so much Clint.

Now to start one more help post, and then I will leave everyone alone for awhile.

Hopefully I am gaining enough knowledge to start helping others out soon.

[rcheltrvel]

When I switch to a responsive template, do I have to reformat every single blog? I have hundreds of formatted blog entries with pics and links and bolds and styles. SO CONFUSED! Thanks

[TMS Clint]

When I switch to a responsive template, do I have to reformat every single blog? I have hundreds of formatted blog entries with pics and links and bolds and styles. SO CONFUSED! Thanks

No, the content of the blog posts will be the same.