{"id":15523,"date":"2022-01-25T08:37:21","date_gmt":"2022-01-25T08:37:21","guid":{"rendered":"https:\/\/www.names.co.uk\/blog\/?p=15523"},"modified":"2022-02-08T11:55:37","modified_gmt":"2022-02-08T11:55:37","slug":"website-builder-widget-of-the-week-before-after-widget","status":"publish","type":"post","link":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/","title":{"rendered":"Website Builder Widget of the Week: Before & After Widget"},"content":{"rendered":"\n

Introduction<\/h2>\n\n\n\n

Welcome to the first entry in our new \u201cWebsite Builder Widget of the Week\u201d series. Over the course of five posts, we\u2019ll introduce our pick of the five most useful widgets for Website Builder<\/a>. These will be not just the essential \u201cmust have\u201d widgets for any website, but also those that are the most creative and eye-catching, perfect for attracting the interest of all who see them.<\/p>\n\n\n\n

For your website to truly succeed it needs to stand out from the crowd and wow your visitors, which is where Website Builder\u2019s impressive collection of widgets and features comes in super-handy!<\/p>\n\n\n\n

We\u2019ll start off with a widget that we feel is often overlooked but, if used properly, can really showcase your services in an incredibly attractive way: the Before & After<\/strong> widget.<\/p>\n\n\n\n

What is the Before & After widget?<\/h2>\n\n\n\n

Maybe you\u2019re a dentist or a hairdresser? Perhaps a gardener or a builder? Imagine being able to demonstrate on your website exactly what amazing results your work can achieve; an eye-catching and engaging visual comparison that will grab people\u2019s attention.<\/p>\n\n\n\n

\"The<\/figure>\n\n\n\n

A slider bar going down the middle allows your customers to switch between the \u201cbefore\u201d and \u201cafter\u201d results, and see for themselves exactly what the differences are. It\u2019s a fantastic way of showing just what you can do \u2013 a unique and appealing feature that will get people interested and excited about your services.<\/p>\n\n\n\n

How does it work?<\/h2>\n\n\n\n

Using the widget really couldn\u2019t be easier. You simply just upload your \u201cbefore\u201d and \u201cafter\u201d pictures and everything else is taken care of for you.<\/p>\n\n\n\n

Here\u2019s a quick walkthrough:<\/p>\n\n\n\n

Open the Widgets<\/em> section of your Website Builder editor and look for the Before & After<\/em> widget. It\u2019s usually located around halfway down the list, in the Media<\/em> section. Drag and drop it to wherever on your website you would like it to appear.<\/p>\n\n\n\n

\"The<\/figure>\n\n\n\n

In the pop-up window that appears you can click on the + icon in the Before image<\/em> and After image <\/em>sections to upload your two pictures.<\/p>\n\n\n\n

Which images work best?<\/h2>\n\n\n\n

For this widget to be at its best and amaze your customers, you\u2019ll need to ensure that both pictures are taken from the same angle and at the same viewing distance. It\u2019s no good if one is zoomed in and the other isn\u2019t, as the effect will be lost. When taking the \u201cafter\u201d picture you need to ensure you\u2019re standing in the same place as you were for the \u201cbefore\u201d picture, and that the background objects are all identical. Avoid any jarring discrepancies that will distract the viewer\u2019s attention away from the central subject of the two pictures.<\/p>\n\n\n\n

How is it best used?<\/h2>\n\n\n\n

The Before & After widget can be widely used to promote a vast array of services.<\/p>\n\n\n\n

Here are some common examples:<\/p>\n\n\n\n

Hairdressers: <\/em>Take before and after pictures of your clients\u2019 hair to show just what magic you can work.<\/p>\n\n\n\n

Cleaners: <\/em>Imagine a picture of a dirty floor sliding across into a picture of the same floor, but completely spotless. A great way of attracting new custom.<\/p>\n\n\n\n

Gardeners: <\/em>An unruly garden turned into a landscaped work of art with just the swipe of a finger! A fantastic feature that will show just how effective your skills are.<\/p>\n\n\n\n

Painters & Decorators: <\/em>No need for prospective customers to imagine how good your work is, when they can see the transformation right there on the website.<\/p>\n\n\n\n

Builders: <\/em>Take before and after pictures of gutters you\u2019ve repaired, roofs you\u2019ve replaced, houses you\u2019ve renovated. The possibilities are endless!<\/p>\n\n\n\n

And many more\u2026.<\/em><\/p>\n\n\n\n

Attract new visitors, show off your skills and make your website stand out from the competition with the simple yet effective Before & After widget, included in every Website Builder<\/a> plan.<\/p>\n\n\n\n

Coming Soon…<\/h2>\n\n\n\n

In the second part of this five part guide we\u2019ll explore a widget that has become increasingly popular over the last 18 months \u2013 the Zoom Meeting<\/strong> widget. You\u2019ll discover how easy it can be to meet and chat with your customers, even if you can\u2019t see them in person.<\/p>\n","protected":false},"excerpt":{"rendered":"

Introduction Welcome to the first entry in our new \u201cWebsite Builder Widget of the Week\u201d series. Over the course of five posts, we\u2019ll introduce our pick of the five most… Read more →<\/a><\/p>\n","protected":false},"author":17,"featured_media":15532,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1709,1596,1705,1655],"tags":[],"class_list":["post-15523","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ecommerce-website-builder","category-tips-and-tricks","category-web-design","category-website-builder"],"yoast_head":"\nNames.co.uk Website Builder | Widget of the Week | Before & After Widget<\/title>\n<meta name=\"description\" content=\"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Names.co.uk Website Builder | Widget of the Week | Before & After Widget\" \/>\n<meta property=\"og:description\" content=\"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\" \/>\n<meta property=\"og:site_name\" content=\"names.co.uk blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/namesco\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-01-25T08:37:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-02-08T11:55:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png\" \/>\n\t<meta property=\"og:image:width\" content=\"945\" \/>\n\t<meta property=\"og:image:height\" content=\"425\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Nathan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Namesco\" \/>\n<meta name=\"twitter:site\" content=\"@Namesco\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nathan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\"},\"author\":{\"name\":\"Nathan\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471\"},\"headline\":\"Website Builder Widget of the Week: Before & After Widget\",\"datePublished\":\"2022-01-25T08:37:21+00:00\",\"dateModified\":\"2022-02-08T11:55:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\"},\"wordCount\":695,\"image\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png\",\"articleSection\":[\"Ecommerce Website Builder\",\"Tips & Tricks\",\"Web Design\",\"Website Builder\"],\"inLanguage\":\"en-GB\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\",\"url\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\",\"name\":\"Names.co.uk Website Builder | Widget of the Week | Before & After Widget\",\"isPartOf\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png\",\"datePublished\":\"2022-01-25T08:37:21+00:00\",\"dateModified\":\"2022-02-08T11:55:37+00:00\",\"author\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471\"},\"description\":\"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage\",\"url\":\"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png\",\"contentUrl\":\"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png\",\"width\":945,\"height\":425,\"caption\":\"Website Builder Widget of the Week\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"names.co.uk\",\"item\":\"\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Blog\",\"item\":\"https:\/\/www.names.co.uk\/blog\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Website Builder\",\"item\":\"https:\/\/www.names.co.uk\/blog\/category\/website-builder\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Website Builder Widget of the Week: Before & After Widget\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/#website\",\"url\":\"https:\/\/www.names.co.uk\/blog\/\",\"name\":\"names.co.uk blog\",\"description\":\"Welcome to the names.co.uk blog where we talk about domain names, web hosting, online shops, website builders and lots of other cool web related stuff. Stick around for offers and competition news too!\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.names.co.uk\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-GB\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471\",\"name\":\"Nathan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b849f2ae94026a2583ec808f66065701dbebe5ca9a87e51fab1269f2853c4a71?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b849f2ae94026a2583ec808f66065701dbebe5ca9a87e51fab1269f2853c4a71?s=96&d=mm&r=g\",\"caption\":\"Nathan\"},\"description\":\"Nathan has been with team.blue since 2005. Now working as a Marketing Executive, he spent many years in the UK contact centre, interacting directly with customers and working through any problems they may have. He is passionate about helping small businesses find the best product to help them succeed online. In his free time, he can often be found on a train travelling around the beautiful British countryside, or curled up on the sofa reading a science fiction novel.\",\"url\":\"https:\/\/www.names.co.uk\/blog\/author\/nathan\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Names.co.uk Website Builder | Widget of the Week | Before & After Widget","description":"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.","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:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/","og_locale":"en_GB","og_type":"article","og_title":"Names.co.uk Website Builder | Widget of the Week | Before & After Widget","og_description":"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.","og_url":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/","og_site_name":"names.co.uk blog","article_publisher":"https:\/\/www.facebook.com\/namesco\/","article_published_time":"2022-01-25T08:37:21+00:00","article_modified_time":"2022-02-08T11:55:37+00:00","og_image":[{"width":945,"height":425,"url":"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png","type":"image\/png"}],"author":"Nathan","twitter_card":"summary_large_image","twitter_creator":"@Namesco","twitter_site":"@Namesco","twitter_misc":{"Written by":"Nathan","Estimated reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#article","isPartOf":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/"},"author":{"name":"Nathan","@id":"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471"},"headline":"Website Builder Widget of the Week: Before & After Widget","datePublished":"2022-01-25T08:37:21+00:00","dateModified":"2022-02-08T11:55:37+00:00","mainEntityOfPage":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/"},"wordCount":695,"image":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage"},"thumbnailUrl":"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png","articleSection":["Ecommerce Website Builder","Tips & Tricks","Web Design","Website Builder"],"inLanguage":"en-GB"},{"@type":"WebPage","@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/","url":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/","name":"Names.co.uk Website Builder | Widget of the Week | Before & After Widget","isPartOf":{"@id":"https:\/\/www.names.co.uk\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage"},"image":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage"},"thumbnailUrl":"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png","datePublished":"2022-01-25T08:37:21+00:00","dateModified":"2022-02-08T11:55:37+00:00","author":{"@id":"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471"},"description":"Discover how to use the Before & After widget in Website Builder to provide a stunning visual showcase of your work. Part 1 of our 5 part series.","breadcrumb":{"@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/"]}]},{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#primaryimage","url":"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png","contentUrl":"https:\/\/www.names.co.uk\/blog\/wp-content\/uploads\/2022\/01\/NCO-blog-widget-of-the-week.png","width":945,"height":425,"caption":"Website Builder Widget of the Week"},{"@type":"BreadcrumbList","@id":"https:\/\/www.names.co.uk\/blog\/website-builder-widget-of-the-week-before-after-widget\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"names.co.uk","item":"\/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https:\/\/www.names.co.uk\/blog\/"},{"@type":"ListItem","position":3,"name":"Website Builder","item":"https:\/\/www.names.co.uk\/blog\/category\/website-builder\/"},{"@type":"ListItem","position":4,"name":"Website Builder Widget of the Week: Before & After Widget"}]},{"@type":"WebSite","@id":"https:\/\/www.names.co.uk\/blog\/#website","url":"https:\/\/www.names.co.uk\/blog\/","name":"names.co.uk blog","description":"Welcome to the names.co.uk blog where we talk about domain names, web hosting, online shops, website builders and lots of other cool web related stuff. Stick around for offers and competition news too!","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.names.co.uk\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-GB"},{"@type":"Person","@id":"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/c4a24823b87b0d365a83bb36d095d471","name":"Nathan","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/www.names.co.uk\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b849f2ae94026a2583ec808f66065701dbebe5ca9a87e51fab1269f2853c4a71?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b849f2ae94026a2583ec808f66065701dbebe5ca9a87e51fab1269f2853c4a71?s=96&d=mm&r=g","caption":"Nathan"},"description":"Nathan has been with team.blue since 2005. Now working as a Marketing Executive, he spent many years in the UK contact centre, interacting directly with customers and working through any problems they may have. He is passionate about helping small businesses find the best product to help them succeed online. In his free time, he can often be found on a train travelling around the beautiful British countryside, or curled up on the sofa reading a science fiction novel.","url":"https:\/\/www.names.co.uk\/blog\/author\/nathan\/"}]}},"_links":{"self":[{"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/posts\/15523","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/comments?post=15523"}],"version-history":[{"count":7,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/posts\/15523\/revisions"}],"predecessor-version":[{"id":15550,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/posts\/15523\/revisions\/15550"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/media\/15532"}],"wp:attachment":[{"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/media?parent=15523"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/categories?post=15523"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.names.co.uk\/blog\/wp-json\/wp\/v2\/tags?post=15523"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}