Tutorials



HOW TO ADD AN EVENT

This tutorial shows the user how to add an event in the Squarespace Platform. While most of this tutorial is useful for the general public, it is in fact created specifically for the Veritas Classical Academy and its needs.

Add new events to your site on the Upcoming Events page located in the Not Linked section of the Pages menu. 

In the Events Page panel, click the + icon to add a new event. In the Edit Event window, set up the event details:

  • Enter the event's title.
  • Click the date links to select the event's start time and end time (required). Event times are shown in your Business' timezone (CST)
  • Add a description of the event in the Description box. It includes a Text Block to get you started. Add other blocks to create a custom layout for the event, just as you can do with any page or blogpost.
  • Tip: To collect RSVPs or bookings for an event, add a Form Block or a block leading to a third-party booking service to the Description box. You can also add a Button Block to an external link if you use a third-party booking or event service.
  • Add a category: You can use tags and categories to organize events. Information category propagates to specific information pages throughout the site. Click the Tags + or Categories + link to label your event. Formatting tips: Categories must be 25 characters or fewer and Tags and categories are case-sensitive. For example, entering Applesapples, and APPLES creates three ta s or categories.

Options Tab

Add an excerpt: Excerpts show visitors a short description of the event. To add an event excerpt, click the Options tab and add text to the Excerpt box.

Location Tab

Set the event location: Click the Location tab to add an address for the event. When you start typing an address, the fields populate with a list of autocomplete suggestions powered by Google. This creates a pin on the map at that location.

Social Tab

If you have connected accounts that allow for pushing content, you can automatically share the event on your social profiles when publishing it. From the Social tab, switch the share toggle to on for any accounts where you want to share this event. To learn more, visit Sharing content on social media.

Note: Pushing an event to Facebook doesn't create a Facebook event. Instead, it displays a link to the event on your site with a description

Save & Publish

After creating an event, you can save it as a draft, or make it live immediately.   

  • Click Save to save your event as a Draft that's hidden from your live site.
  • Click Save & Publish to close the editor, save the event, and make it visible on your live site.

After saving the event, choose from four visibility options: Published, Scheduled, Needs Review, Draft. ScheduledNeeds Review, and Draft can be helpful if you want to upload content to your site but don’t want to make it immediately visible. To change any event's status, click the event thumbnail in the Events Page panel and then click Edit. From the editor, click the current status and select a new one.

FAQ

Can I add recurring events?

It's not currently possible to create recurring events, but you can duplicate events to create identical events without reentering the same information.

Can I push events to my Facebook Brand page?

You can push your events to your Brand page if it's connected in Connected Accounts. This shares the event from your site on Facebook, but it doesn't create an actual Facebook event.

 

HOW TO ADD A STAFF MEMBER PICTURE & BIO

This video shows how we use the blog functionality to display a list of staff members with their bio and pictures.
  1. Go to the Not Linked section of the Pages Navigation
  2. Click on Staff blog feed
  3. When the feed loads, Click the + to get started with adding a new Staff member picture & bio
  4. Enter the Staff name & title.
  5. Add some content regarding the staff member in the Text Block. Add other blocks if you want.

Options Tab- REQUIRED FOR STAFF POSTS

Add an excerpt: This is very important because this is the information that actually displays with the staff picture in the site. You will want to add the FULL content here for Staff. Click the Options tab and add text to the Excerpt box.

Add a Thumbnail: This is the staff picture that will show on the site.

Save & Publish

You can save it as a draft, or make it live immediately.   

Click Save to save your post as a Draft that's hidden from your live site.
Click Save & Publish to close the editor, save the post, and make it visible on your live site.
After saving the post, choose from four visibility options: Published, Scheduled, Needs Review, Draft. Scheduled, Needs Review, and Draft can be helpful if you want to upload content to your site but don’t want to make it immediately visible. To change any post status, click the post thumbnail in the Staff Page panel and then click Edit. From the editor, click the current status and select a new one.

 

HOW TO ADD A NEW JOB POSTING OR REMOVE ONE

  1. Go to the Not Linked section of the Pages Navigation
  2. Click on Job Openings blog feed
  3. When the feed loads, Click the + to get started adding a new position
  4. Enter the position name in the title
  5. Add some content regarding the job/position in the Text Block. Add other blocks if you want, like a button to email you.

Adding a Button to Send an Email

