Hero section with background image text

Show details...

Syntax

{{< hero-section-with-background-image-text
background-image="Any valid image link"
button-background-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-background-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-background-hover-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-background-hover-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-border-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-border-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-border-hover-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-border-hover-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-border-radius-1="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
button-border-radius-2="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
button-border-width-1="Any valid number with unit like 10px, 1em, 0.8rem, 100vh or 50%"
button-border-width-2="Any valid number with unit like 10px, 1em, 0.8rem, 100vh or 50%"
button-link-1="Any valid http link"
button-link-2="Any valid http link"
button-padding-1="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
button-text-1="Any text"
button-text-2="Any text"
button-text-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-text-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-text-hover-color-1="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
button-text-hover-color-2="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
heading-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
height="Any valid number with unit like 10px, 1em, 0.8rem, 100vh or 50%"
image="Any valid image link"
image-align-horizontal="Use left, center or right to align horizontally"
image-align-vertical="Use top, center or bottom to align vertically"
image-height="Any valid number with unit like 10px, 1em, 0.8rem, 100vh or 50%"
image-margin="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
is-flipped="true|false"
is-full-width="true|false"
is-link-hover-underlined="true|false"
is-link-underlined="true|false"
is-open-in-new="true|false"
link-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
link-hover-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
list-arrow-style="s-none|s-1|s-2|s-3|s-4|s-5"
list-text-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
margin="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
padding="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
text-align-horizontal="Use left, center or right to align horizontally"
text-align-vertical="Use top, center or bottom to align vertically"
text-background-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
text-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)" >}}

The actual message goes here

{{< /hero-section-with-background-image-text >}}

Samples

This is sample heading

We help businesses grow, launch products and gain a competitive advantage in today’s digital-led world. It is one of the most frequently asked questions on the internet. Digitalization means transforming any business into a digital business using digital technologies. The main purpose of digitalization is to generate higher revenue and create new value-added opportunities. At present, many companies are in the process of digitization. Top businesses have already done this technique and are very successful in economic, financial, and customer satisfaction.We help businesses grow, launch products and gain a competitive advantage in today’s digital-led world. It is one of the most frequently asked questions on the internet.

  • Cake Sample 1
  • Cake Sample 2