Summary : This article explains how to manage the devices used within the Studio to preview how pages will render on specified devices.
Devices are used within the Studio to allow authors to preview how their page will render on a specified device.
Go to [Administration] > [Design] > [Devices]. The following view will be presented:
Click on the name of a Device to edit the details. See the table below for information on editing the fields.
To add a new Device to the Studio click [Add]. The following view will be presented:
Configure as required, then click [Save].
|Type||Select the appropriate type for the Device being added.|
|Name||Enter the name of the Device.|
|Active||Check to add the Device to the list of devices within the Studio.|
|Width/Height||Enter appropriate dimensions for the device screen.
Note that the dimension should be entered as CSS pixels, rather the actual pixel width of the screen. A number of online resources contain information on the CSS pixels of appropriate devices.
|Screen Offset||If a Device Image is uploaded the Screen offset is used to add padding to the iframe to ensure that the device screen sits correctly within the image.|
|Allow Device Orientation||Device Orientation allows the device to be emulated in Landscape or Portrait. Check to enable.|
|Image||If required, click Choose File to select an image of the Device.
The page content is presented in an iframe which sits on top of the device image.