In order to edit layout or element properties on your Storable Website, you must have website builder access. If you do not have access to the full website builder, you can contact Support for assistance making changes at edgesupport@storable.com.

You can customize the properties of each Layout and Element on your webpages by editing your website content. To do so, click the button at the top right corner of the page to open the Properties panel of a layout or element.

When editing properties, consider how the page will look on all devices, including tablets and mobile devices. 

The following properties can be edited:

Size

• X axis - How far from the left side of the container does this element sit? Enter a percentage of the container.
• Y axis - How far from the top of the container does this element sit? Enter a percentage of the container.
• Width - The width of the element in relation to its container. Enter a percentage of the container. You can also manually adjust the element's width by clicking and dragging the side of the component.
• Height - The height of the element in relation to its container. Enter a percentage of the container. You can manually adjust the element's height by clicking and dragging the top or bottom of the component.

Design

The design section of the properties panel allows you to change how the element/container looks. Please note: Not all design properties can be edited for all Elements. 

• Background Color - The background color of the Layout or Element. You can use theme colors, solid colors, or gradients. 

• Background Image - The background image of the Layout or Element. You can upload a new one or use one from the media gallery.
• Border Color - The color of the border for the Layout or Element. You can use theme colors, solid colors, or gradients.
• Border Width - The width of the border in pixels.
• Corners - The radius in pixels for rounding the corners for the Layout or Element. You can modify each corner’s radius individually by clicking the corners icon.

Shadow - If the Apply Shadow toggle is enabled, the Layout or Element will include a shadow. You can control the distance (in pixels), size (in pixels), blur (in pixels), color (solid, theme, or gradient), and opacity (percentage).

Layout

The Layout section allows you to align and arrange content. For containers, you can determine how overflowed content will be handled. The align and arrange options are defined below: 

1 - Align to the left side of the container

2 - Align vertically within the container

3 - Align to the right side of the container

4 - Align on the top of the container

5 - Center in the container without impacting height

6 - Align to the bottom of the container

7 - Center exactly in the container, by both height and width

8 - Move this layer one layer forward in the layer stack

9 - Move this layer all the way to the front of the layer stack

10 - Move this layer one layer back in the layer stack

11 - Move this layer all the way to the back of the layer stack

For containers, the content overflow options are:

• Hide - Any content overflow will be hidden.
• Show - Any content overflow will be shown and extend past the bottom of the container.
• Scroll - The container will include a scrollbar if the content overflows.

Position

Position properties allow you to change padding and margins for all four sides of a container. 

Container padding can be edited by entering the number of pixels that should be included as padding on the top, bottom, left, and right sides of the container. 

Element margins can be edited by entering the number of pixels that should be included as margins on the element's top, bottom, left, and right sides. 

Adjust

You can control the following from the Adjust section: 

Rotate - Enter positive values to rotate the element clockwise up to 360 degrees (back to center). Enter negative values to rotate the element counterclockwise.

Scale - Enter the element's size as a percentage of the container. Please note: Entering values over 100% will cause the element to overflow the container. 

Skew - Enter a percentage along the X and Y axis to skew the element.

Translate - Enter a number of pixels along the X or Y axis to move the element within the container.