{"id":1950372,"date":"2021-07-14T10:06:28","date_gmt":"2021-07-14T14:06:28","guid":{"rendered":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/?post_type=tribe-knowledgebase&#038;p=1950372"},"modified":"2024-05-03T23:43:33","modified_gmt":"2024-05-04T03:43:33","slug":"hello-elementor-theme","status":"publish","type":"post","link":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/hello-elementor-theme\/","title":{"rendered":"Hello Elementor Theme"},"content":{"rendered":"\n<p><a href=\"https:\/\/elementor.com\/hello-theme\/\" target=\"_blank\" rel=\"noreferrer noopener\">Hello Elementor<\/a> is a popular theme, designed to use with the <a href=\"https:\/\/elementor.com\" target=\"_blank\" rel=\"noreferrer noopener\">Elementor<\/a> page builder. This starter theme is lightweight with minimalist styling, to give users a blank canvas to create their website with a set of layout components.<\/p>\n\n\n\n<p>In this article, we&#8217;ll show you how this theme integrates with <a href=\"https:\/\/wordpress.org\/plugins\/the-events-calendar\/\" target=\"_blank\" rel=\"noreferrer noopener\">The Events Calendar<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-what-you-need\">What you need<\/h2>\n\n\n\n<ul class=\"wp-block-list\" id=\"block-30598cc7-f810-4ffe-af12-50e721f2b8ef\">\n<li><a href=\"https:\/\/wordpress.org\/plugins\/the-events-calendar\/\"><strong>The Events Calendar<\/strong><\/a>\u00a0(free): This is the base calendar plugin that allows you to publish event posts and display them in a calendar format.<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/theeventscalendar.com\/products\/wordpress-events-calendar\/\" target=\"_blank\" rel=\"noreferrer noopener\">Events Calendar Pro<\/a><\/strong> (optional): With The Events Calendar Pro, you gain access to four Elementor widgets for displaying on pages or posts.<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/plugins\/event-tickets\/\"><strong>Event Tickets<\/strong><\/a>\u00a0(free, optional): This is the base ticketing plugin for The Events Calendar that adds ticket and RSVP functionality to events, pages, and posts.<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/theeventscalendar.com\/extensions\/hello-elementor-integration\/\" target=\"_blank\" rel=\"noreferrer noopener\">Hello Elementor Integration Extension<\/a><\/strong> (free, optional): If you&#8217;d like to add tickets to your site with Event Tickets and <a href=\"https:\/\/theeventscalendar.com\/products\/wordpress-event-tickets\/\" target=\"_blank\" rel=\"noreferrer noopener\">Event Tickets Plus<\/a>, you&#8217;ll need this handy extension to make the Attendee Registration form display properly.<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/wordpress.org\/themes\/hello-elementor\/\" target=\"_blank\" rel=\"noreferrer noopener\">Hello Elementor theme<\/a><\/strong> (free): This is the main theme.<\/li>\n\n\n\n<li><strong><a href=\"https:\/\/elementor.com\" target=\"_blank\" rel=\"noreferrer noopener\">Elementor<\/a><\/strong> (free): This is the page builder that you&#8217;ll want to use with the theme. There is also a <a href=\"https:\/\/elementor.com\/pro\/\" target=\"_blank\" rel=\"noreferrer noopener\">Pro option<\/a> with additional features.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-installation\">Installation<\/h2>\n\n\n\n<p>You can search for Hello Elementor under&nbsp;<strong>Appearance \u2192 Themes&nbsp;<strong>\u2192<\/strong>&nbsp;Add New<\/strong>. Once you install the theme, you can click the button to install the Elementor page builder.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/07\/Screen-Shot-2021-07-14-at-9.38.59-AM.png\" alt=\"Hello Elementor Theme in the Add Theme screen of the WordPress admin. It shows a thumbnail of the theme which has a large bold heading that says Hello.\" class=\"wp-image-1950373\"\/><\/figure>\n\n\n\n<p>Using Hello Elementor with The Events Calendar is practically the same as integrating The Events Calendar with any other WordPress theme.&nbsp;<a href=\"https:\/\/staging.theeventscalendar.com\/knowledgebase\/k\/downloading-and-installing-the-plugin\/\" target=\"_blank\" rel=\"noreferrer noopener\">Install the theme and plugins<\/a>&nbsp;and you get a nice-looking calendar right out of the box.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/07\/Screen-Shot-2021-07-14-at-9.44.19-AM.png\" alt=\"The Events Calendar in Month view for July 2021 showing five upcoming events.\" class=\"wp-image-1950374\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-customizing-calendar-pages\">Customizing calendar pages<\/h2>\n\n\n\n<p>You can customize the styling of the calendar pages as you would with any other theme. Head over to the&nbsp;<a href=\"https:\/\/staging.theeventscalendar.com\/knowledgebase\/k\/wordpress-customizer-2\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress Customizer<\/a>&nbsp;in your admin toolbar at the top of the page (labeled \u201cCustomize\u201d) to see all of your options. Preview those changes in real time and hit <strong>Publish<\/strong> when you&#8217;re done.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/07\/Screen-Shot-2021-07-14-at-9.52.58-AM.png\" alt=\"WordPress Customizer\" class=\"wp-image-1950375\"\/><\/figure>\n\n\n\n<p class=\"has-text-color has-background\" style=\"color:#141827;background-color:var(--global-palette8)\">\ud83d\udc4b As of version 6.4.0, The Events Calendar now offers<a href=\"https:\/\/staging.theeventscalendar.com\/knowledgebase\/elementor-single-event-template\/\"> support for Elementor single event template<\/a>!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-using-elementor-calendar-widgets\">Using Elementor calendar widgets<\/h2>\n\n\n\n<p>You can add your events to any WordPress page or post with the Elementor page builder. On a new WordPress page, you&#8217;ll see the option to <strong>Edit with Elementor<\/strong>.<\/p>\n\n\n\n<p>Scroll down on the left sidebar until you see the options for <strong>The Events Calendar<\/strong>. Drag your widget of choice directly to the page.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/images.theeventscalendar.com\/kb\/uploads\/2021\/03\/Screen-Shot-2021-03-01-at-10.22.34-AM.png\" alt=\"Calendar widgets in the Elementor page builder interface for an event countdown, an event list, an event, and an events view.\" class=\"wp-image-1949313\"\/><\/figure>\n\n\n\n<p>For more details on using Elementor native widgets, check out this <a href=\"https:\/\/staging.theeventscalendar.com\/knowledgebase\/k\/native-elementor-widgets-for-events-calendar-pro\/\" target=\"_blank\" rel=\"noreferrer noopener\">Knowledgebase article<\/a>. You&#8217;ll learn about each of the calendar widgets that are available to use with Elementor&#8217;s page builder, and the various ways to configure them.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hello Elementor is a popular theme, designed to use with the Elementor page builder. This starter theme is lightweight with minimalist styling, to give users a blank canvas to create their website with a set of layout components. In this article, we&#8217;ll show you how this theme integrates with The Events Calendar. What you need&#8230;<\/p>\n","protected":false},"author":17,"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":[46],"tags":[238,239],"stellar-product-taxonomy":[158,161],"class_list":["post-1950372","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-integrations","tag-elementor","tag-theme","stellar-product-taxonomy-events-calendar-pro","stellar-product-taxonomy-the-events-calendar"],"acf":[],"taxonomy_info":{"category":[{"value":46,"label":"Integrations"}],"post_tag":[{"value":238,"label":"Elementor"},{"value":239,"label":"Theme"}],"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":"Andras Guseo","author_link":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/author\/andras\/"},"comment_info":0,"category_info":[{"term_id":46,"name":"Integrations","slug":"integrations","term_group":0,"term_taxonomy_id":46,"taxonomy":"category","description":"","parent":0,"count":115,"filter":"raw","term_order":"0","cat_ID":46,"category_count":115,"category_description":"","cat_name":"Integrations","category_nicename":"integrations","category_parent":0}],"tag_info":[{"term_id":238,"name":"Elementor","slug":"elementor","term_group":0,"term_taxonomy_id":238,"taxonomy":"post_tag","description":"Helpful Links related to Elementor:\r\n<ul>\r\n \t<li><a href=\"https:\/\/elementor.com\/help\/\" target=\"_blank\" rel=\"noopener\"><strong>Help Center<\/strong><\/a><\/li>\r\n \t<li><a href=\"https:\/\/elementor.com\/academy\/\" target=\"_blank\" rel=\"noopener\"><strong>Tutorials &amp; Courses<\/strong><\/a><\/li>\r\n \t<li><strong><a href=\"https:\/\/developers.elementor.com\/\" target=\"_blank\" rel=\"noopener\">Developer Hub<\/a><\/strong><\/li>\r\n<\/ul>","parent":0,"count":12,"filter":"raw","term_order":"0"},{"term_id":239,"name":"Theme","slug":"theme","term_group":0,"term_taxonomy_id":239,"taxonomy":"post_tag","description":"","parent":0,"count":11,"filter":"raw","term_order":"0"}],"_links":{"self":[{"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1950372","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/comments?post=1950372"}],"version-history":[{"count":4,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1950372\/revisions"}],"predecessor-version":[{"id":1959978,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/posts\/1950372\/revisions\/1959978"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/media\/1955565"}],"wp:attachment":[{"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/media?parent=1950372"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/categories?post=1950372"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/tags?post=1950372"},{"taxonomy":"stellar-product-taxonomy","embeddable":true,"href":"https:\/\/staging.theeventscalendar.com\/knowledgebase\/wp-json\/wp\/v2\/stellar-product-taxonomy?post=1950372"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}