Elgato_dark/fleet
1
0
Fork 0
mirror of https://github.com/fleetdm/fleet synced 2026-05-23 17:08:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 83

Website: update personalization on homepage and endpoint ops (#18616)

Browse source 
Closes: https://github.com/fleetdm/confidential/issues/6336

Changes:
- Updated personalization on the homepage and the endpoint ops page
This commit is contained in:
Eric 2024-04-29 16:40:57 -05:00 committed by GitHub
parent bde910a827
commit 2ba0f01502
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 182 additions and 71 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
website/api/controllers/view-endpoint-ops.js vendored
View file

@ -26,9 +26,9 @@ module.exports = {
// Specify an order for the testimonials on this page using the last names of quote authors
let testimonialOrderForThisPage = ['Charles Zaffery','Dan Grzelak','Nico Waisman','Tom Larkin','Austin Anderson','Erik Gomez','Nick Fohs','Brendan Shaklovitz','Mike Arpaia','Andre Shields','Dhruv Majumdar','Ahmed Elshaer','Abubakar Yousafzai','Harrison Ravazzolo','Wes Whetstone','Kenny Botelho', 'Chandra Majumdar','Eric Tan'];
if(this.req.session.primaryBuyingSituation === 'eo-it'){
testimonialOrderForThisPage = ['Eric Tan', 'Tom Larkin', 'Nick Fohs', 'Harrison Ravazzolo', 'Wes Whetstone', 'Chandra Majumdar', 'Erik Gomez', 'Mike Arpaia', 'Kenny Botelho'];
} else if(this.req.session.primaryBuyingSituation === 'eo-security'){
if(['eo-it', 'mdm'].includes(this.req.session.primaryBuyingSituation)){
testimonialOrderForThisPage = [ 'Harrison Ravazzolo', 'Eric Tan','Erik Gomez', 'Tom Larkin', 'Nick Fohs', 'Wes Whetstone', 'Mike Arpaia', 'Kenny Botelho'];
} else if(['eo-security', 'vm'].includes(this.req.session.primaryBuyingSituation)){
testimonialOrderForThisPage = ['Nico Waisman','Charles Zaffery','Abubakar Yousafzai','Eric Tan','Mike Arpaia','Chandra Majumdar','Ahmed Elshaer','Brendan Shaklovitz','Austin Anderson','Dan Grzelak','Dhruv Majumdar'];
}
// Filter the testimonials by product category and the filtered list we built above.

28
website/assets/styles/pages/homepage.less vendored
View file

@ -132,7 +132,7 @@
&:hover {
box-shadow: 0px 4px 16px 0px #E2E4EA;
}
&:first-of-type {
&.nick-fohs {
[purpose='testimonial-video'] {
background: url('/images/video-testimonial-thumbnail-nick-fohs-160x120@2x.png');
background-position: center;
@ -141,7 +141,7 @@
margin-right: 20px;
margin-left: 0px;
}
&:last-of-type {
&.austin-anderson {
[purpose='testimonial-video'] {
background: url('/images/video-testimonial-thumbnail-austin-anderson-160x120@2x.png');
background-position: center;
@ -730,22 +730,27 @@
[purpose='category-text-block'] {
max-width: 410px;
}
[purpose='platform-block'] {
.left {
margin-right: 24px;
}
.right {
margin-left: 24px;
}
}
[purpose='endpoint-ops-image'] {
margin-right: 24px;
img {
height: auto;
width: 100%;
}
}
[purpose='device-management-image'] {
margin-left: 24px;
img {
height: auto;
width: 100%;
}
}
[purpose='vuln-management-image'] {
margin-left: 24px;
img {
height: auto;
width: 100%;
@ -935,9 +940,18 @@
width: 100%;
}
}
[purpose='platform-block'] {
.left {
margin-right: auto;
margin-left: auto;
}
.right {
margin-right: auto;
margin-left: auto;
}
}
[purpose='endpoint-ops-image'] {
margin-right: auto;
margin-left: auto;
margin-bottom: 20px;
img {
width: 100%;

8
website/views/pages/endpoint-ops.ejs vendored
View file

@ -11,14 +11,14 @@
<img alt="A device verifying compliance for every endpoint" src="/images/endpoint-operations-hero-image-380x380@2x.png">
</div>
<div purpose="hero-text">
<% if(primaryBuyingSituation === 'eo-it') { %>
<% if(['eo-it', 'mdm'].includes(primaryBuyingSituation)) { %>
<strong>Pulse check anything</strong>
<p>Use a live connection to every endpoint to simplify audit, compliance, and reporting from workstations to data centers.</p>
<strong>Ship data to any platform</strong>
<p>Ship logs to any platform like Splunk, Snowflake, or <a href="/docs/using-fleet/log-destinations">any streaming infrastructure</a> like AWS Kinesis and Apache Kafka.</p>
<strong>Automate anything</strong>
<p>Remotely run scripts and prompts to complete tasks on every kind of computer, including Linux.</p>
<% } else if(primaryBuyingSituation === 'eo-security') { %>
<% } else if(['eo-security', 'vm'].includes(primaryBuyingSituation)) { %>
<strong>Osquery on easy mode</strong>
<p>You don’t need to be an osquery expert to get the answers you need from your devices, Fleet does some of that for you.</p>
<strong>Pulse check anything</strong>
@ -71,11 +71,11 @@
</div>
<% } %>
<div purpose="testimonial-videos" class="d-flex">
<%if(primaryBuyingSituation === 'eo-security'){%>
<%if(['eo-security', 'vm'].includes(primaryBuyingSituation)){%>
<div purpose="testimonial-video" class="austin-anderson mx-auto" @click="clickOpenVideoModal('austin-anderson')">
<span><img src="/images/icon-play-video-8x9@2x.png" alt="Play">Play video</span>
</div>
<%} else if(primaryBuyingSituation === 'eo-it') {%>
<%} else if(['eo-it', 'mdm'].includes(primaryBuyingSituation)) {%>
<div purpose="testimonial-video" class="nick-fohs mx-auto" @click="clickOpenVideoModal('nick-fohs')">
<span><img src="/images/icon-play-video-8x9@2x.png" alt="Play">Play video</span>
</div>

211
website/views/pages/homepage.ejs vendored
View file

@ -27,26 +27,30 @@
<%/* Testimonial videos */%>
<div purpose="page-section" class="mb-0">
<div purpose="testimonials" class="d-flex flex-lg-row flex-column justify-content-center card-deck">
<div purpose="testimonial" class="d-flex align-items-center card" @click="clickOpenVideoModal('nick-fohs')">
<div purpose="testimonial-video" class="card-title">
<img alt="Play video" src="/images/icon-play-48x48@2x.png">
<% if(['mdm', 'eo-it'].includes(primaryBuyingSituation)) {%>
<div purpose="testimonial" class="nick-fohs d-flex align-items-center card" @click="clickOpenVideoModal('nick-fohs')">
<div purpose="testimonial-video" class="card-title">
<img alt="Play video" src="/images/icon-play-48x48@2x.png">
</div>
<div purpose="testimonial-text">
<p purpose="testimonial-quote">“Fleet lets us to be as lightweight as possible while surfacing data to other teams and partners.”</p>
<p class="mb-0"><strong>Nick Fohs</strong></p>
<p class="mb-0">Systems and IT infrastructure manager</p>
</div>
</div>
<div purpose="testimonial-text">
<p purpose="testimonial-quote">“Fleet lets us to be as lightweight as possible while surfacing data to other teams and partners.”</p>
<p class="mb-0"><strong>Nick Fohs</strong></p>
<p class="mb-0">Systems and IT infrastructure manager</p>
<%} else if(['vm', 'eo-security'].includes(primaryBuyingSituation)) {%>
<div purpose="testimonial" class="austin-anderson d-flex align-items-center card" @click="clickOpenVideoModal('austin-anderson')">
<div purpose="testimonial-video" class="card-title">
<img alt="Play video" src="/images/icon-play-48x48@2x.png">
</div>
<div purpose="testimonial-text">
<p purpose="testimonial-quote">“We can build it exactly the way we want it. Which is just not possible on other platforms.”</p>
<p class="mb-0"><strong>Austin Anderson</strong></p>
<p class="mb-0">Cybersecurity team senior manager</p>
</div>
</div>
</div>
<div purpose="testimonial" class="d-flex align-items-center card" @click="clickOpenVideoModal('austin-anderson')">
<div purpose="testimonial-video" class="card-title">
<img alt="Play video" src="/images/icon-play-48x48@2x.png">
</div>
<div purpose="testimonial-text">
<p purpose="testimonial-quote">“We can build it exactly the way we want it. Which is just not possible on other platforms.”</p>
<p class="mb-0"><strong>Austin Anderson</strong></p>
<p class="mb-0">Cybersecurity team senior manager</p>
</div>
</div>
<%}%>
<% %>
</div>
</div>
</div>
@ -79,53 +83,146 @@
</div>
<% } %>
<div purpose="homepage-content" class="container">
<div purpose="page-section">
<%/* Endpoint ops block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Endpoint ops</h4>
<h3>Understand your computers</h3>
<p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
<div purpose="page-section">
<% if(!primaryBuyingSituation){ %>
<%/* Endpoint ops block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Endpoint ops</h4>
<h3>Understand your computers</h3>
<p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
</div>
</div>
<div purpose="endpoint-ops-image" class="right">
<img alt="Endpoint ops" src="/images/endpoint-operations-hero-image-380x380@2x.png">
</div>
</div>
<div purpose="endpoint-ops-image">
<img alt="Endpoint ops" src="/images/endpoint-operations-hero-image-380x380@2x.png">
</div>
</div>
<%/* Device management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="device-management-image">
<img alt="Operating systems entering a glass device management dome" src="/images/device-management-hero-380x293@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Device management</h4>
<h3>Manage everything in one place</h3>
<p>Modernize your device management practice with a single, open platform for Apple, Windows, and Linux.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/device-management">Start with device management</a>
<%/* Device management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="device-management-image" class="left">
<img alt="Operating systems entering a glass device management dome" src="/images/device-management-hero-380x293@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Device management</h4>
<h3>Manage everything in one place</h3>
<p>Modernize your device management practice with a single, open platform for Apple, Windows, and Linux.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/device-management">Start with device management</a>
</div>
</div>
</div>
</div>
<%/* Vulnerability management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Vulnerability management</h4>
<h3>Build the vulnerability program you actually want</h3>
<p>Show how quickly zero days and "celebrity CVEs" are resolved and which teams need extra help. Use scoring, known exploit feeds, and live, down-to-the-chip data about your own environment to prioritize, export, automate, and monitor mitigations of everyday vulnerabilities in operating systems, software packages, browsers, and plugins, anywhere.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/vulnerability-management">Start with vuln management</a>
<%/* Vulnerability management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Vulnerability management</h4>
<h3>Build the vulnerability program you actually want</h3>
<p>Show how quickly zero days and "celebrity CVEs" are resolved and which teams need extra help. Use scoring, known exploit feeds, and live, down-to-the-chip data about your own environment to prioritize, export, automate, and monitor mitigations of everyday vulnerabilities in operating systems, software packages, browsers, and plugins, anywhere.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/vulnerability-management">Start with vuln management</a>
</div>
</div>
<div purpose="vuln-management-image" class="right">
<img alt="An orb being scanned for vulnerabilities" src="/images/vuln-management-hero-image-345x380@2x.png">
</div>
</div>
<div purpose="vuln-management-image">
<img alt="An orb being scanned for vulnerabilities" src="/images/vuln-management-hero-image-345x380@2x.png">
</div>
</div>
<% } else if(['eo-it', 'eo-security'].includes(primaryBuyingSituation)) {%>
<%/* Endpoint ops block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Endpoint ops</h4>
<h3>Understand your computers</h3>
<p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
</div>
</div>
<div purpose="endpoint-ops-image" class="right">
<img alt="Endpoint ops" src="/images/endpoint-operations-hero-image-380x380@2x.png">
</div>
</div>
<%if(primaryBuyingSituation === 'eo-it'){ %>
<%/* Device management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="device-management-image" class="left">
<img alt="Operating systems entering a glass device management dome" src="/images/device-management-hero-380x293@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Device management</h4>
<h3>Manage everything in one place</h3>
<p>Modernize your device management practice with a single, open platform for Apple, Windows, and Linux.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/device-management">Start with device management</a>
</div>
</div>
</div>
<% } else {%>
<%/* Vulnerability management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="vuln-management-image" class="left">
<img alt="An orb being scanned for vulnerabilities" src="/images/vuln-management-hero-image-345x380@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Vulnerability management</h4>
<h3>Build the vulnerability program you actually want</h3>
<p>Show how quickly zero days and "celebrity CVEs" are resolved and which teams need extra help. Use scoring, known exploit feeds, and live, down-to-the-chip data about your own environment to prioritize, export, automate, and monitor mitigations of everyday vulnerabilities in operating systems, software packages, browsers, and plugins, anywhere.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/vulnerability-management">Start with vuln management</a>
</div>
</div>
</div>
<% } %>
<% } else if(['vm', 'mdm'].includes(primaryBuyingSituation)) {%>
<%if(primaryBuyingSituation === 'mdm'){ %>
<%/* Device management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="device-management-image" class="left">
<img alt="Operating systems entering a glass device management dome" src="/images/device-management-hero-380x293@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Device management</h4>
<h3>Manage everything in one place</h3>
<p>Modernize your device management practice with a single, open platform for Apple, Windows, and Linux.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/device-management">Start with device management</a>
</div>
</div>
</div>
<% } else {%>
<%/* Vulnerability management block */%>
<div purpose="platform-block" class="d-flex flex-md-row flex-column justify-content-md-between mx-auto align-items-center">
<div purpose="vuln-management-image" class="left">
<img alt="An orb being scanned for vulnerabilities" src="/images/vuln-management-hero-image-345x380@2x.png">
</div>
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Vulnerability management</h4>
<h3>Build the vulnerability program you actually want</h3>
<p>Show how quickly zero days and "celebrity CVEs" are resolved and which teams need extra help. Use scoring, known exploit feeds, and live, down-to-the-chip data about your own environment to prioritize, export, automate, and monitor mitigations of everyday vulnerabilities in operating systems, software packages, browsers, and plugins, anywhere.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/vulnerability-management">Start with vuln management</a>
</div>
</div>
</div>
<% } %>
<div purpose="platform-block" class="d-flex flex-md-row flex-column-reverse justify-content-md-between mx-auto align-items-center">
<div purpose="category-text-block" class="d-flex flex-column">
<h4>Endpoint ops</h4>
<h3>Understand your computers</h3>
<p>Use a consistent interface to deploy, update, and manage thousands of workstations and servers with open standards and data.</p>
<div>
<a purpose="category-button" class="text-nowrap btn btn-primary" href="/endpoint-ops">Start with endpoint ops</a>
</div>
</div>
<div purpose="endpoint-ops-image" class="right">
<img alt="Endpoint ops" src="/images/endpoint-operations-hero-image-380x380@2x.png">
</div>
</div>
<% } %>
<%/* Integration cards */%>
<div purpose="integrations-section">
<h2 class="text-center">Connect your favorite tools</h2>