diff --git a/assets/css/v2/style.css b/assets/css/v2/style.css
index 3f61224b..c62e1d7d 100644
--- a/assets/css/v2/style.css
+++ b/assets/css/v2/style.css
@@ -60,6 +60,7 @@
--color-shadow: #d2d2d2;
--color-codeblock-border: #888;
--color-codeblock-shadow: #e5e5e5;
+ --color-codeblock-highlight: #fffed9;
--color-footer: #1d1d1d;
--color-footer-text: #e2e2e2;
--color-product-title: #8d8d8d;
@@ -1449,6 +1450,12 @@ ul .code-block {
padding: 0;
}
+.highlight code .hl {
+ width: fit-content;
+ min-width: 100%;
+ background-color: var(--color-codeblock-highlight);
+}
+
/* MARK: Images
*/
figure {
diff --git a/exampleSite/content/test-product/code-blocks/code-blocks-highlighting.md b/exampleSite/content/test-product/code-blocks/code-blocks-highlighting.md
new file mode 100644
index 00000000..31468117
--- /dev/null
+++ b/exampleSite/content/test-product/code-blocks/code-blocks-highlighting.md
@@ -0,0 +1,45 @@
+---
+description: Code Blocks - highlighting
+title: Highlighting
+weight: 200
+---
+
+{{}}
+There is an option to use the `highlight` shortcode from Hugo but we have disabled that feature as it is redundant to using ticks. All usage will throw an error in the Hugo build.
+{{}}
+
+## Example with highlighting one line
+```hcl {linenos=false,hl_lines=[16]}
+resource "azurerm_nginx_certificate" "cert1" {
+ name = "examplecert"
+ nginx_deployment_id = azurerm_nginx_deployment.test.id
+ key_virtual_path = "/src/cert/soservermekey.key"
+ certificate_virtual_path = "/src/cert/server.cert"
+ key_vault_secret_id = azurerm_key_vault_certificate.test.secret_id
+}
+```
+
+## Example with highlighting multiple consecutive lines (2-4)
+```hcl {linenos=true,hl_lines="2-4"}
+resource "azurerm_nginx_certificate" "cert1" {
+ name = "examplecert"
+ nginx_deployment_id = azurerm_nginx_deployment.test.id
+ key_virtual_path = "/src/cert/soservermekey.key"
+ certificate_virtual_path = "/src/cert/server.cert"
+ key_vault_secret_id = azurerm_key_vault_certificate.test.secret_id
+}
+```
+{{}}
+Values you can use for `hl_lines` are all non-zero positive integers. If you include a line number in `hl_lines` that does not exist (e.g. `16` in this example), it will highlight until the end.
+{{}}
+
+## Example with highlighting multiple non-consecutive lines
+```hcl {linenos=true,hl_lines=[2,4,6]}
+resource "azurerm_nginx_certificate" "cert1" {
+ name = "examplecert"
+ nginx_deployment_id = azurerm_nginx_deployment.test.id
+ key_virtual_path = "/src/cert/soservermekey.key"
+ certificate_virtual_path = "/src/cert/server.cert"
+ key_vault_secret_id = azurerm_key_vault_certificate.test.secret_id
+}
+```
\ No newline at end of file
diff --git a/layouts/shortcodes/highlight.html b/layouts/shortcodes/highlight.html
new file mode 100644
index 00000000..7e3c1094
--- /dev/null
+++ b/layouts/shortcodes/highlight.html
@@ -0,0 +1 @@
+{{ errorf "'' is deprecated. Use codeblock shortcode (via triple ticks and setting 'hl_lines') instead."}}
\ No newline at end of file