Hover over the blocks in the Content area to get the black insert line. Click the insert drop to open the content menu. Either click on Button or search for Button to click on the menu item.

Add button text - In the Text box, enter text for the button label. Tip: Keep the button text under 25 characters. Longer text can interfere with the button's design and may be cut off on narrower displays. Buttons are best when they use short text to encourage an action. For longer text, you can create a text link.

Add a link - Click Click to add URL... to select the destination when a visitor clicks the button. You can select an external link, a file, or content on your site. To add an email, make the External URL as follows:  mailto:email@email.com

Edit the button size - Select Large, Medium, or Small from the Size drop-down menu.

Set the button alignment - Select Right, Left, or Center from the Alignment drop-down menu.

Save - Click Apply to save your changes.

Add a category

You can use tags and categories to organize job openings. Click the Tags + or Categories + link to label your position. Formatting tips: Categories must be 25 characters or fewer and Tags and categories are case-sensitive. For example, entering Applesapples, and APPLES creates three ta s or categories.

Options Tab - Excerpt

Add an excerpt: This is very important because this is the information that actually displays under the position title in the site. Click the Options tab and add text to the Excerpt box.

Save & Publish

You can save it as a draft, or make it live immediately.   

Click Save to save your post as a Draft that's hidden from your live site.
Click Save & Publish to close the editor, save the post, and make it visible on your live site.
After saving the post, choose from four visibility options: Published, Scheduled, Needs Review, Draft. Scheduled, Needs Review, and Draft can be helpful if you want to upload content to your site but don’t want to make it immediately visible. To change any post status, click the post thumbnail in the Staff Page panel and then click Edit. From the editor, click the current status and select a new one.


Custom Code

CHRISTIAN WORLDVIEW

The school is Christ-centered. We partner with parents to instill excellence of character and fill our children with Godly wisdom.
Read More→

UNIVERSITY SCHEDULE

Children are with a trained, professional teacher in a classroom setting for 2 days a week.
Read More→

CLASSICAL CURRICULUM

We follow an academically rigorous methodology that is based on the Trivium.
Read More→

COST EFFECTIVE TUITION

Tuition for the Classical Core courses is approximately 40% of traditional private school.
Read More→

