All Collections
Gecko widget
Gecko engagement widget
Gecko engagement widget

Read time: 5 minutes | Engage students better. For free!

Jonny Richardson avatar
Written by Jonny Richardson
Updated over a week ago
The Gecko logo.

The Gecko engagement widget puts power and flexibility back into the hands of you and your team. Curate and control the content most important to your students on the web pages that matter most.

The Gecko engagement widget is easy to use and completely free. Start building today!


Getting started

Your Gecko widget journey begins here. Enter your work email address, read and accept the terms and conditions and click Sign Up.

You'll be emailed with the subject line "Your Magic Link". Open this email and click the Open Widget Builder button. This email sign-in method will be valid for 24 hours. After that, you can log in using the returning user link:

A screenshot showing the Returning User link on the sign-up page.

Once you've signed in, click + Create Your First Widget to get building.

The widget builder comprises three easy-to-understand sections: Build your Widget, Widget Details, and Review. Let's discuss each of these in turn:

  • 1. Build your widget: In this area, you'll pick which type of component you'd like to add and how you'd like it to appear. For example, suppose I wanted my widget to display a video of a virtual tour of the lush Gecko University campus. In that case, I'd select the video component, label my component as "Virtual Tour" and add the embed code from wherever my video was hosted:

    A screenshot showing the video component build process.

  • 2. Widget Details: When you've finished adding your components, this section allows you to fine-tune your widget. Provide an internal Widget Name, Colour, and Icon. You can also provide an optional Open Message, which, when embedded on your website, will pop up after a 3-second delay to help draw attention to your widget.

  • 3. Review: This final section will allow you to review any mistakes before generating your embed code. Here's an example code:

        <script>
    window.GeckoEngagementWidget = {
    widgetId: "59374883-bd08-4ab2-8cca-661eeb4608ec",
    };
    </script>
    <script src="https://widget.geckoengage.com/embed"></script>

Once created, widgets can be edited, disabled or deleted anytime. As a bonus, the Widget homepage will give you a 7-day analytical overview of your widgets - showing you total views, engagement, and which components are most clicked!
​


Components

Components are the building blocks of your widget. Each widget can support up to 11 components in whatever configuration you'd like. There is no limit to the number of widgets your account can support.

Gecko Form

πŸ’‘ Note: this component is designed to showcase your Gecko Forms. Interested in learning more? Contact your Sales or Account Manager here.

The Gecko Form component allows you to plug your most essential forms directly into your widget, effortlessly placing your most valuable data capture assets right before your audience.

To embed a form into your widget, log into Gecko and copy your form's Webform link (head to Forms > {Your Form} > Share) before pasting it into the widget Enter your Webform Link field.

Remember, you can test your component once it is added to your widget! Click the real-time practice widget in the bottom right-hand corner of the page to see your form in action.

Gecko Event

πŸ’‘ Note: this component is designed to showcase your Gecko Events. Interested in learning more? Contact your Sales or Account Manager here.

Invite students and visitors to sign-up for important upcoming on-campus, virtual, or hybrid events directly from your widget.

To embed your event(s) into your widget, log into Gecko and head to Events > Share. Pick a booking form (any form that has an event field) and pick which events you'd like to share:

  • All Events - pulls in all current and future events into your widget.

  • By Category - pulls in all events belonging to your specified category.

  • Single Event - pulls in one single event only.

Finally, copy the Webform Link and paste it into your widget Enter your Webform Link field.

Remember, you can test your component once it is added to your widget! Click the real-time practice widget in the bottom right-hand corner of the page to see your event(s) in action.

Gecko Chat

πŸ’‘ Note: this component is designed to host your Live-chat channels. Interested in learning more? Contact your Sales or Account Manager here.

Gecko Chat is your one-stop-inbox to answer questions from multiple channels (Live-Chat, Email, Facebook, Instagram, SMS, etc.). You'll never miss an opportunity to engage with students while demonstrating your school's intelligent, modern, innovative technological approach.

To embed a live-chat channel into your widget, log into Gecko and head to Settings > Channels > {Your Live-Chat Channel}. Copy the account_id value to your clipboard and paste it into your widget Gecko Chat Widget ID field:

A screenshot showing a Live-Chat widget account_id.

Remember, you can test your component once you've added it to your widget! Click the real-time practice widget in the bottom right-hand corner of the page to start a new conversation right away.

Web Link

Open any other webpage page as a new tab or pop-up (modal).

Feed Gecko your URL, give your component a name, and tell your widget whether you'd like your page opened as a new tab or pop-up.

Remember that you can test your component once you've added it to your widget! Click the real-time practice widget in the bottom-right corner of the page to instantly see your webpage in all its glory.

WhatsApp

πŸ’‘ You'll need a WhatsApp business account to use the WhatsApp component. If you've not already got one, learn how this can be set up.

Allow students to start a conversation with you via WhatsApp.

Give your component a name and then update the code below, replacing {your-phone-number} with your WhatsApp channel number and substituting {your-message-goes-here} for the message you'd like students to send when they first initiate the conversation, where any white/blank spaces in the message are encoded using the characters %20.

https://api.whatsapp.com/send?phone={your-phone-number}&text={your-message-goes-here}

For example, if my WhatsApp channel number was +4412345678910 and the message I wanted the student to send was "I need help applying" then my code would look like this:

https://api.whatsapp.com/send?phone=+4412345678910&text=I%20need%20help%20applying

3rd Party Widget

Integrate any 3rd party communication tools your team uses directly into your widget. Currently supports Ambassador Platform, Intercom, Ocelot, Salesforce Einstein, and Unibuddy.

Pick which tools you'd like to incorporate into your widget and enter the ID/source code into the relevant field.

Remember that you can test your component once you've added it to your widget! Click the real-time practice widget in the bottom-right corner of the page to instantly test your 3rd party widget immediately.

Video

The Video component will allow you to embed any hosted video with students. Compatible with YouTube, Vimeo, Wistia, and all other major video hosting sites that let you share embedded videos.

Find the video you want to share and copy its Embed/Share Code. This will typically be an iframe. Paste this into your widget Video Embed Code field, and you're ready!

Remember, you can test your component once it is added to your widget! Click the real-time practice widget in the bottom right-hand corner of the page to view your video immediately.


Any questions? Start a live chat with a support team member, or feel free to explore the rest of our academy. Spotted an error or want to suggest a future article for the academy? Let us know here.

Did this answer your question?