Wix Editor: Strips and Columns on Your Mobile Site

When using strips or columns on your desktop site, they are displayed differently on your mobile site. Instead of being arranged horizontally, strips and columns are displayed vertically in order for them to fit and suit mobile screens.

You can adjust the way the strips and columns look on mobile by changing their spacing, order, and size. You can also hide strips and columns if they're not necessary for mobile.

Learn how to adjust and customize:

• Strips on your mobile site

• Columns on your mobile site

Did you know?

Wix automatically creates your mobile-friendly site using the content from your desktop site, so you don't have to start from scratch.

---

Adjusting strips on your mobile site

Change the size and order of strips to suit your mobile site's alignment. You can also hide a strip if it's not relevant to the content of your mobile site, and add a cool scroll or animation effect.

To adjust strips for mobile:

1. Open your site in the mobile editor.

2. Click the relevant strip.

3. Choose how you want to adjust the strip:

Resize your strip

Drag the stretch handle up or down to make the strip larger or smaller.

Reorder your strips

Click the Move Up or Move Down arrow until the strip is in the desired position.

Hide a strip

Click the Hide Element icon

.

Add an effect to your strip

Click the Animation icon

and choose whether to add a background scroll effect or an entrance animation to the strip. Learn more about animation and scroll effects on your mobile site

Note: It is not possible to add effects to a strip that contain columns.

---

Customizing columns on your mobile site

Customize columns on your mobile site to keep your content clear and engaging. You can adjust settings such as the size, spacing, and order.

To adjust columns for mobile:

1. Access the mobile editor.

2. Click the relevant strip.

3. Choose how you want to adjust your columns:

Resize your columns

1. Click the relevant column in the strip.

2. Drag the stretch handle up or down to make the column larger or smaller.

Hide a column

1. Click the relevant column in the strip.

2. Click the Hide Element icon

   

   .

Reorder your columns

1. Click Manage Columns.

2. Select a column under Pick a column.

3. Click the Move Up or Move Down arrow until the column is in the desired position.

Adjust the background space

Adjust the spaces on your columns. You can increase it to fit any other elements you wish to display, or reduce it to ensure that background photos aren't cropped.

1. Click the relevant column in the strip.

2. Click the Background icon

   

   .

3. Select the background spacing:

   • None: The column has no spaces.

   • Top: A space is created at the top of the column.

   • Bottom: A space is created at the bottom of the column.

4. Drag the Spacing slider to increase or decrease the size of the space.

Change the spacing of your columns

1. Click the Layout icon

   

   .

2. Drag the Column Spacing slider to increase or decrease the gap between the columns, or enter a value.

3. Drag the Top & Bottom Padding slider to increase or decrease the space between the top and bottom of the strip, or enter a value.

Add an effect to your columns

Click the Animation icon

and choose whether to add a background scroll effect or an entrance animation to the column. Learn more about animation and scroll effects on your mobile site

This article is credited to the Wix team - https://support.wix.com/ and we thank them for that!