Editing marketing website widgets

Does your marketing website admin look different than the screenshots you see below?
You may not be on our latest platform.

widget, in the context of your marketing website, is a website component that serves a particular function. That function can be as simple as drawing attention to a particular feature you offer at your storage facility or providing visitors to your website with driving directions to your facility. Your marketing website admin provides you with a variety of customizable widgets, such as the hero section, map section, and call to action section of your website. Even the text and photo sections on your website are widgets!

This guide is intended to help you customize the non-text and photo oriented widgets on your website:

Editing the hero section

The hero section is the section of your homepage that your prospective customers see first. It generally consists of a large photo or slideshow with a heading, some text, and often a call to action button that links to your facility page.

Styling the hero section

You can edit the appearance of your hero section by clicking the top right corner and then selecting Edit.

edit_hero.png

The next window has two tabs. The Images tab allows you to add images to the hero slideshow. The Styling tab allows you to adjust the appearance of your hero. To style the hero section, click the Styling tab.

choose_overlay.png

There are three options to choose from:

  • Full Overlay: This adds an overlay with a slightly darker background over your entire hero image.
  • Overlay behind content area: This adds a smaller overlay that appears just behind the content area.
  • No Overlay: This makes no change to your hero image, and your text content will appear directly on top of your hero image.

Select the overlay option you'd like to use and click Save.

Editing the CTA button

You can customize the button within your hero section by clicking the button and then selecting Edit.

Edit_button.png

The Button Editor window will open. From here, you can customize what your button will say and where it will take a website visitor when they click it. If you'd like the button to link to an existing page on your website, you can enter the URL extension and select whether you'd like it to open in the same tab or a new tab. If you'd like to link to a separate website, enter the website's URL.

When you're finished, click Save.

hero_button_editor.png

Editing Call to Action Icons

Your website’s home page may feature Call to Actions (CTA) icons. These icons are used to call attention to attractive facility features. They also often link to other pages on your website. You can change which icons are used on your home page and add new links from your admin.

To change out a CTA icon, click the icon and select Edit.

edit_CTA.png

The next screen allows you to select the icon you’d like to use. You’ll notice that there are three categories of icons to choose from on the left of the window.

CTA_options.png

The Styling tab gives you ways to customize your icon. You can change the color, the alignment, or even add a link.

CTA_styling.png

Once you’ve selected and styled your icon, click Save.

Editing coupons

If you have a coupon on your website, editing and formatting it is simple. Just click the coupon and select Edit.

edit_coupon.png

Your coupon editor has two tabs. Each tab gives you different options for editing and formatting your coupon.

Text

The Text tab allows you to make changes to the text that appears on your coupon. You can type text right into the text field to change your coupon details. You can also use the dropdown menus to format the offer (the top box) and the details (the bottom box). Your formatting options include bold, italic, strikethrough, and underline.

edit_coupon_text.png

Coupon Style

The Coupon Style tab gives you options to change the appearance of your coupon. You can choose a different coupon shape from here or change the color of your coupon. Click the style of coupon you’d like to change the shape of the coupon. To change the color, select the dropdown under Coupon Color. You can select between your site’s primary or secondary color, or you can select Custom to enter the hex code of another color.

coupon_style.png

Once you’re done making edits to your coupon, click Save.

Editing maps

A map widget can be added for one facility or all of your facilities by dragging the Map:All Facilities or Map: One Facility widget from the widget menu to the place you want it to be on the page. map widgets.png
When visitors click on the map, they will see your facility details and lowest priced unit, including active promotions. Screenshot 2023-08-15 at 10.26.32 AM.png
To edit the map, click on the map and click Edit. edit map.png

Zoom and positioning

Adjust the map zoom level by clicking the Zoom in or Zoom out icons. You can also click the hand icon and drag the map to reposition it.

adjust map.png

Pin Clustering

If you enable pin clustering, when website visitors click on a cluster, the map will zoom-in and the cluster will separate into smaller clusters until the individual facility pins are visible.

To enable pin clustering, click the Enable Pin Clustering toggle button.

enable clustering.png

You can select a Map Pin Color and Cluster Color from your Primary, Secondary, and Tertiary website brand colors. 

Choose to show more detail on the map by selecting Streets or less detail by selecting Light Grey from the Map Style dropdown menu.

Once you’ve adjusted your map to the way you’d like it to display, click Save.

When you're finished making changes to your marketing website widgets, don't forget to publish your changes to ensure they show on your website.

Editing the video widget

You can embed videos hosted on YouTube or Vimeo on your website using the video widget.

To add the widget, drag and drop the YouTube/Vimeo from under the Video section of the Widget menu to the location you want it to be on the page. Screenshot 2024-01-02 at 9.52.50 AM.png
Click on the widget placeholder and click Edit. Screenshot 2024-01-02 at 9.50.09 AM.png

Paste embed code for a YouTube or Vimeo video in the Quick Start field or past a URL in Video URL field to configure settings manually.

If configuring manually, you can toggle options to Enable Autoplay, Mute Video, Loop Video, and Enable Video player controls.

Screenshot 2024-01-02 at 9.52.21 AM.png

 

Editing the Accordion widget

The accordion widget allows large sections of content to be organized in a condensed and more readable format.

To add the widget, drag and drop the Accordion widget from under the Text section of the Widget menu to where you want it to be on the page. accordion.png

Click anywhere on the widget and click Edit.

edit accordion.png

Click Add Accordion Item at the bottom of the accordion widget to add additional items.

 

 

Screenshot 2023-12-19 at 8.41.01 AM.png

You can drag and drop accordion items to reorder them.

You can also delete an accordion item by clicking the trashcan.

drag and drop.png
Check the Default Open box next to an item if you want the item’s content to be expanded by default. If this box is not checked, the item’s content will be collapsed within the accordion. default open.png
After you've entered your content and configured the widget, click Save.

 

Comments

Still have questions?
Don't be afraid to ask us. We're here to help you.
Powered by Zendesk