Section & Variations › Header
Available Parameters
| Parameter | Type | Description |
|---|---|---|
variation
|
Text
Default : header-default
|
Set variation for Header section. List of available variations :
|
icon
|
Text Icon Class Name | Set icon for Header section. Example: ic-users-three primary-3
|
title
|
Text
required |
Set title for Header section. |
description
|
Text | Set description for Header section. |
image
|
Filename | Set image for Header section. The value is name of image file in the src/assets/images/ folder. |
ctaType
|
Text
alllow : default, include
|
Set type of CTA parameter value. |
cta
|
Text HTML -- or -- Twig FileName for : "ctaType":"include"
|
Display CTA in header section. Example: "ctaType" : "include",
|
checkList
|
Array of Text | Set list of check list item. Example: [
|
form
|
Form File Name
Available for : header-contact-us
|
Set form for Header Contact Us. Example: partials/form-contact-us.twig
|
Available Variations
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-default',
'title' : 'Powerful SaaS technology to help you achieve more',
'image' : 'homepage-5-header-image.png',
'cta' : '<a class="btn btn-lg btn-primary btn-icon" href="#play">Play Video <i class="ic ic-play white"></i></a>',
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-variation-1',
'title' : 'Drive Growth with our Scalable SaaS Applications',
'description' : 'Discover how our SaaS solution can streamline your daily operations, saving you time and resources.',
'image' : 'homepage-1-header-image.png',
'ctaType' : 'include',
'cta' : 'partials/form-get-started.twig',
'checkList' : [
'Free invitations to unlimited freelancers and clients',
'All-in-one tool replaces a minimum of 3x current tools',
],
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-variation-2',
'title' : 'Drive Growth with our Scalable SaaS Applications',
'description' : 'Discover how our SaaS solution can streamline your daily operations, saving you time and resources.',
'image' : 'homepage-2-header-image.png',
'cta' : '<a class="btn btn-lg btn-primary" href="#get-demo">Schedule a Demo</a>',
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-variation-3',
'navbarClasses' : 'navbar-light',
'title' : 'Powerful SaaS technology to help you achieve more',
'description' : 'Discover how our SaaS solution can streamline your daily operations, saving you time and resources.',
'image' : 'homepage-3-header-image.png',
'cta' : '<a class="btn btn-lg btn-brand-primary-3 btn-icon" href="#get-started">Get Started <i class="ic ic-chevron-right white"></i></a>
<a class="btn btn-lg btn-white" href="#get-demo">Request Demo</a>',
'checkList' : [
'Free trial 30 days',
'No credit card',
],
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-variation-4',
'title' : 'Experience the future of SaaS tools with Entrada',
'description' : 'Discover how our SaaS solution can streamline your daily operations, saving you time and resources.',
'image' : 'homepage-4-header-image.png',
'ctaType' : 'include',
'cta' : 'partials/form-get-started.twig',
'checkList' : [
'Free trial 30 days',
'No credit card',
],
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-default',
'icon' : 'ic-users-three primary-3',
'title' : 'Real-time collaboration <br/>and cloud storage',
'description' : 'Discover how our SaaS solution can streamline your daily operations, saving you time and resources.'
} %}
Section Preview
Starter Kit Codes
{# include sections/header #}
{% include "sections/header.twig", with {
'variation' : 'header-contact-us',
'title' : 'Get in touch with us today',
'description' : 'Have a question? We have answers. Whether you need technical support, want to learn more about feature management as a best practice',
'image' : false,
'cta' : '<div class="testimonial-box">
<div class="rating"><i class="ic ic-star"></i><i class="ic ic-star"></i><i class="ic ic-star"></i><i class="ic ic-star"></i><i class="ic ic-star"></i></div>
<div class="content"><p>“The most beautiful and easy to use no-code machine learning tool I have seen.”</p></div>
<div class="author">
<strong>David Bishop</strong>
<span>Marketing Manager at EFG Co.</span>
</div>
</div>',
'form' : 'partials/form-contact-us.twig'
} %}
Section Preview