diff --git a/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html b/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html
deleted file mode 100644
index 8abadb1242e..00000000000
--- a/adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html
+++ /dev/null
@@ -1,3 +0,0 @@
-<!-- #docregion unsupported -->
-<p app:Highlight>This is invalid</p>
-<!-- #enddocregion unsupported  -->
diff --git a/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts b/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts
deleted file mode 100644
index e87c77b34e5..00000000000
--- a/adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-// #docregion
-import {Directive} from '@angular/core';
-
-@Directive({
-  selector: '[appHighlight]',
-})
-export class HighlightDirective {}
diff --git a/adev/src/content/guide/directives/attribute-directives.md b/adev/src/content/guide/directives/attribute-directives.md
index f5af756de71..0edbeb78b40 100644
--- a/adev/src/content/guide/directives/attribute-directives.md
+++ b/adev/src/content/guide/directives/attribute-directives.md
@@ -14,7 +14,14 @@ This section walks you through creating a highlight directive that sets the back
 
    The CLI creates `src/app/highlight.directive.ts`, a corresponding test file `src/app/highlight.directive.spec.ts`.
 
-   <docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.0.ts"/>
+   ```angular-ts
+   import {Directive} from '@angular/core';
+
+   @Directive({
+     selector: '[appHighlight]',
+   })
+   export class HighlightDirective {}
+   ```
 
    The `@Directive()` decorator's configuration property specifies the directive's CSS attribute selector, `[appHighlight]`.
 
@@ -25,11 +32,13 @@ This section walks you through creating a highlight directive that sets the back
 
 1. Add logic to the `HighlightDirective` class that sets the background to yellow.
 
-<docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.1.ts"/>
+   <docs-code header="highlight.directive.ts" path="adev/src/content/examples/attribute-directives/src/app/highlight.directive.1.ts"/>
 
-HELPFUL: Directives _do not_ support namespaces.
+IMPORTANT: Directives _do not_ support namespaces.
 
-<docs-code header="app.component.avoid.html (unsupported)" path="adev/src/content/examples/attribute-directives/src/app/app.component.avoid.html" region="unsupported"/>
+```angular-html {avoid}
+<p app:Highlight>This is invalid</p>
+```
 
 ## Applying an attribute directive