AVL Image Settings

HTML Widget

You can write HTML that will be rendered to the user upon creation of a container. This widget supports several particular variables. Take for example the default widget:

  <p class="verify-button-success-text" style="font-weight: bold; color: #008200;">
    Your {{ preset_name }} lab has been launched. <br />
    It will run for the next {{ run_till }}.
  </p>

  <p>
  {% if ports.primary.url %}
    <strong>Login page:</strong>
    <a href="http://{{ ports.primary.url }}" target="_blank">
      {{ ports.primary.url }}
    </a>
  {% endif %}

  {% if login_username %}
    <br />
    <strong>Username:</strong> {{ login_username }}<br />
    <strong>Password:</strong> {{ login_password }}
  {% endif %}
  </p>

You’ll note several variables in this HTML Widget: 
{{ preset_name }}, {{ run_till }}, {{ ports.primary.url }}, and {{ ports.primary.endpoint }}, {{ login_username }}, {{ login_password }}. When this page is rendered to the user, the variables will be populated with data from his or her specific lab instance. A rendered template may look like this:

In this case, only some of the variables rendered. This happened because of the {% if ... %} clauses in the HTML snippet.