Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
chrissygray

Custom CSS to change block order

Question

Website: https://vibraphone-plantain-39ts.squarespace.com/media

On the Media page, the blocks are meant to be read left to right, however on mobile view this is changed from top to bottom of the first column, then top to bottom of the second column.

I am looking for the CSS to change the mobile view to:

Block 1
Text 1 (Garden House)
Block 2
Text 2 (Road House)
Block 3
Text 3 (Road House)
Block 4
Text 4 (Road House)
Block 5
Text 5 (Hideout House)

Any assistance here would be greatly appreciated! Thanks!

Edited by chrissyg
Initial Revision

Share this post


Link to post

7 answers to this question

Recommended Posts

  • 0

No, it doesn't affect your layout, just the flow. For example, here's a quickly assembled video showing four blocks. To start with they are in columns like yours and they show up in the 'wrong' order on mobile. Rearrange them into rows and they appear correctly.

alt text


World-class Squarespace Developer and Squarespace Circle Leader with a strong reputation on the Squarespace Forum.
I'm trusted by hundreds of Squarespace users worldwide, including designers, freelancers, business owners and big agencies.

I can tackle anything from small tweaks to full websites and I'm available for short and long bookings (min. 1 hour).
Book via my website giving as much notice as possible. Note that I'm usually booked six weeks in advance for jobs longer than an hour.
Prebuilt Squarespace Extensions
Custom Squarespace Extensions: Tell me about the functionality you need

 

Share this post


Link to post
  • 0

You don't need CSS or code to correct this behaviour. Instead, you need to drag the blocks into the correct places. I know this may sound unlikely, but trust me. When you add blocks to the page you are adding them to a grid. In this case, you've created two columns, and placed blocks in them. This is why they compress in the way that they do.

Instead you need to drag them so that you create rows, not columns. It's easier to do by adding some line blocks to the page and then placing the blocks between them. Then remove the lines when finished. If you need help with this, let me know.


World-class Squarespace Developer and Squarespace Circle Leader with a strong reputation on the Squarespace Forum.
I'm trusted by hundreds of Squarespace users worldwide, including designers, freelancers, business owners and big agencies.

I can tackle anything from small tweaks to full websites and I'm available for short and long bookings (min. 1 hour).
Book via my website giving as much notice as possible. Note that I'm usually booked six weeks in advance for jobs longer than an hour.
Prebuilt Squarespace Extensions
Custom Squarespace Extensions: Tell me about the functionality you need

 

Share this post


Link to post
  • 0

@Paul2009 Thanks for your response! Will this change the look of the desktop view? The way it's currently laid out on the desktop is the way I'd like it to remain. If you could explain what you mean a bit more I'd appreciate it. When I try dragging the top two videos around, for instance, I don't see any other way than to make those two columns. Thank you!

Share this post


Link to post
  • 0

@Paul2009 Thanks for your response! Will this change the look of the desktop view? The way it's currently laid out on the desktop is the way I'd like it to remain. If you could explain what you mean a bit more I'd appreciate it. When I try dragging the top two videos around, for instance, I don't see any other way than to make those two columns. Thank you!

Share this post


Link to post
  • 0

No, it doesn't affect your layout, just the flow. For example, here's a quickly assembled video showing four blocks. To start with they are in columns like yours and they show up in the 'wrong' order on mobile. Rearrange them into rows and they appear correctly.

alt text

Edited by Paul2009
Initial Revision

World-class Squarespace Developer and Squarespace Circle Leader with a strong reputation on the Squarespace Forum.
I'm trusted by hundreds of Squarespace users worldwide, including designers, freelancers, business owners and big agencies.

I can tackle anything from small tweaks to full websites and I'm available for short and long bookings (min. 1 hour).
Book via my website giving as much notice as possible. Note that I'm usually booked six weeks in advance for jobs longer than an hour.
Prebuilt Squarespace Extensions
Custom Squarespace Extensions: Tell me about the functionality you need

 

Share this post


Link to post
  • 0

Got it! Thank you so much! I was having a little bit of trouble with the text that was supposed to be below each image block but I changed those to captions instead of text blocks and it did the trick. Much appreciated!!

Share this post


Link to post
  • 0

Got it! Thank you so much! I was having a little bit of trouble with the text that was supposed to be below each image block but I changed those to captions instead of text blocks and it did the trick. Much appreciated!!

Share this post


Link to post
Guest
This topic is now closed to further replies.

×
×
  • Create New...