Mobile view adjustments

I have a bit of a general question about how difficult it would be to adjust the mobile layout in Omeka S. I am using the Lively theme, but I imagine that it’s Omeka that is handling the rendering of the pages for mobile. I haven’t used Wordpress, but someone in my organization said that Wordpress allows for mobile specific customization. Maybe there’s an Omeka module that I haven’t found that does something similar. A nudge in the right direction would be greatly appreciated.

What kind of adjustment are you trying to make?

In general though, the themes have pretty broad control over the whole display of a site, including mobile views.

We’re just wondering if we can make minor tweaks, such as adjusting the padding between page blocks for example. I’ll look into the theme we’re using and see if there’s a relatively easy way to go about that. Thank you.

Yes. CSS that you put in your theme’s /asset/css/style.css will be applied to your pages.
Use @media to change your CSS for small screens. Something like:

    #content .page-layout-normal {
                  padding-top: 2rem;
                  padding-bottom: 2rem
        }

    @media all and (max-width: 650px) {
          #content .page-layout-normal {
                  padding-top: 1rem;
                  padding-bottom: 1rem
          }
    }

Would reduce your padding for screens narrower than 650px.

Note: if you use Sass to create your CSS, you will have to make the changes in your .scss files instead of in your .css file.

1 Like

Perfect, this is so helpful!