/*This is a 4 column CSS styled section where SVG icons are featured
in the top of the column with the text below. This inherits some
styling from the h2 class, including font, font size, colors, in-line
link color, normal text font and other styling.
Other styling is defined in the Custom CSS code mentioned on this page.*/
<div class="row" style="width:100%">
    <div class="column" >
        <center>
            <h2>
                <svg height="100" style="fill:#ffffff;" viewbox="0 0 252 252" width="200" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px">
                    <g fill="none" fill-rule="nonzero" font-family="none" font-size="none" font-weight="none" stroke="none" stroke-dasharray="" stroke-dashoffset="0" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1" style="mix-blend-mode: normal" text-anchor="none">
                        <path d="M0,252v-252h252v252z" fill="none">
                        </path>
                        <path d="M126,252c-69.58788,0 -126,-56.41212 -126,-126v0c0,-69.58788 56.41212,-126 126,-126v0c69.58788,0 126,56.41212 126,126v0c0,69.58788 -56.41212,126 -126,126z" fill="#EBB303">
                        </path>
                        <g fill="#ffffff">
                            <g id="surface1">
                                <path d="M113.2425,70.7175v25.515h-25.515v25.515h25.515v59.535h25.515v-59.535h25.515v-25.515h-25.515v-25.515zM121.7475,79.2225h8.505v25.515h25.515v8.505h-25.515v59.535h-8.505v-59.535h-25.515v-8.505h25.515z">
                                </path>
                            </g>
                        </g>
                    </g>
                </svg>
            </h2>
            <h2>
                <b>
                    CHRISTIAN WORLDVIEW
                </b>
            </h2>
            <p>
                The school is Christ-centered. We partner with parents to instill excellence of character and fill our children with Godly wisdom.
                <br>
                    <a href="/christian-worldview" style="color:#EBB303">
                        Read More→
                    </a>
                </br>
            </p>
        </center>
    </div>
    <div class="column" >
        <center>
            <h2>
                <svg height="100" style="fill:#f1c40f;" viewbox="0 0 252 252" width="200" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px">
                    <g fill="none" fill-rule="nonzero" font-family="none" font-size="none" font-weight="none" stroke="none" stroke-dasharray="" stroke-dashoffset="0" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1" style="mix-blend-mode: normal" text-anchor="none">
                        <path d="M0,252v-252h252v252z" fill="none">
                        </path>
                        <path d="M126,252c-69.58788,0 -126,-56.41212 -126,-126v0c0,-69.58788 56.41212,-126 126,-126v0c69.58788,0 126,56.41212 126,126v0c0,69.58788 -56.41212,126 -126,126z" fill="#EBB303">
                        </path>
                        <g fill="#ffffff">
                            <path d="M126,83.16c-0.67747,0.00049 -1.34429,0.16857 -1.94104,0.48927l-57.45323,28.7226v0.00802c-1.3536,0.70685 -2.20321,2.1064 -2.20573,3.63344c0.00252,1.52704 0.85213,2.92659 2.20573,3.63344v0.00802l57.42917,28.70656c0.60246,0.33015 1.27812,0.5039 1.96511,0.50531c0.67747,-0.00049 1.34429,-0.16857 1.94104,-0.48927l57.41313,-28.70656c0.0134,-0.00528 0.02677,-0.01062 0.04011,-0.01604v-0.00802c1.3536,-0.70685 2.20321,-2.1064 2.20573,-3.63344c-0.00252,-1.52704 -0.85213,-2.92659 -2.20573,-3.63344v-0.00802l-57.42917,-28.70656c-0.60246,-0.33015 -1.27812,-0.50389 -1.96511,-0.50531zM183.49333,129.78511l-8.21333,4.10667v36.64719c-2.44607,1.42201 -4.10667,4.03977 -4.10667,7.07437c0,4.53787 8.21333,16.42667 8.21333,16.42667c0,0 8.21333,-11.8888 8.21333,-16.42667c0,-3.0346 -1.6606,-5.65236 -4.10667,-7.07437zM89.04,140.04375v17.03625c0,11.33851 16.54576,20.53333 36.96,20.53333c20.41424,0 36.96,-9.19483 36.96,-20.53333v-17.03625l-31.35344,15.68073c-0.34496,0.17248 -0.68953,0.31403 -1.04271,0.43313c-1.48661,0.61189 -3.01564,0.92239 -4.56385,0.92239c-1.54411,0 -3.06941,-0.3105 -4.54781,-0.92239c-0.35728,-0.11909 -0.70968,-0.26456 -1.05875,-0.44115z">
                            </path>
                        </g>
                    </g>
                </svg>
            </h2>
            <h2>
                <b>
                    UNIVERSITY SCHEDULE
                </b>
            </h2>
            <p>
                Children are with a trained, professional teacher in a classroom setting for 2 days a week.
                <br>
                    <a href="/university-schedule" style="color:#EBB303">
                        Read More→
                    </a>
                </br>
            </p>
        </center>
    </div>
    <div class="column" >
        <center>
            <h2>
                <svg height="100" style="fill:#000000;" viewbox="0 0 252 252" width="200" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px">
                    <g fill="none" fill-rule="nonzero" font-family="none" font-size="none" font-weight="none" stroke="none" stroke-dasharray="" stroke-dashoffset="0" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1" style="mix-blend-mode: normal" text-anchor="none">
                        <path d="M0,252v-252h252v252z" fill="none">
                        </path>
                        <path d="M126,252c-69.58788,0 -126,-56.41212 -126,-126v0c0,-69.58788 56.41212,-126 126,-126v0c69.58788,0 126,56.41212 126,126v0c0,69.58788 -56.41212,126 -126,126z" fill="#EBB303">
                        </path>
                        <g fill="#ffffff" id="original-icon">
                            <g id="surface1">
                                <path d="M76.125,68.04c-1.4458,0 -2.625,1.1792 -2.625,2.625v94.5c0,1.45606 1.1792,2.625 2.625,2.625c31.65381,0 44.16357,7.04443 47.25,9.1875v-96.71484c-6.48047,-5.01416 -20.42578,-12.22266 -47.25,-12.22266zM175.875,68.04c-26.82422,0 -40.76953,7.2085 -47.25,12.22266v96.71484c3.08643,-2.14307 15.60645,-9.1875 47.25,-9.1875c1.45606,0 2.625,-1.16894 2.625,-2.625v-94.5c0,-1.4458 -1.16894,-2.625 -2.625,-2.625zM67.83984,83.79c-4.12207,0 -7.46484,3.34277 -7.46484,7.46484v87.44531c0,4.12207 3.34277,7.46484 7.46484,7.46484h43.64063c1.86621,2.57373 6.63428,7.875 14.51953,7.875c7.88525,0 12.65332,-5.30127 14.51953,-7.875h43.64063c4.12207,0 7.46484,-3.33252 7.46484,-7.46484v-87.44531c0,-4.12207 -3.34277,-7.46484 -7.46484,-7.46484h-0.41016v81.375c0,4.3374 -3.5376,7.875 -7.875,7.875c-30.84375,0 -42.31787,6.8291 -44.29687,8.20313l-0.32812,0.32813c-1.82519,1.4458 -2.66602,3.77344 -5.16797,3.77344c-2.50195,0 -2.92236,-2.10205 -5.08594,-3.60937l-0.57422,-0.49219c-1.979,-1.37402 -13.43262,-8.20312 -44.29688,-8.20312c-4.3374,0 -7.875,-3.5376 -7.875,-7.875v-81.375z">
                                </path>
                            </g>
                        </g>
                    </g>
                </svg>
            </h2>
            <h2>
                <b>
                    CLASSICAL CURRICULUM
                </b>
            </h2>
            <p>
                We follow an academically rigorous methodology that is based on the Trivium.
                <br>
                    <a href="/why-a-classical-education-today" style="color:#EBB303">
                        Read More→
                    </a>
                </br>
            </p>
        </center>
    </div>
    <div class="column" >
        <center>
            <h2>
                <svg height="100" style="fill:#ffffff;" viewbox="0 0 252 252" width="200" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px">
                    <g fill="none" fill-rule="nonzero" font-family="none" font-size="none" font-weight="none" stroke="none" stroke-dasharray="" stroke-dashoffset="0" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-width="1" style="mix-blend-mode: normal" text-anchor="none">
                        <path d="M0,252v-252h252v252z" fill="none">
                        </path>
                        <path d="M126,252c-69.58788,0 -126,-56.41212 -126,-126v0c0,-69.58788 56.41212,-126 126,-126v0c69.58788,0 126,56.41212 126,126v0c0,69.58788 -56.41212,126 -126,126z" fill="#EBB303">
                        </path>
                        <g fill="#ffffff">
                            <g id="surface1">
                                <path d="M121.7475,70.7175v8.90367c-12.05982,2.02658 -21.2625,12.57477 -21.2625,25.11633c0,7.55816 3.53821,13.38873 8.23922,17.14289c4.70101,3.75416 10.36547,5.84719 15.68109,7.97344c5.31563,2.12625 10.28241,4.28572 13.55484,6.91031c3.27243,2.62459 5.04984,5.2824 5.04984,10.49836c0,9.16945 -7.6246,17.01 -17.01,17.01c-9.43523,0 -17.01,-7.57477 -17.01,-17.01v-4.2525h-8.505v4.2525c0,12.608 9.20268,23.08975 21.2625,25.11633v8.90367h8.505v-8.90367c12.09305,-2.04319 21.2625,-12.67444 21.2625,-25.11633c0,-7.57477 -3.53821,-13.37212 -8.23922,-17.14289c-4.70101,-3.77077 -10.36547,-5.98008 -15.68109,-8.10633c-5.31562,-2.12625 -10.28241,-4.16944 -13.55484,-6.77742c-3.27243,-2.60798 -5.04984,-5.31562 -5.04984,-10.49836c0,-9.31895 7.59138,-17.01 17.01,-17.01c9.43523,0 17.01,7.57477 17.01,17.01v4.2525h8.505v-4.2525c0,-12.608 -9.20267,-23.08974 -21.2625,-25.11633v-8.90367z">
                                </path>
                            </g>
                        </g>
                    </g>
                </svg>
            </h2>
            <h2>
                <b>
                    COST EFFECTIVE TUITION
                </b>
            </h2>
            <p>
                Tuition for the Classical Core courses is approximately 40% of traditional private school.
                <br>
                    <a href="/tuition-and-fees" style="color:#EBB303">
                        Read More→
                    </a>
            </p>
        </center>
    </div>
