How do I style my dynamic date and venue elements? (Designer Pro)

 If you've created any Splash page, odds are you've seen our dynamic date and venue elements.

_b7397f6fdda5326eb7f42422a2e36c1f__Screen_Shot_2017-08-11_at_11.34.50_AM.png

These elements dynamically (key word here!) pull information from the Date, Time, & Venue inputs in your Settings tab.

_fcc3ae696f477ddf8f8319453e4dac35__Screen_Shot_2017-08-11_at_11.38.16_AM.png

But we get it - sometimes the default formatting is not ideal for your specific needs or design vision. No sweat! We'll take you through the step-by-step instructions for styling these elements with ease.

How to access the date and venue editor

There are two ways to open up our date and venue editor!

On-page (spoiler alert - it's the quickest way!)

1. Hover over your date element

2. Click the Date icon on the left

Screen_Recording_2017-08-11_at_11.57_AM.gif

Alternatively for venue elements...

1. Hover over the venue element

2. Click the Venue icon on the left

Screen_Recording_2017-08-11_at_12.00_PM.gif

Via the Layout tab

1. Click into your Date or Venue element

2. Pop into Format Date & Time or alternatively Format Venue

Screen_Recording_2017-08-11_at_12.05_PM.gif

Using the editor to stylize your date and time

Each piece of your date and time is separated into its own segment.

Clicking into each segment will display a dropdown where you're free to change the format:

Screen_Recording_2017-08-14_at_12.18_PM.gif

You can also click into any pre-existing text to change the language:

Screen_Recording_2017-08-14_at_12.19_PM.gif

To add a new component, simply click the blue "+" sign at the end of your line:

Screen_Recording_2017-08-14_at_12.22_PM.gif

You'll notice you're presented with several options: Start Day, Start Day of the Week, Start Month, Start Year, Start Time, End Time, and Custom (a blank input where you can enter any text!).

And to switch around the order, simply click and drag each component:

Screen_Recording_2017-08-14_at_04.28_PM.gif

Feel like your line is getting a bit long? Pop into L2 to add these components to a separate line:

Screen_Recording_2017-08-14_at_12.25_PM.gif

Looking to ditch a component? Simply drag it to the bottom of the editor window where a nifty trashcan will appear:

Screen_Recording_2017-08-14_at_12.28_PM.gif

Using the editor to stylize your venue

The process of editing your dynamic venue element is identical!

Check out an example of adding and re-arranging venue components using that blue "+" button:

Screen_Recording_2017-08-14_at_04.32_PM.gif

 

Your choices here are Venue Name, Address, City, State, Zip Code, Country, and Custom (aka anything you'd like!).

Was this article helpful?
0 out of 0 found this helpful