Your meeting content, which includes agendas, packets, minutes, and media, can be posted to your Public Portal for easy access by your online visitors. There are several methods available to guide your online visitors to your Public Portal.
Important Notes
- Before embedding or linking to your public portal, ensure that you Manage the Public Portal Customizations.
- If you are currently using an inline frame (iframe) to embed your public portal into your website, please note that we are transitioning to a JavaScript embed.
Article Navigation
- Your Site ID
- Link to the Public Portal
- Embed the Public Portal with a Simple Embed
- Embed the Public Portal with a Custom Embed
- Embed the Public Portal with a Preset Category Filter
Not finding what you are looking for? View additional resources
Your Site ID
Your Site ID is a unique value that is used in URLs to reference your organization’s specific agenda and meeting management application. If your organization’s website will include links or embeds for the Public Portal, you will need to ensure your Site ID is appropriately replaced in the examples provided below.
To confirm your Site ID, locate the URL to your agenda and meeting management application, as provided by the Implementation or Support teams. The URL of the webpage will be in the following format, https://SITEID.v8.civicclerk.com, where ‘SITEID’ is replaced with your organization’s unique ID. Typically this is in CityState abbreviated format, but it may vary depending on your organization’s full name.
Link to the Public Portal
Your organization’s website may contain links (in the form of text links, an option from a dropdown menu, or a button) that point directly to your Public Portal. To ensure that online visitors are being directed to the correct site, ensure that your links are pointing to https://SITEID.portal.civicclerk.com with the ‘SITEID’ replaced appropriately.
You can also link to the Public Portal with a Preset Category Filter. To get the URL to use for your links, navigate to your organization’s main Public Portal page (as described in the paragraph above), then select the desired category from the Event Categories dropdown. You can select a single category or multiple categories, depending on your needs. The page URL will update with a Category ID parameter in the https://SITEID.portal.civicclerk.com/?category_id=# format. Once the desired categories have been selected, copy this URL to be used in your organization’s website links.
Embed the Public Portal with a Simple Embed
Your organization’s website may have a dedicated page that displays your site’s content along with your Public Portal. Previously, this was accomplished by the use of an iframe. However, the new Public Portal experience now utilizes a more modern JavaScript embed.
The Simple Embed allows you to place all of the Public Portal content into one location on your organization’s webpage by inserting this HTML into the desired location with the ‘SITEID’ replaced appropriately.
<div id="clerk-embed-simple"></div>
<script>window.clerkEmbedProps = {"tenant": "SITEID"};</script>
<script src="https://civicclerkcdn.azureedge.net/publicportal-live/embed.js"></script>
Embed the Public Portal with a Custom Embed
Your organization’s website may have a dedicated page that displays your site’s content along with your Public Portal. Previously, this was accomplished by the use of an iframe. However, the new Public Portal experience now utilizes a more modern JavaScript embed.
The Custom Embed allows you to break the Public Portal into four segments that can be placed in separate locations on your organization’s webpage. Depending on the design of your website, this may be a more appropriate option for you, as compared to the Simple Embed, to effectively use available space on your webpage.
To utilize the Custom Embed, place each of the four <div> sections below into the desired locations on your webpage. The script tags only need to be included one time on the page.
<div id="clerk-embed-listing"></div>
<div id="clerk-embed-sidebar"></div>
<div id="clerk-embed-filter"></div>
<div id="clerk-embed-subscription"></div>
<script>window.clerkEmbedProps = {"tenant": "SITEID"};</script>
<script src="https://civicclerkcdn.azureedge.net/publicportal-live/embed.js"></script>
- clerk-embed-listing: This is the past and upcoming Events section
- clerk-embed-sidebar: This is the Calendar and Date Range sidebar
- clerk-embed-filter: This is the Custom Text, Event Categories, Search, and View Today section
- clerk-embed-subscription: This is the Sign In button
Embed the Public Portal with a Preset Category Filter
Both the Simple Embed and Custom Embed can be configured to optionally preset a category filter for your events. This is useful for embedding the Public Portal onto a page designed for a specific meeting body.
To utilize the Preset Category Filter, you will include an additional property in the window.ClerkEmbedProps code snippet and you will enter the corresponding category ID(s) in the property. You can filter to a single category or string multiple categories together, as desired.
<script>window.clerkEmbedProps = {"tenant": "SITEID", "categoryIds": "24"};</script>
<script>window.clerkEmbedProps = {"tenant": "SITEID", "categoryIds": "24,26"};</script>
Resources
Comments
Let us know what was helpful or not helpful about the article.2 comments
I have used these embed codes to display the calendar on our Homepage (using CivicEngage). The one problem I have seems to be a coding error. When I first load our homepage, the calendar shows the current month (August 2023 as I'm writing this). I can then start to scroll down through the "Listings" to see upcoming events. Then, when I click on the "View Today" button in the "Filter", it jumps right back to the current month. However, if I start to scroll upwards through the "Listings" and go back a few months (I went back to May 2023) to see previous events, and then I click on the "View Today" button, it jumps back to May 2023 instead of August 2023. No matter how far into the future I now scroll, clicking the "View Today" button will bring me back to May 2023. Refreshing the entire page resets it back to the current month, but if I scroll backwards at all, it resets the "View Today" button to point to the furthest month I've scrolled into the past (second time I tried it I went back to December 2022 and the "View Today" button would then send me back to December 2022 every time I clicked it).
Hi Jason Espersen, thank you for sharing this feedback. I recommend contacting our Support team so they can look into this issue further.
Please sign in to leave a comment.