How do I create a widget in Localist for my Georgia State website?
Go to the very bottom of calendar.gsu.edu and look for the block labeled "Share Events." You will find a link labeled "Embed events anywhere on the web with our Widget builder." Click on this.
On the WIDGET BUILDER page, you will first want to decide how you want your widget to appear on your Georgia State webpage. For example, do you want your widget to be horizontal or vertical? Do you want it to be plain text or have an image appear in the events listed? We recommend that you create a widget with images due to the user-interest that images create. Users are more than likely to click on your event if it has a unique and interesting image associated with it.
You have many Template options available to you. We recommend that you test them out to see which template works best with whichever page you intend to use it on. For example, if you're adding a calendar to your homepage, "Core/Dept Theme Horizontal Cards" is a nice, big and bold template with 5 events per row, background images displayed for each event, and a mouse-over with more detailed information. And if you're adding a calendar into a narrow column on the side of your page, "News Calendar" is an all-text template with a large date and only one event per row.
Play around with the templates in order to find the one that suits your page best. You can PREVIEW each template by selecting a template and then clicking on PREVIEW WIDGET at the bottom of the Widget Builder page.
After you select your template, you will then have to populate it with your specific events. The NUMBER OF RESULTS option will depend upon which template you have chosen (if you pick any kind of horizontally-themed template). For example, "Core/Dept Theme Horizontal Cards" is meant to display 5 results, but "Core/Dept Theme Horiz. Cards Narrow" is meant for narrower columns and is only meant to display 3 events. Test your choice out by using the PREVIEW button at the bottom. The best rule of thumb is that if you're testing on a full-screen browser window, and you have events spilling onto two or more lines, count the number of events on the first line. That is the NUMBER OF RESULTS that you want for your TEMPLATE choice.
We also recommend that DAYS AHEAD be set to 365 so that you have the maximum number of events available to display on your widget.
Then look through the dropdown menus for your DEPARTMENT, OFFICES AND RESOURCES, or COLLEGES AND SCHOOL and select it. You can also only fill in keywords or tags to make a more specified calendar widget, if any keywords or tags have been added to individual events as you created them. You also have options for PLACES, GROUPS, EVENT TYPE, CAMPUS, AUDIENCE, etc, to choose from.
You can also choose to EXCLUDE CONTENT from appearing on your widget by selecting certain EVENT TYPES, OFFICES AND RESOURCES, CAMPUSES, etc.
Once you have your options picked, and you've previewed your widget using the button at the bottom of the page, click on GENERATE EMBED CODE. the WIDGET EMBED CODE will then appear just above the buttons.
You will want to copy everything from the beginning of the code to the </script> in the first three to four lines. Then you want to go to your GSU site's dashboard and find the CSS & JAVASCRIPT TOOLBOX PLUS plugin. If this plugin is not activated for you yet, please contact DIGITAL STRATEGY via ticket@gsu.uservoice.com and we'll get it activated for you.
In CSS & JAVASCRIPT TOOLBOX PLUS, Create and Name a new CODE BLOCK. Name it for as specific a calendar as you can. For example, you can name it "Front Page Calendar" or "Alpharetta Campus Student Activities Calendar" in order to keep multiple calendars straight. Then paste in the code that you copied from the Localist site. Finally, save the code block.
Now all you have to do is go to the page(s) that you want your new Localist Calendar to appear on, find the exact spot on the page that you want the calendar displayed, and simply paste in the shortcode. Save the page and the calendar will now appear on your live page.
The shortcode should read: [cjtoolbox name='Name of Shortcode'] with everything between the single quotes being the exact name that you called the code block.
Other articles about working in Localist:
- How do I add an event to the Localist Calendar as an administrator?
- What size image should I upload in the Localist calendar?
- Can a PDF be attached to an event?
- Why doesn’t the Localist calendar have a 30-day grid-view?
- What is the approval process for getting events on the Localist calendar?
- How do I gain Administrator rights to the Localist Calendar?
- What if I need an approved event modified or deleted from the Localist calendar?
- I’m an administrator for the Localist calendar. How do I create featured events for my college or school?
- How do I create a past events disclaimer in the Localist calendar?
- Should I include social interactions such as an "I’m Going" + Ticketing/Registering button on my Localist calendar event?
- Why are past events still appearing in the Localist calendar?
- Can I add a Localist Calendar event to my personal calendar?
- How do I create a widget in Localist for my Georgia State website?
- How do I turn off social interactions (e.g. "User comments," "I'm interested," and "Invite friends")?