{"id":1949038,"date":"2021-01-29T13:01:12","date_gmt":"2021-01-29T18:01:12","guid":{"rendered":"https:\/\/theeventscalendar.com\/knowledgebase\/?post_type=tribe-knowledgebase&#038;p=1949038"},"modified":"2026-04-22T01:32:21","modified_gmt":"2026-04-22T05:32:21","slug":"calendar-template-settings","status":"publish","type":"post","link":"https:\/\/theeventscalendar.com\/knowledgebase\/calendar-template-settings\/","title":{"rendered":"The Events Calendar Template Settings"},"content":{"rendered":"\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Basic Template Settings\" width=\"720\" height=\"405\" src=\"https:\/\/www.youtube.com\/embed\/OzKDr1z1tR8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>This article covers all settings found under <strong>Events \u2192 Settings \u2192 Display<\/strong> that relate to how calendar pages are structured, styled, and what additional content appears around them. Navigate there to access the settings described below.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-default-stylesheet\">Default Stylesheet<\/h2>\n\n\n\n<p>Found at: <strong>Events \u2192 Settings \u2192 Display \u2192 Calendar \u2192 Calendar Template<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/01\/Calendar-Template.png\" alt=\"The Default Stylesheet setting in The Events Calendar Display settings, showing Skeleton Styles and Default Styles options\"\/><\/figure>\n\n\n\n<p>This setting determines which CSS stylesheet is used for calendar and event pages.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Default Styles<\/strong> \u2014 The default option. Enables the full CSS created for the plugin, including colors, sizes, spacing, and other styles.<\/li>\n\n\n\n<li><strong>Skeleton Styles<\/strong> \u2014 Removes most of the plugin&#8217;s styles, leaving only enough to preserve the general layout. Use this if you prefer to write your own styles without having to override the plugin&#8217;s.<\/li>\n<\/ul>\n\n\n\n<p>You can override the plugin&#8217;s CSS even with Default Styles enabled. See <a href=\"https:\/\/theeventscalendar.com\/knowledgebase\/adding-custom-css\/\">Adding Custom CSS to The Events Calendar<\/a> for a walkthrough.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-events-template\">Events Template<\/h2>\n\n\n\n<p>Found at: <strong>Events \u2192 Settings \u2192 Display \u2192 Calendar \u2192 Calendar Template \u2192 Events template<\/strong><\/p>\n\n\n\n<p>\ud83d\udca1 This option does not appear if you are using a Full Site Editor theme. See <a href=\"https:\/\/theeventscalendar.com\/knowledgebase\/k\/the-events-calendar--full-site-editor\/\">The Events Calendar and Full Site Editor<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/01\/default-events-template.png\" alt=\"The Events Template dropdown in The Events Calendar Display settings\"\/><\/figure>\n\n\n\n<p>The Events Calendar provides its own WordPress page template for event pages. This setting lets you switch to any other page template provided by your theme \u2014 for example, your theme&#8217;s default <code>page.php<\/code>. Using a theme template can help the calendar match the rest of your site&#8217;s layout. The default events template is optimized specifically for events, however, and may be the better choice if things don&#8217;t look quite right in your theme&#8217;s template.<\/p>\n\n\n\n<p>There are two options:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Default Events Template<\/strong> \u2014 Uses the template built into The Events Calendar. The theme&#8217;s header and footer are applied, but the content area is controlled by the plugin.<\/li>\n\n\n\n<li><strong>Default Page Template<\/strong> \u2014 Uses your theme&#8217;s standard page template. The header, footer, and content area are all controlled by the theme.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2019\/10\/Calendar-Display.png\" alt=\"Side-by-side comparison showing how the calendar appears differently depending on whether Default Page Template or Default Events Template is selected. Blue regions represent areas controlled by the theme.\"\/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-block-editor-colors-and-the-events-template\">Block Editor Colors and the Events Template<\/h3>\n\n\n\n<p>If you have activated the block editor for events (<strong>Events \u2192 Settings \u2192 General \u2192 Activate the block editor for events<\/strong>), certain blocks \u2014 such as the event description \u2014 will show color options in the editor.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2019\/10\/Block-Editor-Colors-updated-1024x471.png\" alt=\"The block editor showing color options on the event description block\"\/><\/figure>\n\n\n\n<p>Whether those block-level colors actually appear on the front end depends on which Events Template is selected.<\/p>\n\n\n\n<p>With the <strong>Default Page Template<\/strong>, colors set in the block editor work as expected for most themes, because the theme controls the full content area and applies its own CSS classes that carry the block&#8217;s color values.<\/p>\n\n\n\n<p>With the <strong>Default Events Template<\/strong>, the content area is rendered by the plugin rather than the theme. For some themes, the CSS that outputs block colors depends on classes the theme adds to its own content area \u2014 classes that aren&#8217;t present when the plugin is rendering the content. As a result, block-level color settings may have no visible effect on the front end.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/theeventscalendar.com\/knowledgebase\/wp-content\/uploads\/2019\/10\/theme-regions.png\" alt=\"Diagram illustrating how the same calendar can appear differently depending on whether Default Page Template (left) or Default Events Template (right) is selected. Blue represents regions controlled by the theme.\"\/><\/figure>\n\n\n\n<p>This behavior varies by theme: <a href=\"https:\/\/wordpress.org\/themes\/twentyseventeen\/\">Twenty Seventeen<\/a> displays block colors correctly with both templates, while <a href=\"https:\/\/wordpress.org\/themes\/twentynineteen\/\">Twenty Nineteen<\/a> does not display them with the Default Events Template.<\/p>\n\n\n\n<p><strong>If block-level color controls are important to your workflow, use the Default Page Template.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This article covers all settings found under Events \u2192 Settings \u2192 Display that relate to how calendar pages are structured, styled, and what additional content appears around them. Navigate there to access the settings described below. Default Stylesheet Found at: Events \u2192 Settings \u2192 Display \u2192 Calendar \u2192 Calendar Template This setting determines which CSS&#8230;<\/p>\n","protected":false},"author":3,"featured_media":1955565,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_swpsp_post_exclude":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"ep_exclude_from_search":false,"footnotes":""},"categories":[41],"tags":[],"stellar-product-taxonomy":[158,161],"class_list":["post-1949038","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-getting-started","stellar-product-taxonomy-events-calendar-pro","stellar-product-taxonomy-the-events-calendar"],"acf":[],"taxonomy_info":{"category":[{"value":41,"label":"Getting Started"}],"stellar-product-taxonomy":[{"value":158,"label":"Events Calendar Pro"},{"value":161,"label":"The Events Calendar"}]},"featured_image_src_large":["https:\/\/images.theeventscalendar.com\/kb\/uploads\/2023\/02\/social-share-1024x538.png",1024,538,true],"author_info":{"display_name":"Jaime Marchwinski","author_link":"https:\/\/theeventscalendar.com\/knowledgebase\/author\/jaimetri-be\/"},"comment_info":0,"category_info":[{"term_id":41,"name":"Getting Started","slug":"getting-started","term_group":0,"term_taxonomy_id":41,"taxonomy":"category","description":"","parent":0,"count":36,"filter":"raw","term_order":"0","cat_ID":41,"category_count":36,"category_description":"","cat_name":"Getting Started","category_nicename":"getting-started","category_parent":0}],"tag_info":false,"_links":{"self":[{"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1949038","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/comments?post=1949038"}],"version-history":[{"count":6,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1949038\/revisions"}],"predecessor-version":[{"id":1969309,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1949038\/revisions\/1969309"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/media\/1955565"}],"wp:attachment":[{"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/media?parent=1949038"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/categories?post=1949038"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/tags?post=1949038"},{"taxonomy":"stellar-product-taxonomy","embeddable":true,"href":"https:\/\/theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/stellar-product-taxonomy?post=1949038"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}