Problems on multiple screen sizes

Guys, I don’t even quite know what to ask — I’m not even sure if I can describe the problem. (I know, don’t laugh at the prospect of asking for help for something that I can’t totally describe).

I’ve had a simple website for a couple of years. Yesterday, I started adding a shopping cart. I added about 30 pages and 60 buttons tied to Snipcart. Everything looked good on my Mac working in the wide desktop format. Next, I wanted to clean it up and test it on the different platforms.

But I broke something between all of the versions. When I look at the tablet layout, some of my labels had disappeared. They’re still in the list of layers and they’re the first layer listed (so they’re not hidden under another item). I finally found them shrunk down to a point in the upper-lefthand corner. I haven’t been able to expand them all. (Maybe someone knows a trick for that.) But one that I expanded had the text in reverse even! And the buttons are too small and don’t show all of the “Add to cart” text.

Any recommendations so that I don’t have to manually build all 40 or so pages for each device? I went to one of the pages and changed the device setting to automatically scale instead of using a custom layout. But it didn’t put my labels back where they belong. Maybe I’ll turn off the phone options, but that’s still a lot of customization that I wasn’t prepared for — and I’m looking at redoing it every month.

Let me tell you the method I used.
While working for desktop, I go to check the mobile version simultaneously.
After creating 1 page, I continue by duplicating that page. It’s much easier this way.

1 Like