{"id":460,"date":"2020-05-26T17:17:48","date_gmt":"2020-05-26T17:17:48","guid":{"rendered":"https:\/\/university-communications.ncsu.edu\/documentation\/?page_id=460"},"modified":"2026-03-04T22:48:00","modified_gmt":"2026-03-05T03:48:00","slug":"events-block","status":"publish","type":"reference-article","link":"https:\/\/university-communications.ncsu.edu\/documentation\/reference-article\/events-block\/","title":{"rendered":"Events Block"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Overview<\/h2>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events.png\" data-fullsize=\"1452x294\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"207\" src=\"https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events-1024x207.png\" alt=\"Screenshot example of the Events block on a webpage\" class=\"wp-image-3917\" srcset=\"https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events-1024x207.png 1024w, https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events-300x61.png 300w, https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events-768x156.png 768w, https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2020\/05\/events.png 1452w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/a><figcaption class=\"wp-element-caption\">A standard Events block layout<\/figcaption><\/figure>\n\n\n\n<p>By default this block will display the next three events on your calendar, but can also support . It can pull data from Localist (the University Calendar) or The Events Calendar plugin. The Events Calendar plugin allows you to import events from Google Calendars and other calendaring platforms.<\/p>\n\n\n\n<p>With both Localist and The Events Calendar, you can filter what types of events to display. This will allow you to display events for a specific topic such as research seminars or outreach events on a relevant page of your site.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Additional Styling for the University Calendar<\/h2>\n\n\n\n<p>The Events block also offers additional functionality and styling with enhanced integration into the <a href=\"https:\/\/calendar.ncsu.edu\/\" data-type=\"link\" data-id=\"https:\/\/calendar.ncsu.edu\/\">University Calendar<\/a>. When using a Localist event source one can change the block styles, update the background color and feature a &#8220;Load More&#8221; stories button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1000\" height=\"690\" src=\"https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2026\/03\/new-events-block-layout.png\" alt=\"Events block laid out in a 9 block square grid\" class=\"wp-image-39440\" srcset=\"https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2026\/03\/new-events-block-layout.png 1000w, https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2026\/03\/new-events-block-layout-300x207.png 300w, https:\/\/university-communications.ncsu.edu\/documentation\/wp-content\/uploads\/sites\/21\/2026\/03\/new-events-block-layout-768x530.png 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><figcaption class=\"wp-element-caption\">The Events block allows you to display three, six or nine upcoming events from calendar.ncsu.edu. The Localist template also supports additional styling like alternative colors.<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Similar Blocks<\/h2>\n\n\n\n<p>Oftentimes it is necessary to display dates and deadlines on an academic website. The Events block is not well suited for this use case since there are often more than three deadlines that need to be listed.<\/p>\n\n\n\n<p>A table block can be a good alternative for dates and deadlines. It will allow you to display deadlines in a more compact manner. Just make sure to review your table on a mobile device to make sure it is legible for users who are accessing your site from a phone.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Need help?<\/h2>\n\n\n\n<p>Have questions? Feel free to reach out with any questions or concerns at\u00a0<a href=\"http:\/\/go.ncsu.edu\/ucomm-dev-request\">go.ncsu.edu\/ucomm-dev-request<\/a>.<\/p>\n","protected":false},"featured_media":0,"template":"","meta":{"_acf_changed":false,"ncst_custom_author":"","ncst_show_custom_author":false,"ncst_dynamicHeaderBlockName":"ncst\/default-header","ncst_dynamicHeaderData":"{\"pageIntro\":\"The Events block provides a way to showcase upcoming events and link out to your full calendar.\"}","ncst_content_audit_freq":"","ncst_content_audit_date":"","ncst_content_audit_display":false,"ncst_backToTopFlag":"","_links_to":"","_links_to_target":""},"availability":[49],"content-type":[51],"class_list":["post-460","reference-article","type-reference-article","status-publish","hentry","availability-nc-state-theme","content-type-block"],"acf":[],"_links":{"self":[{"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/reference-article\/460","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/reference-article"}],"about":[{"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/types\/reference-article"}],"version-history":[{"count":5,"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/reference-article\/460\/revisions"}],"predecessor-version":[{"id":39467,"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/reference-article\/460\/revisions\/39467"}],"wp:attachment":[{"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/media?parent=460"}],"wp:term":[{"taxonomy":"availability","embeddable":true,"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/availability?post=460"},{"taxonomy":"content-type","embeddable":true,"href":"https:\/\/university-communications.ncsu.edu\/documentation\/wp-json\/wp\/v2\/content-type?post=460"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}