.column {
    float: left;
  width:23%;
  margin:1%;
}
/* Clear floats after the columns */

.row:after {
    content: "";
    display: table;
    clear: both;
}
/* Responsive layout - when the screen is less than 600px wide, make the three columns stack on top of each other instead of next to each other */

@media screen and (max-width: 600px) {
    .column {
        width: 100%;
    }
}

 

Template Features


Navigation Button

Want a strong call-to-action right in your header? Check the Enable Nav Button tweak option to turn the last link in your main navigation into a button.


Banner Area

There are several ways to use the Banner area at the top of the page.

 

Page Banner

In a Page, Blog List, Events List, Product List, or Album page, you can create a large banner in Settings (in Site Manager). Just upload a Thumbnail Image, and add your text to the Description field.

  • Bolded text will become a Headline
  • Links on the last line will become Buttons

 

Page Banner Slideshow

If you want a large banner slideshow on Page Collections, you can place a Gallery Block at the very top of the Page, before all other blocks.

  • Gallery Block must be set to slideshow mode
  • As with Page Banner, putting bolded text or links in the description for each gallery slide will create Headlines and Buttons

 

Blog Featured Slideshow

Created a slideshow of Featured Posts in Blog List view by featuring individual posts. Your five most recent Featured Posts will automatically be placed into a slideshow at the top of the Blog List.

 

