Add schedule demo CTA (#6446)

* Add schedule demo CTA

Added a CTA to schedule a demo on:

- get-started.ejs
- basic-article.ejs

* Update get-started.ejs

Added UTM link

* Added tracking to calendly and get-started button

- Added standard source tag to calendly
- added "?tryitnow" to get-started button so GA can track clicks as conversions

Co-authored-by: Tim Kern <tim@fleetdm.com>
This commit is contained in:
Mike Thomas 2022-06-30 22:44:28 +09:00 committed by GitHub
parent d6313c2c15
commit 3c648d6925
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 17 additions and 8 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

View file

@ -149,7 +149,7 @@
[purpose='bottom-cta'] {
padding-bottom: 80px;
[purpose='next-steps-button'] {
padding: 16px 32px;
padding: 16px 24px;
line-height: 24px;
font-size: 16px;
img {

View file

@ -20,7 +20,7 @@
a {
font-size: 16px;
line-height: 25px;
padding: 16px 32px;
padding: 16px 24px;
}
}

View file

@ -17,14 +17,18 @@
<div purpose="bottom-cta" class="d-block">
<h3 style="font-size: 24px; line-height: 32px;">Explore Fleet</h3>
<p class="my-4">Find out how Fleet can benefit your organization by exploring our docs and community. <br>Want to get up and running quicker? Then try out Fleet locally on your device - youll be up and running in minutes.</p>
<div class="d-sm-flex">
<a href="/get-started" class="d-flex btn btn-primary btn-md justify-content-center align-items-center mr-sm-3" purpose="next-steps-button">
<div class="d-md-flex">
<a href="/get-started?tryitnow" class="d-flex flex-fill btn btn-primary btn-md justify-content-center align-items-center mt-3 mt-md-0 mr-sm-3" purpose="next-steps-button">
Try it out
</a>
<a href="/slack" target="_blank" class="d-flex btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-sm-0" purpose="next-steps-button">
<a href="/slack" target="_blank" class="d-flex flex-fill btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-md-0 mr-sm-3" purpose="next-steps-button">
<img class="pr-3" alt="Slack logo" src="/images/logo-slack-24x24@2x.png"/>
Join <span purpose="large-button-text">&nbsp;the&nbsp;</span> Fleet <span purpose="large-button-text">&nbsp;community&nbsp;</span>on Slack
</a>
<a href="https://calendly.com/fleetdm/demo?utm_source=article+demo+top" target="_blank" class="d-flex flex-fill btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-md-0 mr-3 mr-md-0" purpose="next-steps-button">
<img class="pr-3" alt="Schedule demo" src="/images/icon_schedule-demo-26x24@2x.png"/>
Schedule a demo
</a>
</div>
</div>
</div>

View file

@ -54,16 +54,21 @@
</div>
<div style="padding-top: 60px;">
<h2 class="mb-4">Next steps</h2>
<div class="d-sm-flex" purpose="get-started-buttons">
<div class="d-md-flex" purpose="get-started-buttons">
<a href="/docs/using-fleet/learn-how-to-use-fleet"
class="d-flex btn btn-primary btn-md justify-content-center mr-sm-3">
class="d-flex flex-fill btn btn-primary btn-md justify-content-center mt-3 mt-md-0 mr-0 mr-md-3">
Learn how to use Fleet
</a>
<a href="/slack" target="_blank"
class="d-flex btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-sm-0">
class="d-flex flex-fill btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-md-0 mr-0 mr-md-3">
<img style="height: 24px;" class="pr-3 d-inline" alt="Slack logo" src="/images/logo-slack-24x24@2x.png" />
Ask for help on Slack
</a>
<a href="https://calendly.com/fleetdm/demo?utm_source=get+started+demo" target="_blank"
class="d-flex flex-fill btn btn-md btn-outline-secondary justify-content-center align-items-center mt-3 mt-md-0 mr-0">
<img style="height: 24px;" class="pr-3 d-inline" alt="Schedule demo" src="/images/icon_schedule-demo-26x24@2x.png" />
Schedule a demo
</a>
</div>
</div>