Editing on Mobile

How to make your website work on mobile

Bryan

Last Update 3 years ago

Over half of your website visitors will come to your website on their mobile phones. This means your mobile website can't be an afterthought, it needs to be as good as your desktop website. PoliEngine automatically creates a mobile version of your site from your desktop design. While this might get you close to where you want to go, there may be some changes you'd like to make between desktop and mobile. They are two very different formats and different design considerations.


Thankfully, editing on mobile is simple with PoliEngine.


To edit your mobile site, click on the "Mobile" icon in the bottom left of your editor.

Here you see the mobile version of your site. 

From here you can scroll through and see what your site may look like. When you mouse over the block you'll see a number of options to help you make your site exactly as you'd like it.


Note: Any change you make on your mobile site from here will be reflected on your desktop. If you want to make a mobile specific change you need to hide

1.) This option allows you to "Hide" this section on mobile and tablet. From there, you can add a "Container" widget using the plus sign on the left and it will create a container that will only be shown on mobile and tablet. With that you can create an entirely different website on mobile than on desktop if you so choose.

2.) "Stretched" means that each widget in the block is stretched to each edge, so that your website can be viewed vertically on the phone instead of horizontally. In most instances this is the right decision, to make sure everything is readable in the tighter format of a phone. However, in some instances you may be able to just deselect the STRETCHED option to get the look and feel you want.

3.) REVERSE COLUMN ORDER means that the stretched columns will be reversed. By default these columns will put the leftmost column up top and move right, this will reverse that to put the rightmost column up top.

Editing Text Styling

Editing text styling can be tricky. Every change you make to the mobile version will show also on the desktop version. An easier way to do this would be to adjust the mobile and desktop writing in Global Styling on your left side menu.

If you've already made changes you might find that your fonts don't match across the page. To revert back to the original text design highlight over the text that you made changes to, select the "EDIT" button, and then select the erase button at the end to delete all styling.

Was this article helpful?

0 out of 0 liked this article

Still need help? Message Us