Skip to content

Call To Action(CTA) panels

Peter Milchev edited this page Nov 5, 2020 · 25 revisions

What is the CTA panel?

The Call to Action panels are small portions of HTML on the page with the purpose of engaging new clients to go and start a Trial.

How to Enable CTA panel?

To enable the automatic rendering of CTA panels, you need to:

  1. Go to the _config.yml file of your product's documentation repository
  2. Set has_cta_panels: true

Then, you just need to:

  1. Trigger the Jenkins build for your documentation and eventually
  2. Promote the result production, if the result in the test environment is correct

Voila, you have automatic CTA panels now :)

How to Change CTA panel Avatar and Text?

The text and avatar are controlled by the data in _data/support_products.yml

The data relies on the product name set in the _config.yml file

The options for avatar are Kendoka, DevCraft, and Ninja.

cta_panels_data:
  "ProducName":
    message: "Message after <Product is a>"  
    trial_url: "https://www.telerik.com/download-trial-file/v2-b/ui-for-asp.net-ajax" 
    product_url: "https://www.telerik.com/products/aspnet-ajax.aspx"
    avatar: "Ninja"

How to Change CTA panel position?

In case the position of the default panel is wrong or could be placed better, you can add the following code inside the .md file in question:

Note: the if is needed only for cases where you want to hide all CTA panels, automatic and manual, when the has_cta_panels is not set to true

  1. Main CTA:
{% if site.has_cta_panels == true %}
{% include cta-panel-main.html %}
{% endif %}
  1. Rest CTA:
{% if site.has_cta_panels == true %}
{% include cta-panel-rest-of-pages.html %}
{% endif %}

How to Disable CTA panels?

The only thing you need to do is either remove has_cta_panels from your _config.yml file or set it to false

Note: If you did not wrap the manually added {% include <cta-panel-path.html> %} inside if conditions, you need to go and remove all such instances manually