diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
index 287962b6d3..7cd84224f4 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js
@@ -5,14 +5,14 @@
 @scope
 
 @description
-<b>Added in Umbraco 7.8</b>. The tour component is a global component and is already added to the umbraco markup. 
-In the Umbraco UI the tours live in the "Help drawer" which opens when you click the Help-icon in the bottom left corner of Umbraco. 
-You can easily add you own tours to the Help-drawer or show and start tours from 
+<b>Added in Umbraco 7.8</b>. The tour component is a global component and is already added to the umbraco markup.
+In the Umbraco UI the tours live in the "Help drawer" which opens when you click the Help-icon in the bottom left corner of Umbraco.
+You can easily add you own tours to the Help-drawer or show and start tours from
 anywhere in the Umbraco backoffice. To see a real world example of a custom tour implementation, install <a href="https://our.umbraco.com/projects/starter-kits/the-starter-kit/">The Starter Kit</a> in Umbraco 7.8
 
 <h1><b>Extending the help drawer with custom tours</b></h1>
-The easiet way to add new tours to Umbraco is through the Help-drawer. All it requires is a my-tour.json file. 
-Place the file in <i>App_Plugins/{MyPackage}/backoffice/tours/{my-tour}.json</i> and it will automatically be 
+The easiet way to add new tours to Umbraco is through the Help-drawer. All it requires is a my-tour.json file.
+Place the file in <i>App_Plugins/{MyPackage}/backoffice/tours/{my-tour}.json</i> and it will automatically be
 picked up by Umbraco and shown in the Help-drawer.
 
 <h3><b>The tour object</b></h3>
@@ -26,7 +26,7 @@ The tour object consist of two parts - The overall tour configuration and a list
     "groupOrder": 200 // Control the order of tour groups
     "allowDisable": // Adds a "Don't" show this tour again"-button to the intro step
     "culture" : // From v7.11+. Specifies the culture of the tour (eg. en-US), if set the tour will only be shown to users with this culture set on their profile. If omitted or left empty the tour will be visible to all users
-    "requiredSections":["content", "media", "mySection"] // Sections that the tour will access while running, if the user does not have access to the required tour sections, the tour will not load.   
+    "requiredSections":["content", "media", "mySection"] // Sections that the tour will access while running, if the user does not have access to the required tour sections, the tour will not load.
     "steps": [] // tour steps - see next example
 }
 </pre>
@@ -43,11 +43,12 @@ The tour object consist of two parts - The overall tour configuration and a list
     "backdropOpacity": 0.4 // the backdrop opacity
     "view": "" // add a custom view
     "customProperties" : {} // add any custom properties needed for the custom view
+    "skipStepIfVisible": ".dashboard div [data-element='my-tour-button']" // if we can find this DOM element on the page then we will skip this step
 }
 </pre>
 
 <h1><b>Adding tours to other parts of the Umbraco backoffice</b></h1>
-It is also possible to add a list of custom tours to other parts of the Umbraco backoffice, 
+It is also possible to add a list of custom tours to other parts of the Umbraco backoffice,
 as an example on a Dashboard in a Custom section. You can then use the {@link umbraco.services.tourService tourService} to start and stop tours but you don't have to register them as part of the tour service.
 
 <h1><b>Using the tour service</b></h1>
@@ -86,7 +87,8 @@ as an example on a Dashboard in a Custom section. You can then use the {@link um
                         "element": "[data-element='my-tour-button']",
                         "title": "Click the button",
                         "content": "Click the button",
-                        "event": "click"
+                        "event": "click",
+                        "skipStepIfVisible": "[data-element='my-other-tour-button']"
                     }
                 ]
             };
