How to show different embed blocks on mobile and pc?

Site URL: https://oautima.squarespace.com/admin-test

Hello,

I have a problem with embedding html5 partner ads. Some of the ads are 700px wide or more, so when the web is used on a mobile device the ads are too wide and web is not user friendly. On the other hand, when opened on pc, ads which are narrower, around 300px look to small for  the screen. 

Is there any CSS or something else which could allow me to post both ads in my blogpost and than, according to the device on which the webpage is opened the appropriate ads are displayed. 

Link: https://oautima.squarespace.com/admin-test

Pass: fanta123

So I would like first and the second ad to be on a PC, and third, fourth and fifth on mobile device.

Thanks in advance!

I have made some progress.

Using this code:

@media only screen and (max-width: 768px) {#block-7c650aa4296c696a3798 {display: none;}

}

@media only screen and (min-width: 768px) {#block-7c650aa4296c696a3798 {display: none;}

}

I managed to hide embed boxes for desktop from mobile and vice versa.

But, my question now is:

Is there any code or something that could do this automatically?

With this one I have to copy paste #block for every embed box from "inspect element" on chrome.  

Hi. Do you want to resize ad size on mobile?

Yes. I would like  for mobile ads to be in 300x250px and pc ones to be in 728x90px. 

The thing is that I do not have banners which change according to the screen size, but they are fixed in the size in which they are supplied to me. 

So I have to publish both of them and then hide small one from pc and big one from mobile.

Thanks!

On 5/1/2021 at 4:33 PM, oautima said:

Yes. I would like  for mobile ads to be in 300x250px and pc ones to be in 728x90px. 

The thing is that I do not have banners which change according to the screen size, but they are fixed in the size in which they are supplied to me. 

So I have to publish both of them and then hide small one from pc and big one from mobile.

Thanks!

fanta123

incorrect password. Can you check it again?

Sorry, you can try now. 

Pass: fanta123

On 5/4/2021 at 12:36 AM, oautima said:

Sorry, you can try now. 

Pass: fanta123

Thank you, top add will appear on desktop or mobile?

Use can use this chrome extension to more easily find and copy blocks while editing on Squarespace:

Squarespace ID Finder