Reference, Shortcodes

Since the Tanzu Dev Center is built with Hugo, all standard Markdown is supported. There’s some additional shortcodes to leverage, as well.

Images

NOTE: This section was recently changed on 9/20/2021 to reflect changes to how images are stored. Images are now stored alongside your post as opposed to in the /static/images directory.

If your post includes images, your post will need to be submitted as a directory. For example, for a post called my-post.md, if you are including images, your content will need to be in the structure content/guides/spring/my-post/index.md.

Within this directory, create another directory called images. This is where you will add your images.

You can also add a white border around your image by adding them to a diagrams subdirectory in that same location. Using the above example, any image added to images/diagrams/ will receive a border.

The same goes for screenshots. To add a screenshot to your content, using the above example again, you would place the images in images/screenshots/

To add these images to your blog or guide, use the following shortcode example in your markdown file:

![Alt Text](images/image-1.png)

YouTube Videos

To add an embedded YouTube video to your content, use the following shortcode:

{{< youtube id="YOUR_VIDEO_ID" class="youtube-video-shortcode" >}}

Twitter

To add an embedded tweet to your content, use the following shortcode:

{{< tweet YOUR_TWEET_ID >}}

Callout

To add a callout to your content, sue the following shortcode:

{{% callout %}} CALLOUT TEXT HERE {{% /callout %}}

Tabs

Add tabs to your blog or guide. Good for when you are writing a guide and including commands for multiple operating systems.

{{< tabpane >}}
{{< tab header="MacOS" >}}

MacOS specific commands here.

{{< /tab >}}
{{< tab header="Linux" >}}

Linux specific commands here.

{{< /tab >}}
{{< tab header="Windows Powershell" >}}

Windows Powershell specific commands here.

{{< /tab >}}
{{< /tabpane >}}

Tables

{{< table "table table-name" >}}
|  Col 0 |  Col 1 |  Col 2 |  Col 3  |
|:------:|:------:|:------:|:-------:|
|   A1   |   A2   |   A3   | Ap(1-3) |
|   A4   |   A5   |   A6   | Ap(4-6) |
|   B1   |   B2   |   B3   | Bp(1-3) |
|   B4   |   B5   |   B6   | Bp(4-6) |
{{< table />}}