△ HUMAN DESIGN △ BLOG △ LOGIN △ CONTACT

How to change the font-styles:

a. Go to 'Settings' and choose 'Style Guide'. Scroll down and you will see the 'Font' section. Choose your desired font styles for your heading and body. (You can also change your font sizes.)

b. Notice there are other 2 font-styles here which you can't see in the Style Guide Settings. These two font-styles are embedded from Adobe Fonts or Google Fonts using custom codes. This is only an option if you wanted to use all 4 different font-styles.

 

-- 1. Choose 2 font styles from Google or Adobe (in Adobe you will need to create an account) that you can use as 3rd font and 4th font (handwritten/script style) There are free fonts available.

 

-- 2. For your 3rd font, copy and paste this code first to 'Settings' -> 'Custom Code':

h5 {
font-family: YOUR CODE HERE;
}

After that, get the font's CSS code provided by Google or Adobe and paste it in the 'YOUR CODE HERE' part.

Example:

h5 {
font-family: oswald, sans-serif;
}

The h5 in the code means Heading 5, so your Heading 5 texts across your page will have this font-style. You still have the option to change it whether to h3, h4 or h6 etc. Just change the heading number in the code.

After this, get the HTML <link> of the font and paste it to the block name '3rd font HTML link' in this section.

 

-- 3. For your 4th font (handwritten or script style), get its @import link first and paste it into the 'Settings' -> 'Custom Code'. 

After that, to apply the font style to the text, just copy and paste the inline CSS code of your font. It will look like this

Example:

<span style="font-family: 'meow-script', sans-serif; font-size: 50px;"> </span>

You can change the font-size too.

 

These steps are just shortcuts. To follow the full steps, read it here: https://help.kajabi.com/hc/en-us/articles/360040951754-How-to-Embed-Custom-Fonts-to-Your-Page 

live *TYPE OF FREEBIE* BY  *YOUR NAME*

How to change the color of the linear gradients:

Open the source code and change the inline CSS code (bolded) according to your choice of color. You can get the numbers of RGBA here: https://www.rapidtables.com/convert/color/hex-to-rgb.html 

<span style="background: linear-gradient(180deg,rgba(255,241,210,0) 50%, #fff1d2 30%);">  </span>

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.


Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.

CALL TO ACTION! →

DID YOU KNOW?

Lorem ipsum dolor sit amet, consectetur adipiscing elit sed do eiusmod tempor incididunt ut.


LOREM IPSUM DOLOR SIT AMET:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Incididunt ut labore et dolore magna...

TL;DR - Lorem ipsum dolor sit amet.
(Elit—sed do.)

CALL TO ACTION!

To change the icons:

1. Upload your icons first to the page and then grab the image address (right-click then 'Copy Image Address')

2. Open the source code of the text block and then you will see this part:

<div><img src="https://kajabi-storefronts-production.kajabi-cdn.com/kajabi-storefronts-production/file-uploads/themes/2157298208/settings_images/62b1476-bed1-dafa-70f-a0a1af12c420_1.png" width="50" height="50" style="float: left;" /></div>

Replace the bolded/underlined part with the image address you copied.

3. You can now delete the images you uploaded.

Lorem ipsum dolor sit amet, consectetur adipiscing elit:

 

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.

PLUS... lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus.

CALL TO ACTION!
LOREM IPSUM DOLOR SIT AMET CONSECTETUR ADIPISCING...


It’s time to lorem

IPSUM


to lorem ipsum

DOLOR


with the lorem

IPSUM


at the lorem

IPSUM


AND LOREM IPSUM DOLOR SIT AMET CONSECTETUR.

Lorem ipsum dolor, sit amet:


Get this workbook for free when you register. Habitasse vitae cubilia odio sed. Mauris pellentesque magna aliqua!

CALL TO ACTION!
LOREM IPSUM, DOLOR

Lorem ipsum dolor sit amet, consectetur adipiscing elit

CALL TO ACTION!

VIDEO SIZE: 1920x1080px

VIDEO IN FRAME: 588x946px

HI! I'M

*YOUR

NAME*

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.

HI! I'M

*YOUR

NAME*

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.

AS SEEN IN:

THIS IS FOR YOU IF...

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris.


Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec nullam mus. Mauris vel mauris.


Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec nullam mus. Mauris vel mauris.


Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.


I CAN SHOW YOU HOW.

CALL TO ACTION!

Jon Doe

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed.

Jane Doe

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed.

Jim Doe

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed.

DID YOU KNOW THAT:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed.

get ready to unlock

SECRETS TO LOREM IPSUM DOLOR

Sit Amet Consectetur Adipiscing Elit

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed.

CALL TO ACTION!

A NOTE
FROM
NAME

 

One day, lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.

 

What's the lorem ipsum?


Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.

Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.


Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.

Your Name

NEED MORE DEETS?

I gotcha covered!

THIS FREEBIE IS LOREM IPSUM DOLOR

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris.

THIS FREEBIE IS LOREM IPSUM DOLOR

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.


THIS FREEBIE IS LOREM IPSUM DOLOR

Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus. Mauris vel mauris. Orci fusce ipsum faucibus scelerisque.

 

Lorem ipsum dolor sit amet, consectetur adipi scing elit, sed do eius mod tempor incididunt.


Lorem ipsum dolor sit amet, metus at rhoncus dapibus, habitasse vitae cubilia odio sed. Mauris pellentesque eget lorem malesuada wisi nec, nullam mus.

So hit that call to action now!

CALL TO ACTION!