g Text Version
Beauty & Self
Books & Music
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
News & Politics
Religion & Spirituality
Travel & Culture
TV & Movies

Bored? Games!
Take a Quiz
Rate My Photo

Natural Living
Folklore and Mythology
Distance Learning

All times in EST

Low Carb: 8:00 PM

Full Schedule
g Digital Art and Design Site

BellaOnline's Digital Art and Design Editor


Wix Events Layout Design Options

In this tutorial, we will begin to design the Wix Events app to match our existing wedding website. The Wix Events app is very flexible in that it has many options for how the wedding details and RSVP button are displayed on the webpage.

Let's find out how to customize the Layout design settings for the app. Open the webpage containing the Wix Events app and select the app.

  1. Click the Settings button to open the Settings window.

  2. Click My Events from the menu on the left and then select the Our Wedding event.

  3. Choose Layout from the left menu and let's take a look at all the options.

    General Layout

    Horizontal: We can keep the default Horizontal option with the image placed to the side of the text.

    Vertical: The Vertical option will place the image above the text.

    Compact: This option places the text and button over the image. This is a good option when you have little space on the page.

    Button: With this option, we will only display the RSVP button. This is a good option when you want to put an RSVP button on several pages of the website.

    Image Layout

    We can turn off the image using the toggle button and only the text and button will be displayed. If we keep the image displayed, we can customize the image further.

  4. Click the Customize Image link to display the options.

    Position: Our first decision is to place the image to the right or left of the text.

    Proportions: Use the slider control to set what percentage of the display is dedicated to the image and to the text. As you can see, we can set the image to two thirds of the display and the text to one third.

    In the Advanced Settings, we can control what part of the image is displayed.

    Resize Options

    Fit: This will reduce the image until all of the image is displayed. If the image doesn't fill the space, the background color will show.

    Crop: This is the default setting. It displays as much of the image as possible and will crop the image if necessary. When using this setting, we can use the Position grid to determine what part of the image will be seen.

    Let's go back to the top of the Customize Image settings and click the Back button to go back to the main Layout options. Under the Customize Image link, we have the Text Layout section with three options.

    Text Layout

    Vertical: This option will place the event Title, When and Where information, RSVP button and the social icons in a vertical list in that order.

    Side by Side: This option will place the When and Where information side by side.

    Compact: This option will place the When and Where on the same line.

Join us in the Animation forum. | Join us in the Digital Art forum.


Add Wix+Events+Layout+Design+Options to Twitter Add Wix+Events+Layout+Design+Options to Facebook Add Wix+Events+Layout+Design+Options to MySpace Add Wix+Events+Layout+Design+Options to Del.icio.us Digg Wix+Events+Layout+Design+Options Add Wix+Events+Layout+Design+Options to Yahoo My Web Add Wix+Events+Layout+Design+Options to Google Bookmarks Add Wix+Events+Layout+Design+Options to Stumbleupon Add Wix+Events+Layout+Design+Options to Reddit


RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map

For FREE email updates, subscribe to the Digital Art and Design Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2015 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.


g features
How to Create Patterns in Illustrator

Multiple Artboard Template in Photoshop CC

Design & Bind Your Creative Portfolio - Skillshare

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2016 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor