Side by Side Editing
One of the great things about Showit is the creative freedom you have in manipulating your mobile and desktop design independently. To help you do so we have created the side-by-side editor view in the Design App so you can see how changes are affecting each version of your site as you build it!
As you add assets to your desktop design, you will see those same assets added to your mobile design. This is why we suggest designing in the side-by-side view so you can tweak both versions as you go, leaving less to do when you are ready to fine-tune your mobile design. Items such as Canvas Height, Font Settings, element placement, and most other canvas settings are adjusted independently between your mobile and desktop design.
Mobile & Desktop Design Tools
There are also built-in tools for customizing your Mobile and Desktop design independently, or removing elements or even entire canvases from one layout or the other.
Split / Merge
If you would like specific aspects of your site to look one way on your desktop layout and another way on your mobile layout, you can use the Split/Merge feature. The Split/Merge feature can be utilized to split or merge the Desktop and Mobile Design for different types of design elements and features within Showit.
Split/Merge will allow you to independently edit the settings of Canvas Backgrounds and Page Backgrounds between your mobile and desktop design, as well as set the Type Styles within your Design Settings independently.
To split or merge your desktop and mobile design, simply hover your cursor over the item you would like to change (Backgrounds or Type Styles)
You can see this in action below:
If you decide that you would like to merge your desktop and mobile design once more you can do so by clicking on the same three dots and choosing to Merge.
You can also use Split/Merge on the Type Styles set within your Design Settings. To do so, open you design settings and choose one of the type style settings that you would like to adjust for one of your type styles. Then hover over that setting and click on the three dots to the right of the setting, and select Split Mobile & Desktop.
You will then be able to edit this setting independently between your mobile and desktop design. If you would like to merge this again, simply click on the three dots again and choose to either Merge Using Mobile or Merge Using Desktop.
You can show or hide elements within your canvases between the mobile or desktop design by using toggle switches found in the left side Properties Panel next to each element layer on each canvas. There are two toggle switches; one looks like a mobile device and the other like a computer monitor. These switches control if elements are visible on the desktop and mobile design. These icons, when white, indicate that element is visible on the respective version of the site for which the icons are white. If they are greyed out, that means that element is off for the respective design.
Hide a Canvas Using Visible On...
You can also hide an entire canvas from either your mobile or desktop design. This can be done by going to the Page Tab in the left side Site Panel and clicking on the three dots to the right of the canvas' name, then unchecking one of the boxes that reads Visible On... to remove the visibility of that entire canvas from either design.
There is a built in design tool that will allow you to copy over design settings and the relative position of elements within a canvas. Check out this article here for more information.