Jump to content

Can't change mobile view! (mobile)

Recommended Posts

Hi! 

I've got a bit of very simple code built into my site so that my mobile and desktop appearences are slightly different. Now, I need to add a video embed block into my mobile version of the site so it displays exactly as the video embed on my desktop view but maintains the different buttons and background picture aspect ratio. 

When I go to remove the code so I can add in a new block, the whole thing seems to go haywire! I reached out to the support team at Squarespace but they advised me to come here due to the custom code. 

Help? Please? 

URL: https://www.bumbplanet.com/

 

Link to comment
  • Replies 8
  • Views 650
  • Created
  • Last Reply

Top Posters In This Topic

On 4/26/2024 at 9:49 AM, tuanphan said:

You mean video disappear on mobile

or you need to use different videos on desktop - mobile?

No, I need to use the same video but cause of the code, I can't actually add in a new block when I switch to mobile view. 

Link to comment
Posted (edited)
On 4/26/2024 at 9:49 AM, tuanphan said:

You mean video disappear on mobile

or you need to use different videos on desktop - mobile?

For context, here are some pictures. 

Screenshot 2024-04-28 at 16.57.55.png

Screenshot 2024-04-28 at 16.58.04.png

Edited by bumbplanet
More context
Link to comment
  • 3 weeks later...
On 4/30/2024 at 9:08 AM, tuanphan said:

Add Block, Block will appears on both Desktop + Mobile, so you need to change to Desktop Layout to add block

When I do this, it doesn't appear in the mobile preview because of my CSS coding.

Link to comment
5 hours ago, bumbplanet said:

When I do this, it doesn't appear in the mobile preview because of my CSS coding.

Please share your CSS code so the community can try and help.

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Website Developer
e: melody@melodylee.tech


💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Customisation help <- send me your design
 Did I help? I like coffee (Thank you)
🧰 See the tools I use (may contain affiliate links)


 

Link to comment
On 5/17/2024 at 9:22 PM, melody495 said:

Please share your CSS code so the community can try and help.

Sure thing, here you go: 

 

@media screen and ( max-width : 767px ) {

  [data-section-id="645bf7c41993a9492acbdf64"] {
  
    display : none;

    }

  }

@media screen and ( min-width : 768px ) {

  [data-section-id="6570fb87e4fa933c10d5becd"] {
  
    display : none;

    }
    
  }

Link to comment
43 minutes ago, bumbplanet said:

...

  [data-section-id="645bf7c41993a9492acbdf64"] {
      display : none;
}

....

...

  [data-section-id="6570fb87e4fa933c10d5becd"] {
      display : none;
}
....

Hi, these are section ids, so you are hiding an entire section depending on the screen size. Assuming you are trying to add a block to one of those sections, and the block "disappears" because it is inside one of the hidden sections.

Without knowing how you want the new block to behave in regards to the hidden sections, my only suggestion is to add the new block to a new section, so this new section is unaffected by your code.

Let me know how it goes.

 

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Website Developer
e: melody@melodylee.tech


💻 💁‍♀️ 1-2-1 Squarespace Training session <- feeling stuck and want to learn?
👩‍💻 💁‍♀️ Customisation help <- send me your design
 Did I help? I like coffee (Thank you)
🧰 See the tools I use (may contain affiliate links)


 

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.