@@ -257,9 +259,26 @@ In the following example you see how to run some custom logic before a step goes
 
                 // make sure we don't go too far
                 if(scope.model.currentStepIndex !== scope.model.steps.length) {
+
+                    var upcomingStep = scope.model.steps[scope.model.currentStepIndex];
+
+                    // If the currentStep JSON object has 'skipStepIfVisible'
+                    // It's a DOM selector - if we find it then we ship over this step
+                    if(upcomingStep.skipStepIfVisible) {
+                        let tryFindDomEl = document.querySelector(upcomingStep.element);
+                        if(tryFindDomEl) {
+                            // check if element is visible:
+                            if( tryFindDomEl.offsetWidth || tryFindDomEl.offsetHeight || tryFindDomEl.getClientRects().length ) {
+                                // if it was visible then we skip the step.
+                                nextStep();
+                            }
+                        }
+                    }
+
                     startStep();
-                // tour completed - final step
+                    // tour completed - final step
                 } else {
+                    // tour completed - final step
                     scope.loadingStep = true;
 
                     waitForPendingRerequests().then(function(){
diff --git a/src/Umbraco.Web.UI/config/BackOfficeTours/getting-started.json b/src/Umbraco.Web.UI/config/BackOfficeTours/getting-started.json
index 7b3f2a2184..bba88b1b08 100644
--- a/src/Umbraco.Web.UI/config/BackOfficeTours/getting-started.json
+++ b/src/Umbraco.Web.UI/config/BackOfficeTours/getting-started.json
@@ -184,27 +184,21 @@
                 "event": "click"
             },
             {
-                "element": "[data-element~='editor-data-type-picker']",
+                "element": "[ng-controller*='Umbraco.Editors.DataTypePickerController'] [data-element='editor-data-type-picker']",
                 "elementPreventClick": true,
                 "title": "Editor picker",
-                "content": "<p>In the editor picker dialog we can pick one of the many built-in editors.</p><p><em>You can choose from preconfigured data types (Reuse) or create a new configuration (Available editors)</em>.</p>"
+                "content": "<p>In the editor picker dialog we can pick one of the many built-in editors.</p>"
             },
             {
-                "element": "[data-element~='editor-data-type-picker'] [data-element='editor-Textarea']",
+                "element": "[data-element~='editor-data-type-picker'] [data-element='datatype-Textarea']",
                 "title": "Select editor",
                 "content": "Select the <b>Textarea</b> editor. This will add a textarea to the Welcome Text property.",
                 "event": "click"
             },
             {
-                "element": "[data-element~='editor-data-type-settings']",
-                "elementPreventClick": true,
+                "element": "[data-element='editor-data-type-picker'] [data-element='datatypeconfig-Textarea'] > a",
                 "title": "Editor settings",
-                "content": "Each property editor can have individual settings. For the textarea editor you can set a character limit but in this case it is not needed."
-            },
-            {
-                "element": "[data-element~='editor-data-type-settings'] [data-element='button-submit']",
-                "title": "Save editor",
-                "content": "Click <b>Submit</b> to save the changes.",
+                "content": "Each property editor can have individual settings. For the textarea editor you can set a character limit but in this case it is not needed.",
                 "event": "click"
             },
             {
@@ -313,7 +307,8 @@
                 "content": "<p>To see all our templates click the <b>small triangle</b> to the left of the templates node.</p>",
                 "event": "click",
                 "eventElement": "#tree [data-element='tree-item-templates'] [data-element='tree-item-expand']",
-                "view": "templatetree"
+                "view": "templatetree",
+                "skipStepIfVisible": "#tree [data-element='tree-item-templates'] > div > button[data-element=tree-item-expand].icon-navigation-down"
             },
             {
                 "element": "#tree [data-element='tree-item-templates'] [data-element='tree-item-Home Page']",
diff --git a/src/Umbraco.Web/Models/BackOfficeTourStep.cs b/src/Umbraco.Web/Models/BackOfficeTourStep.cs
index a64bf15b7f..c21b09523d 100644
--- a/src/Umbraco.Web/Models/BackOfficeTourStep.cs
+++ b/src/Umbraco.Web/Models/BackOfficeTourStep.cs
@@ -29,5 +29,7 @@ namespace Umbraco.Web.Models
         public string EventElement { get; set; }
         [DataMember(Name = "customProperties")]
         public JObject CustomProperties { get; set; }
+        [DataMember(Name = "skipStepIfVisible")]
+        public string SkipStepIfVisible { get; set; }
     }
-}
\ No newline at end of file
+}