Make SharePoint online team site Responsive

Question

I m in the middle of creating a team site (in Sharepoint online- not the modern site) for our organization, I have used all out of the box web parts and the page has one top row and three column.

So I want to make it render on mobile devices appropriately, currently on mobile, it shows only the libraries. I can disable the mobile view on site settings to display the site on mobiles, but I would like to make the site responsive so it will render in mobiles as required. Can someone please help me on this.

Also can someone please tell me how can I align (horizontally and vertically) the web parts in sharepoint page as I have many web parts on one row three column page layout. I m thinking to use tables and insert the web parts into rows and columns, is this the correct way to do this? or can someone please tell me what is the best way to do this.

Thanks.

Answer 1

You should be able to make the site responsive using the PnP tool for Responsive UI branding.

For the web parts to stack up vertically or horizontally, it depends on what kind of page you are using.

If its a publishing page from the "pages" library, you might need web part zones stacked in the way you need in a custom page layout. You should be able to get pointers on how this can be done using SharePoint designer.

If its a web part page, normally you would edit the page and change the layout from the "Modify column layout" option that allows you to create pages in different layouts.

Using rows and columns in a table could be a hard way to manage especially if you want them to behave responsively. You will have to make them in order for different screen sizes using complicated style elements in CSS. I wouldn't want to go that path.

Having said all these, I believe going the web part page option is easier to handle and probably the PnP tool would help them get to behave in a responsive manner.