Blog Item Banner

In a blog post’s Item View, the post’s thumbnail will automatically be placed into a banner at the top of the page, along with the post’s title and your chosen meta info.

 

Simple Image Banner

Don’t want a fancy header with words and buttons? Just upload a thumbnail in Page, Blog List, Events, Product List, or Album, and it will be displayed in a thin strip along the top of the page.

 

No Banner Area

If you don’t want to use the banner at all, simply don’t upload a thumbnail, and it will not display.

 


Sidebar

Bedford features sidebars that appears in several situations:

  • Folder Navigation, on the left of any Page inside a Folder
  • Category Navigation, on on the left any Product List with categories
  • Blog Sidebar, on the right side of Blog pages

You can choose to show the title of the Folder or Product collection. If you don’t want to show the sidebars, you can choose to hide them entirely with a Style Editor option.


Index

Bedford’s Index allows you to stack multiple Pages on top of each other. Each Index Page will feature all the banner options available to other Pages in the site, including the Page Banner, Page Banner Slideshow, and Simple Image Banner options.


The Index also features a Fixed Navigation, which will appear after you scroll past the first Page in the Index. This navigation is only available while browsing an Index in Bedford.

 

Style Editor Options


Site Header

Header Background Color – Change the background color of the header bar at the top of the page.

Site Title Font + Color – If no logo image is uploaded, set the typeface, font properties, and color of the Site Title.

Transparent Header – If a banner image of any sort is uploaded on a particular page, the header background will become transparent. Pages without banner images will keep the Header Background Color, as will folder dropdowns.

Logo Container Width – Set the width of the logo container, effectively changing the size of the logo. If the logo container is smaller than the size of the uploaded logo image, the logo image will shrink, but if the logo container is larger, the logo will not become larger than the uploaded image. The nav will take up the rest of the space to the right of the logo container.

Site Title Container Width – Set the width of the site title container. This effectively allows control over the wrapping of the site title.


Site Navigation

Nav Link Font + Color – Set the typeface, font properties, and color of the navigation links.

Nav Link (Active) – Set the color of the navigation links on hover.

Enable Nav Button – Turn the last link in the navigation into a button (does not apply to folders).

Nav Button Style – Select between solid, outline, and raised buttons.

Nav Button Corner Style – Select between squared corners, rounded corners, or a "pill" shaped button.

Nav Button Color – Set the background color of the button (outline and text color if "outline" button style is selected).

Nav Button Font + Text Color – Set the typeface, font properties, and color of the navigation button.


Banner Section

Banner Overlay Color – Set a color to be overlaid over images on banners.

Banner Heading Font + Color – Set the typeface, font properties, and color of the headings in banners.

Banner Text Font + Color – Set the typeface, font properties, and color of the body text in banners.

Banner Button Style – Select between solid, outline, and raised buttons.

Banner Button Corner Style – Select between squared corners, rounded corners, or a "pill" shaped button.

Banner Button Color – Set the background color of the button (outline and text color if "outline" button style is selected).

Banner Button Font + Color – Set the typeface, font properties, and colors of the banner button.


Main Content

Page Background – Set the background of the main content area.

Page Text Font + Color – Set the typeface, font properties, and color of body text.

Page Link Color – Set the color of body links.

Page Meta Color – Set the color of meta text (blog authors, post dates, etc.)

