{"id":38805,"date":"2020-05-19T17:23:17","date_gmt":"2020-05-19T17:23:17","guid":{"rendered":"https:\/\/elementor.com\/blog\/?p=38805"},"modified":"2025-12-04T05:33:18","modified_gmt":"2025-12-04T03:33:18","slug":"barbershop-template-kit","status":"publish","type":"post","link":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/","title":{"rendered":"Monthly Template Kits #10: The Barbershop Website Template Kit"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"38805\" class=\"elementor elementor-38805\" data-elementor-post-type=\"post\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-25d340c elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"25d340c\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f514eb2\" data-id=\"f514eb2\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-cfd8503 elementor-widget elementor-widget-text-editor\" data-id=\"cfd8503\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Our barbershop website template is perfect for barber shops looking to build a modern, fashionable website to increase their online presence. The look and feel of the <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/library\/all-categories\/\"   title=\"Alle categorie\u00ebn\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25996\">template<\/a> is geared to modern, male-oriented traditional barbershops. At the same time, the kit is also super versatile, multi-purpose if you will, so that other small business-types can adapt it to their specific branding and marketing needs.<\/p>\n<p>Some examples of other businesses that can easily use the template and adapt it to their business personas are fitness gyms, hair salons, tattoo parlors, shops with simple services, and really anything that comes to mind &#8211; it&#8217;s not just <a href=\"https:\/\/elementor.com\/resources\/how-to\/create-barber-website\/\">to create a barber website<\/a>!<\/p>\n<p>Another key benefit of this Template Kit is that it utilizes advanced design features and makes them easily accessible for a simple design workflow.<\/p>\n<p>As web creators, we love the idea of Template Kits. There&#8217;s actually been a new development recently with the options and availability of Template Kits that you can use for Elementor, thanks to a <a href=\"https:\/\/elements.envato.com\/template-kits\/\" target=\"_blank\" rel=\"noopener\">new feature<\/a> offered by Envato.<\/p>\n<p>This month, Envato launched <a href=\"https:\/\/youtu.be\/lfDZJqSrIuk\" target=\"_blank\" rel=\"noopener\">200 template kits<\/a> that were built specifically to be used with Elementor. We highly recommend checking out their Template Kit marketplace so that you can find the best fit for any website you create, no matter the discipline and industry.<\/p>\n<p>To see how to download this Template Kit, <a href=\"#kit_gif\">see this video<\/a>.<\/p>\n<p>Now for the different elements in the Barbershop Template Kit and how you can start using it to build your actual site.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d07f97d elementor-widget elementor-widget-heading\" data-id=\"d07f97d\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Homepage: Getting the Barbershop Vibe\n<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5de4574 elementor-widget elementor-widget-image\" data-id=\"5de4574\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Home-1024x536.jpg\" class=\"attachment-large size-large wp-image-38858\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Home-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Home-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Home-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Home.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9c033c7 elementor-widget elementor-widget-text-editor\" data-id=\"9c033c7\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>The Template Kit\u2019s homepage uses a variety of design techniques to represent their brand messaging as well as the vibe of their brick and mortar business location.\u00a0<\/p><p>The use of visual contrast on this page is very prevalent throughout the design elements. The most dominant, as we see it, is the black and white photograph juxtaposed with the colored, zoomed-in photograph that details the client\u2019s facial expression and his hairstyling. This represents the combined vibe of an old-fashioned men\u2019s barbershop with the modern, fashionable hairstyling that they provide.\u00a0<\/p><p>To see how to replace the Template&#8217;s default image with your own image, watch this short gif:<\/p><p><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7f0e962 elementor-widget elementor-widget-video\" data-id=\"7f0e962\" data-element_type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;hosted&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"e-hosted-video elementor-wrapper elementor-open-inline\">\n\t\t\t\t\t<video class=\"elementor-video\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/sites\/9\/2020\/05\/how2replace-background-pic-silnet2-lr.mp4\" controls=\"\" preload=\"metadata\" controlsList=\"nodownload\"><\/video>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1df405b elementor-widget elementor-widget-text-editor\" data-id=\"1df405b\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>When we built this template with Elementor, we simply used\u00a0<a href=\"https:\/\/elementor.com\/help\/blend-mode-and-css-filters\/\" target=\"_blank\" rel=\"noopener\">Blend Mode and CSS Filters<\/a>\u00a0when modifying our image upload. No need for Photoshop or other image editing software.\u00a0<\/p><p>In addition, the color block style combination of royal blue (\u2018blue ribbon&#8217;\/#003AF1, to be exact) with \u2018dark gray\/#B0B6B6, as well as the broken-grid layout both illustrate the barbershop&#8217;s style of traditional in parallel to modernity.\u00a0<\/p><p>When you scroll down to the next section, you&#8217;ll see a row of flat icons with a color changing\u00a0<a href=\"https:\/\/elementor.com\/help\/hover-effects\/\" target=\"_blank\" rel=\"noopener\">hover effect<\/a>. This icon list is used as a visual representation of all the services offered by the salon.<\/p><p>If we had to guess, we&#8217;d assume that this information is one of the visitor&#8217;s key questions that he&#8217;s looking to have answered when browsing the site. He wants to know exactly what the business can provide him with and why he should choose them as a provider.\u00a0<\/p><p>Keep in mind that these icons can easily be interchanged with other icons if you use the template for a different business-type. You can refer to our\u00a0<a href=\"https:\/\/docs.elementor.com\/article\/50-icon-list\" target=\"_blank\" rel=\"noopener\">icon list widget<\/a>\u00a0to understand this technique in better detail. By the way, each icon file is in .SVG format. In practice, this means that the colors can be changed easily, which is especially helpful if you want to explore different color changing hover effects.\u00a0<\/p><p>When you choose to insert the homepage template into your website, take note that this template is a \u2018Page&#8217;, which you download from:\u00a0<\/p><p><span style=\"font-weight: bolder\">Editor &gt; Open Library popup &gt; Pages tab &gt; scroll the page and find it or search for \u201cBarbershop.\u201d<\/span><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-be4fa59 elementor-widget elementor-widget-heading\" data-id=\"be4fa59\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">About Page: Showing What You\u2019re All About\n<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b59abc9 elementor-widget elementor-widget-image\" data-id=\"b59abc9\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/About-1024x536.jpg\" class=\"attachment-large size-large wp-image-38859\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/About-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/About-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/About-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/About.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-19c1d96 elementor-widget elementor-widget-text-editor\" data-id=\"19c1d96\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>The About page sticks to the broken grid layout that was introduced to us on the Homepage. The broken grid layout is perfect for maintaining a uniform design scheme throughout the website while keeping a unique and interesting style.<\/p><p>On the About page, the choice of photograph is also very effective. The barber himself (in this case, the business owner) has a modern, fashionable haircut, a happy disposition, wearing an authentic-looking apron with tools in tow. The vibe of the salon is definitely present here, showing a glimpse of the salon\u2019s decor in the background.<\/p><p>When visualizing your service or product, you\u2019ll want to prove to your prospective clients that your team is passionate about what they\u2019re providing.<\/p><p>Another crucial element of the About page is the section that introduces the barbershop\u2019s barbers themselves.<\/p><p>Each photograph is detailed and professional, making sure each person\u2019s hairstyle is well-groomed, and that their demeanor conveys personality and spontaneity.<\/p><p>In terms of layout, the image grid of the photographs is polished and uniform, creating a pleasant, appealing visual experience when looking at the photos.<\/p><p>Like the Homepage, the About page is also a \u2018Page\u2019 template.<\/p><p><strong>You can insert it by going to Editor &gt; Open Library popup &gt; Pages tab &gt; scroll the page and find it or search for \u201cBarbershop.&#8221;<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0e8ed35 elementor-widget elementor-widget-heading\" data-id=\"0e8ed35\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Services Page: What You Offer Your Customers<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ae361f9 elementor-widget elementor-widget-image\" data-id=\"ae361f9\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Services-1024x536.jpg\" class=\"attachment-large size-large wp-image-38860\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Services-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Services-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Services-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Services.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-030e07c elementor-widget elementor-widget-text-editor\" data-id=\"030e07c\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Next comes the Services page. The most important section of this page is the services menu. Any visitor who is considering scheduling an appointment at your hair salon is almost definitely going to want to see this menu.<\/p><p>This is why readability, and essentially, <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/best-fonts-for-websites\/\"   title=\"26 Best Fonts For Websites &amp; Web Design (2025)\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25994\">typography<\/a>, is paramount when you\u2019re designing any menu or list of services. Throughout the entire Template Kit, you&#8217;ll notice that we chose a wide variety of typefaces and fonts.<\/p><p>First of all, we chose to use two typefaces: serif and sans-serif. This combination goes back to the phenomenon we were discussing earlier about combining the old-fashioned traditional (serif) with modern and sleek (sans serif).\u00a0<\/p><p>In terms of font families, we used Domine (serif) for the navbar list items and the menu category names (Haircuts, Beards &amp; Mustaches, etc.). We then chose Work Sans (sans serif) for the body texts, buttons texts and menu items, such as the type of treatment and their descriptions.\u00a0<\/p><p>On a user experience level, a sans serif typeface such as Work Sans is better for readability, which is important when there are full sentences or strings of many words.\u00a0<\/p><p>Choosing the typography was another opportunity to inject the brand&#8217;s messaging into the website design.<\/p><p>Like the Homepage and About page, the Services page is also a \u2018Page&#8217; template.<\/p><p><strong>You can insert it by going to Editor &gt; Open Library popup &gt; Pages tab &gt; scroll the page and find it or search for \u201cBarbershop.&#8221;<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c4bd2d1 elementor-widget elementor-widget-heading\" data-id=\"c4bd2d1\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Gallery Page: Seeing Is Believing<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8457acb elementor-widget elementor-widget-image\" data-id=\"8457acb\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Gallery-1024x536.jpg\" class=\"attachment-large size-large wp-image-38861\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Gallery-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Gallery-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Gallery-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Gallery.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f169315 elementor-widget elementor-widget-text-editor\" data-id=\"f169315\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>When designing the template for the Gallery page, we decided to give the website visitor an up-close and personal view of how talented the barbers at the salon are. We chose detailed, crisp photographs that reveal the exact details of each haircut we&#8217;re sharing with the visitors.\u00a0<\/p><p>This achieves two things: one, it represents the artistic prestige that each barber possesses. And as we discussed earlier, the imagery shows prospective customers how much each employee at the salon values and invests in their work.<\/p><p>We also distributed the images throughout the page in a way that gives full detail of each picture, yet the collection of images doesn&#8217;t look overbearing or messy.\u00a0<\/p><p>The fact that our color palette doesn&#8217;t use too many colors is also helpful in this regard. It\u2019s really all about the people and objects being photographed and not about bright, <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/text-bold\/\"   title=\"How to Make Text Bold in HTML &#038; CSS\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25995\">bold<\/a> colors that steal the spotlight of what we\u2019re trying to emphasize as designers.\u00a0<\/p><p><strong>Like the Homepage, About page and the Services page, the Gallery page is also a \u2018Page&#8217; template\u00a0<\/strong><\/p><p><strong>You can insert it by going to Editor &gt; Open Library popup &gt; Pages tab &gt; scroll the page and find it or search for \u201cBarbershop.\u201d<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-58e690d elementor-widget elementor-widget-heading\" data-id=\"58e690d\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Contact Page and Popup: Simple and Practical<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-81267ad elementor-widget elementor-widget-image\" data-id=\"81267ad\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Contact-page-popup_-1024x536.jpg\" class=\"attachment-large size-large wp-image-38862\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Contact-page-popup_-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Contact-page-popup_-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Contact-page-popup_-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Contact-page-popup_.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d7398f3 elementor-widget elementor-widget-text-editor\" data-id=\"d7398f3\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>The Contact page is all about the action item that we&#8217;re trying to make happen: the website visitor contacting the salon. Conveniently, the salon has a form that sends customer details to the company email once a website visitor fills out the form, which is a significant benefit for the user.\u00a0<\/p><p>We also made sure to use the <a href=\"https:\/\/elementor.com\/help\/google-maps-widget\/\" target=\"_blank\" rel=\"noopener\">Google Maps widget<\/a> so that website visitors have an easy time finding out where exactly the barbershop is located.\u00a0<\/p><p>We decided to use a <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/what-is-css\/\"   title=\"What Is CSS? How to Use it in Web Design (2025)\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25992\">CSS<\/a> filter for the map so that it shows up in black and white. This way,\u00a0it blends in perfectly to the Contact page&#8217;s gray background and doesn&#8217;t divert the visitor&#8217;s focus from either of the forms that we&#8217;d like him to fill out.<\/p><p>The \u2018stay in the loop&#8217; popup&#8217;s design is also centered around simplicity. The bold blue choice of color is dominant yet not overbearing. We do indeed want to catch the visitor&#8217;s attention so that he will take action, but we don&#8217;t want to overwhelm him while doing so.<\/p><p>Like the Homepage, About page, Services page and Gallery page, the Contact page is also a \u2018Page&#8217; template.<\/p><p><strong>You can insert it by going to Editor &gt; Open Library popup &gt; Pages tab &gt; scroll the page and find it or search for \u201cBarbershop.\u201d<\/strong><\/p><p><strong>To add the actual Popup, <\/strong><strong>go to WP left panel &gt; Templates &gt; Popups &gt; Add New &gt; Library popup &gt; scroll the page and find it or search for \u201cBarbershop.\u201d<\/strong><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c5d82b8 elementor-widget elementor-widget-heading\" data-id=\"c5d82b8\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Blog Archive Page: Elegant and Modern\n<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d45e224 elementor-widget elementor-widget-image\" data-id=\"d45e224\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Archive-Blog-post_-1024x536.jpg\" class=\"attachment-large size-large wp-image-38863\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Archive-Blog-post_-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Archive-Blog-post_-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Archive-Blog-post_-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Archive-Blog-post_.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b3595cf elementor-widget elementor-widget-text-editor\" data-id=\"b3595cf\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>The blog&#8217;s archive page is unique in that its hero content has the exact same layout as the other website pages (Services, Gallery, etc.), and then once you scroll down, it starts looking more like a traditional archive page.<\/p><p>The subtle change in layout (broken grid morphs into a standard grid) doesn&#8217;t pose any issue to the user experience or the user interface of the page. The combination of black and white images with color images stays the same, so scrolling down the page feels just as natural as any other page.<\/p><p>This template is also extremely versatile for any typography combination. The same is true for the images. Whatever the Template Kit user would choose to replace these photographs with would almost definitely look clean and pristine as they do now, since the sizing and spacing are uniform and completely symmetrical.\u00a0<\/p><p>Different from the pages we&#8217;ve discussed until now, the Blog page is an Archive page template, so the download process is slightly different. You\u2019ll need to access it through <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/features\/theme-builder\/\"   title=\"Theme Builder\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25997\">Theme Builder<\/a>.\u00a0<\/p><p><strong>To do this, go to the <\/strong><strong>WP left panel &gt; Templates &gt; Theme Builder &gt; Add New &gt; Choose \u201cArchive\u201d &gt; Library popup &gt; scroll the page and find it or search for \u201cBarbershop\u201d.<\/strong><\/p><p><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4e0d0d3 elementor-widget elementor-widget-heading\" data-id=\"4e0d0d3\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Article: Casual Content for Clients<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1e3e6dc elementor-widget elementor-widget-text-editor\" data-id=\"1e3e6dc\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>What\u2019s unusual about the Article template page is that the featured image and post title are not placed in the center of the page, rather it\u2019s aligned to the top right. This allows the page layout to stay consistent with the pages we\u2019ve discussed until now. The large white text background behind the title makes sure that the visitor isn\u2019t thrown off by the right-aligned title. The large font size also helps with that.\u00a0<\/p><p>Because the article text\u2019s font size is on the smaller side (16 px), this gives the article images even more room in the spotlight. This makes the article page even more unique, which is why we love it.\u00a0<\/p><p>The Article page template is built as a Single Post. To access it, you\u2019ll need to go to the \u201cTheme Builder\u201d section, and then Single Post.<\/p><p><strong>To do this, go to WP left panel &gt; Templates &gt; Theme Builder &gt; Add New &gt; Choose \u201cSingle Post\u201d &gt; Library popup &gt; scroll the page and find it or search for \u201cBarbershop\u201d.<\/strong><\/p><p><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e382b96 elementor-widget elementor-widget-heading\" data-id=\"e382b96\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Header &amp; Footer: Subtlety at Its Finest<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1d1297f elementor-widget elementor-widget-image\" data-id=\"1d1297f\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/Header-Footer-1024x536.jpg\" class=\"attachment-large size-large wp-image-38864\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/Header-Footer-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/Header-Footer-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/Header-Footer-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/Header-Footer.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-35759f9 elementor-widget elementor-widget-text-editor\" data-id=\"35759f9\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>The header in the Template Kit is unique in that the hero image overlaps with the top of the header. Using a unique design technique, The image separates the page navigation items from the social icons and the call to action button. Despite this alternative design, the header looks exactly like your standard, run-of-the-mill header with a neat, horizontal-aligned navbar with plenty of space in between each menu item for nice readability and navigation. The image placement poses no interference or confusion to the header\u2019s usability.<\/p><p>The footer maintains the page\u2019s gray background, and has the option to contact the salon and provide details about the service you\u2019re interested in. We created this by adding an <a href=\"https:\/\/elementor.com\/widgets\/form-widget\/\" target=\"_blank\" rel=\"noopener\">extended form<\/a> to the footer. The idea here is to encourage communication in a gentle, non-aggressive manner.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-41b0cb5 elementor-widget elementor-widget-heading\" data-id=\"41b0cb5\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">404: Combining Error and Humor<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a3ef5a4 elementor-widget elementor-widget-image\" data-id=\"a3ef5a4\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"419\" src=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=800,h=419\/blog\/wp-content\/uploads\/2020\/05\/404-1024x536.jpg\" class=\"attachment-large size-large wp-image-38865\" alt=\"\" srcset=\"https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1024\/blog\/wp-content\/uploads\/2020\/05\/404-1024x536.jpg 1024w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=300\/blog\/wp-content\/uploads\/2020\/05\/404-300x157.jpg 300w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=768\/blog\/wp-content\/uploads\/2020\/05\/404-768x402.jpg 768w, https:\/\/elementor.com\/cdn-cgi\/image\/f=auto,w=1200\/blog\/wp-content\/uploads\/2020\/05\/404.jpg 1200w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f4b0d7a elementor-widget elementor-widget-text-editor\" data-id=\"f4b0d7a\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>What we love most about the Template Kit\u2019s <a class=\"wpil_keyword_link\" href=\"https:\/\/elementor.com\/blog\/404-not-found\/\"   title=\"How To Fix \u201c404 Not Found On Your Site\u201d Error\" data-wpil-keyword-link=\"linked\"  data-wpil-monitor-id=\"25993\">404<\/a> page is the image we used to indicate an error. Because almost every page has a black and white photograph as the hero image in the exact same place, it makes perfect sense to use a large black and white image here, too.<\/p><p>It&#8217;s no surprise that not much text is needed on this page. The picture speaks for itself. If the guy&#8217;s hair isn&#8217;t well-groomed, the website visitor is clearly not on the page he wants to be on.\u00a0<\/p><p>We often see the 404 page as a good opportunity to maintain a good rapport with the website visitor, so that he shouldn&#8217;t lose interest in our website just because there was some sort of technical glitch.\u00a0<\/p><p>Keeping up with the versatility of the Template Kit, any image can replace this one of the man with messy hair. This achieves a contrast between functional vs. dysfunctional pages.<\/p><p>When it comes to visual aesthetics, the white page background and clean design makes this a safe bet for any image or illustration.<\/p><p>The 404 page can be downloaded from the \u201cTheme builder\u201d section.<strong><br \/><\/strong><\/p><p><strong>To access it, go to WP left panel &gt; Templates &gt; Theme Builder &gt; Add New &gt; Choose \u201cSingle &#8211; 404 Page\u201d &gt; Library popup &gt; scroll the page and find it or search for \u201cBarber shop.\u201d<\/strong><\/p><p><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2f5a064 elementor-widget elementor-widget-heading\" data-id=\"2f5a064\" data-element_type=\"widget\" id=\"kit_gif\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Get This Kit<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-211084a elementor-widget elementor-widget-video\" data-id=\"211084a\" data-element_type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;hosted&quot;,&quot;autoplay&quot;:&quot;yes&quot;,&quot;mute&quot;:&quot;yes&quot;,&quot;loop&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"e-hosted-video elementor-wrapper elementor-open-inline\">\n\t\t\t\t\t<video class=\"elementor-video\" src=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/sites\/9\/2020\/05\/end_download_barbershop_small.mp4\" autoplay=\"\" loop=\"\" muted=\"muted\" controlsList=\"nodownload\"><\/video>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ad3588b elementor-widget elementor-widget-text-editor\" data-id=\"ad3588b\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>This Template Kit can be yours in a matter of seconds. Whether you\u2019re creating a website for a barbershop or for any other small business, you\u2019ll find this kit especially easy to use and flexible for any style and branding.<\/p><p>Versatility is crucial to successful website design, as our content needs are constantly evolving and website content, both texts and visuals, need to be updated all the time. You\u2019ll want to make your website management as easy as pie, and the Template Kit will be a big help in doing just that.<\/p><p>To see the full Template Kit, check out <a href=\"https:\/\/library.elementor.com\/boutique-barbershop\/\" target=\"_blank\" rel=\"noopener\">this demo<\/a>.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>This month\u2019s Template Kit is an authentic and hip barbershop website template that makes it simple and easy for businesses to create their own website with Elementor. Adjust the template to your business needs and to set up your website in a quick and simple way.<\/p>\n","protected":false},"author":340600,"featured_media":38877,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[39,40,32],"tags":[79,176],"marketing_persona":[47],"marketing_intent":[49],"class_list":["post-38805","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-business","category-template-kit","category-design","tag-build","tag-local-video"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Barbershop Website Template Kit | Elementor<\/title>\n<meta name=\"description\" content=\"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Barbershop Website Template Kit | Elementor\" \/>\n<meta property=\"og:description\" content=\"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/elemntor\/\" \/>\n<meta property=\"article:published_time\" content=\"2020-05-19T17:23:17+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-12-04T03:33:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Orlee Gillis\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@elemntor\" \/>\n<meta name=\"twitter:site\" content=\"@elemntor\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Orlee Gillis\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\"},\"author\":{\"name\":\"Orlee Gillis\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/328053c188caa983135122eb1f4c62f6\"},\"headline\":\"Monthly Template Kits #10: The Barbershop Website Template Kit\",\"datePublished\":\"2020-05-19T17:23:17+00:00\",\"dateModified\":\"2025-12-04T03:33:18+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\"},\"wordCount\":2506,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg\",\"keywords\":[\"Build\",\"Local Video\"],\"articleSection\":[\"Business\",\"Template Kit\",\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\",\"url\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\",\"name\":\"Barbershop Website Template Kit | Elementor\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg\",\"datePublished\":\"2020-05-19T17:23:17+00:00\",\"dateModified\":\"2025-12-04T03:33:18+00:00\",\"description\":\"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.\",\"breadcrumb\":{\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg\",\"width\":1200,\"height\":628},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blog\",\"item\":\"https:\/\/elementor.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Template Kit\",\"item\":\"https:\/\/elementor.com\/blog\/category\/template-kit\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Monthly Template Kits #10: The Barbershop Website Template Kit\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/elementor.com\/blog\/#website\",\"url\":\"https:\/\/elementor.com\/blog\/\",\"name\":\"Elementor\",\"description\":\"Website Builder for WordPress\",\"publisher\":{\"@id\":\"https:\/\/elementor.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/elementor.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/elementor.com\/blog\/#organization\",\"name\":\"Elementor\",\"url\":\"https:\/\/elementor.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"contentUrl\":\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png\",\"width\":225,\"height\":225,\"caption\":\"Elementor\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/elemntor\/\",\"https:\/\/x.com\/elemntor\",\"https:\/\/www.instagram.com\/elementor\/\",\"https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1\",\"https:\/\/en.wikipedia.org\/wiki\/Elementor\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/328053c188caa983135122eb1f4c62f6\",\"name\":\"Orlee Gillis\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/42bbded5d63d5cb8af7896e256e70095f2254b7e6957471a74c9bf5cdf8cbd5d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/42bbded5d63d5cb8af7896e256e70095f2254b7e6957471a74c9bf5cdf8cbd5d?s=96&d=mm&r=g\",\"caption\":\"Orlee Gillis\"},\"description\":\"Orlee is a Content Creator at Elementor who's enamored by UX\/UI Design and UX Writing. She spends a lot of time practicing her design skills and steeping cold brew coffee.\",\"url\":\"https:\/\/elementor.com\/blog\/author\/orlee\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Barbershop Website Template Kit | Elementor","description":"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/","og_locale":"en_US","og_type":"article","og_title":"Barbershop Website Template Kit | Elementor","og_description":"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.","og_url":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/","og_site_name":"Blog","article_publisher":"https:\/\/www.facebook.com\/elemntor\/","article_published_time":"2020-05-19T17:23:17+00:00","article_modified_time":"2025-12-04T03:33:18+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg","type":"image\/jpeg"}],"author":"Orlee Gillis","twitter_card":"summary_large_image","twitter_creator":"@elemntor","twitter_site":"@elemntor","twitter_misc":{"Written by":"Orlee Gillis","Est. reading time":"12 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/"},"author":{"name":"Orlee Gillis","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/328053c188caa983135122eb1f4c62f6"},"headline":"Monthly Template Kits #10: The Barbershop Website Template Kit","datePublished":"2020-05-19T17:23:17+00:00","dateModified":"2025-12-04T03:33:18+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/"},"wordCount":2506,"commentCount":0,"publisher":{"@id":"https:\/\/elementor.com\/blog\/#organization"},"image":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg","keywords":["Build","Local Video"],"articleSection":["Business","Template Kit","Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/elementor.com\/blog\/barbershop-template-kit\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/","url":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/","name":"Barbershop Website Template Kit | Elementor","isPartOf":{"@id":"https:\/\/elementor.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg","datePublished":"2020-05-19T17:23:17+00:00","dateModified":"2025-12-04T03:33:18+00:00","description":"Meet our barbershop website template for simple website creation with Elementor. Adjust the template to your business needs and to set up your new website.","breadcrumb":{"@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/blog\/barbershop-template-kit\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#primaryimage","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2020\/05\/Barbershop-Post.jpg","width":1200,"height":628},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/blog\/barbershop-template-kit\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Blog","item":"https:\/\/elementor.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Template Kit","item":"https:\/\/elementor.com\/blog\/category\/template-kit\/"},{"@type":"ListItem","position":3,"name":"Monthly Template Kits #10: The Barbershop Website Template Kit"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/blog\/#website","url":"https:\/\/elementor.com\/blog\/","name":"Elementor","description":"Website Builder for WordPress","publisher":{"@id":"https:\/\/elementor.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/blog\/#organization","name":"Elementor","url":"https:\/\/elementor.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","contentUrl":"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2025\/06\/images.png","width":225,"height":225,"caption":"Elementor"},"image":{"@id":"https:\/\/elementor.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/elemntor\/","https:\/\/x.com\/elemntor","https:\/\/www.instagram.com\/elementor\/","https:\/\/www.youtube.com\/channel\/UCt9kG_EDX8zwGSC1-ycJJVA?sub_confirmation=1","https:\/\/en.wikipedia.org\/wiki\/Elementor"]},{"@type":"Person","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/328053c188caa983135122eb1f4c62f6","name":"Orlee Gillis","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/42bbded5d63d5cb8af7896e256e70095f2254b7e6957471a74c9bf5cdf8cbd5d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/42bbded5d63d5cb8af7896e256e70095f2254b7e6957471a74c9bf5cdf8cbd5d?s=96&d=mm&r=g","caption":"Orlee Gillis"},"description":"Orlee is a Content Creator at Elementor who's enamored by UX\/UI Design and UX Writing. She spends a lot of time practicing her design skills and steeping cold brew coffee.","url":"https:\/\/elementor.com\/blog\/author\/orlee\/"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/38805","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/users\/340600"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/comments?post=38805"}],"version-history":[{"count":9,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/38805\/revisions"}],"predecessor-version":[{"id":146529,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/posts\/38805\/revisions\/146529"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/media\/38877"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/media?parent=38805"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/categories?post=38805"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/tags?post=38805"},{"taxonomy":"marketing_persona","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/marketing_persona?post=38805"},{"taxonomy":"marketing_intent","embeddable":true,"href":"https:\/\/elementor.com\/blog\/wp-json\/wp\/v2\/marketing_intent?post=38805"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}