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

How can I hide an entire section from mobile and tablet view?


Go to solution Solved by tuanphan,

Question

Site URL: https://bluebird-porcupine-yzdg.squarespace.com/

I am currently using some code to hide an entire section from mobile view.

Site: https://bluebird-porcupine-yzdg.squarespace.com/

Pword: bluebird

The code I am using is:

@media screen and (max-width:767px) {
[data-section-id="5ef4c07482b8e941cd5ebc10"] {
    display: none;
}
}

How can I adjust this code so that the section is also hidden from tablet view?

Currently when I look at the page using my Surface Pro in tablet view, it still appears.

Please help!

Many thanks,

Best,

Faizal

Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

4 answers to this question

Recommended Posts

  • 1
/* this code for tablet - mobile */
@media screen and (max-width:991px) {
[data-section-id="5ef4c07482b8e941cd5ebc10"] {
    display: none;
}
}

 

You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan, work for a non-profit project (build free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. 

Link to post
  • 0

That code just hides based on screen width, not tablet/phone specific.

Most tablets and even some phones now are coming with higher screen resolution, so that's probably not a reliable way to do it.

Free Squarespace 7.1 Anchor Link and Accordion Plugins available here!

If I replied to one of your questions with code, it was either CSS or jQuery.

To add CSS, go to Design -> Custom CSS

jQuery needs some additional steps. Head here: https://code.jquery.com/ and click on minified, under jQuery 3.x and copy that code into Squarespace.

After you put that code into the code injection section in Squarespace, you can add the code I supplied. The code from me will need <script> added before it and </script> added after it (only for jQuery).

There are two places that you can add the code, one is site wide (adds to all pages). Settings -> Advanced -> Code Injection

The other is for a specific page (adds to one page only). Pages -> Gear Icon next to the page -> Advanced

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...