Jump to content

Move Blog pagination from bottom to top of post 7.1

Recommended Posts

  • Replies 9
  • Created
  • Last Reply

Top Posters In This Topic

  • 11 months later...
18 hours ago, frame61 said:

Hi

I have the same issue, how do you move pagination position from bottom of the page to middle or top? The paginations are currently at the bottom of all blog posts and project pages. Squarespace 7.1 any suggestions would be amazing thank you.

 

Can you share link to a blog post or project page? We can check easier.

Also what plan do/will you use?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 2/19/2021 at 9:25 PM, frame61 said:

Hi

https://www.hunterscanlon.com/blog-2/blog-post-title-one-d6jwa 

The plan is business, would be great to move it to the center or near the top 🙂 Any help would be great!

Thank you

 

Add to Blog Page Header

<style>
.view-item main#page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    padding-top: 100px;
}
  section.item-pagination.item-pagination--prev-next {
    padding-top: 0;
    padding-bottom: 5px;
}
  .view-item #page section:first-child {
    padding-top: 10px !important;
}
</style>
  

image.thumb.png.bd9723ce05b0b06f46a16c0fdf981edf.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 2/25/2021 at 10:16 PM, frame61 said:

Amazing thank you so much!! You're the best tuanphan

Hi. I see your site has small problems.

1. (Mobile footer) 2 lines here

hunterscanlon.com-mobile-footer-min.png

2. (Tablet homepage) Line under Gallery, this doesn’t appear on Desktop

hunterscanlon.com-tablet-homepage-min.pn

3. (Tablet contact) Text break

hunterscanlon.com-tablet-contact-min.png

4. (Tablet about) Similar 3

hunterscanlon.com-tablet-about-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...
On 2/22/2021 at 7:30 AM, tuanphan said:

Add to Blog Page Header


<style>
.view-item main#page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    padding-top: 100px;
}
  section.item-pagination.item-pagination--prev-next {
    padding-top: 0;
    padding-bottom: 5px;
}
  .view-item #page section:first-child {
    padding-top: 10px !important;
}
</style>
  

image.thumb.png.bd9723ce05b0b06f46a16c0fdf981edf.png

@tuanphanI attempted to use your code and it worked, but because I've added a banner to my blog posts, your code also switched the banner image to the bottom of the page. I'm hoping to display the pagination just underneath the banner, closer to the middle of the page. Is this possible? Thank you!

Screen Shot 2021-04-03 at 3.09.05 PM.png

Link to comment
On 4/3/2021 at 9:14 PM, JaclynRavae said:

@tuanphanI attempted to use your code and it worked, but because I've added a banner to my blog posts, your code also switched the banner image to the bottom of the page. I'm hoping to display the pagination just underneath the banner, closer to the middle of the page. Is this possible? Thank you!

Screen Shot 2021-04-03 at 3.09.05 PM.png

Can you share link to blog in screenshot? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.