Announcement

Collapse
No announcement yet.

Rearrange blog layout on mobile

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Rearrange blog layout on mobile

    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.

  • #2
    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.
    Webmaster: Texas Media Systems

    Comment


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

      Comment


      • #4
        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?

        Comment


        • #5
          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?

          Comment


          • #6
            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.

            HTML Code:
            <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">
            Webmaster: Texas Media Systems

            Comment


            • #7
              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.

              Comment


              • #8
                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 =)

                Comment


                • #9
                  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.
                  Webmaster: Texas Media Systems

                  Comment


                  • #10
                    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. =)

                    Comment


                    • #11
                      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.

                      Comment


                      • #12
                        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

                        Comment


                        • #13
                          Originally posted by rcheltrvel View Post
                          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.
                          Webmaster: Texas Media Systems

                          Comment

                          Working...
                          X