Control the typeface, font properties, and colors of the Heading 1, Heading 2, and Heading 3.

Quote Font + Color – Set the typeface, fonts properties, and color of Quote Blocks.


Sidebar

Hide Page Sidebar – Don't display the left-hand folder navigation on pages in a folder.

Hide Products Sidebar – Don't display the left-hand category navigation in product list view.

Hide Sidebar Title – Don't display title in the sidebar.

Sub Nav Title Font + Color – Set the typeface, font properties, and color of the titles in Page Folder Nav and Products Category Nav.

Sub Nav Link Font + Color – Set the typeface, font properties, and color of the links in subnavs.


Prefooter

Pre Footer Background – Set the background color of the pre-footer area directly above the footer.

Pre Footer Text Color – Set the color of the text in the Pre-Footer.


Footer

Footer Background – Set the background color of the footer area at the very bottom of the page.

Footer Text Color – Set the color of the text in the footer.

Footer Nav Font + Color – Set the typeface, font properties, and color of the footer navigation links.

Footer Nav Link (Active) – Set the color of the footer navigation links on hover.

Center Navigation / Info – Choose between left- and center-aligned footer navigation and site info.

Hide Site Info – Hide the site info in the footer.


Blog

Meta Priority – Select whether date or category of a post appear above its title in blog list view.

Hide Entry Author – Don't display the byline of a blog post. Useful for blogs with a single author.

Hide List Entry Footer – Don't display the footer (Comment + Like + Share) in blog list view.


Gallery Styles

Gallery Navigation – Determines the type of gallery image navigation is provided on the page.

Gallery Info Overlay – Select the type of display used for image title and caption.

Gallery Aspect Ratio – Controls the aspect ratio (width:height) for the gallery active slide.

Gallery Arrow Style – Determines the style of the arrows used to cycle through the slides.

Gallery Transitions – select the transition styles used to animate between slides being viewed.

Gallery Show Arrows – choose to use arrows for cycling through slides.

Gallery Auto Crop – choose to auto crop slide images to the selected ratio.

Gallery Autoplay – choose to cycle gallery images automatically without user interaction.

Gallery Loop – Enable a gallery to cycle through to the first slide after the last slide.

Gallery Autoplay Speed –Specify the speed at which the gallery pauses on the active slide.

Gallery Thumbnail Size – Control the height of thumbnail images when used for gallery navigation.

Gallery Arrow Background – Specify the color that is used for the shape of gallery arrows.

Gallery Arrow Color – Specify the color that is used for the arrow itself.

Gallery Circle Color – Specify the color that is used for the circle shape gallery arrows.

Gallery Info Background – Specify the color used in the background of the image title and caption. 


Event Styles

Event Time Format – Toggle between 24 hour or AM/PM for event times.

Event Icons – Enable icons on the address and event time display.

Event Thumbnails – Show an image thumbnail in list view.

Event Thumbnail Size – Control the size (ratio width:height) of the event thumbnail image.

Event Date Label – Enable date overlay on top of event thumbnail.

Event Date Label Time – Include the time of the event with the date overlay.

Event Excerpts – Show optional excerpt text of events on the list view when present.

Event List Date – Show the full event date (day, month, year) of the event on the list view.

Event List Time – Show the time range (start time-end time) of the event on the list view.

Event List Address – Show the event location address when present.

Event iCal/gCal Links – Show links to add events to Apple or Google calendars.

Event Like and Share Buttons – Show Squarespace simple like and share buttons on events.

Event List Compact View – Enable a simple stacked view of events in the list view.

Event Calendar Compact View – Enable a simpler calendar view optimized for smaller areas


Product Styles

Product Background Color – sets the color behind the product image.

Product Overlay Color – sets the color of the overlay when product list titles are set to 'overlay.'

Products Per Row – determines the number of products shown per line on the product list.

Product List Titles – controls the position of the product title on the product list.

Product List Alignment – sets the text alignment of the product title on the product list.

Product Item Size – select an image ratio for the product photo on the product list.

Product Image Auto Crop – determines whether product images fill the image area or fit within.

Product Gallery Size – select an image ratio for the product gallery on the product item page.

Product Gallery Auto Crop – determines whether product images fill the gallery area or fit within.

Show Product Price – shows the price on the product list page when enabled.

Show Product Item Nav – shows the 'back to shop' link on the product item page.