Skip to main content
You are here:
Print

Work With Me Page Guide

If you use the One-Click Theme Setup, then the demo About Page will automatically be created for you using Gutenberg editor blocks. You can learn more about Atomic Blocks by going to the plugin page.

To edit the About Page, go to Pages > About and begin editing the blocks.

#1. Hero Section

  1. Container Settings
    1. Fullwidth
    2. Padding Top 2%
    3. Margin Bottom 7%
    4. Inside Max Width 1140px
    5. Set Background Color
    6. Advanced Css Class(es) “herosection”
  2. Advanced Columns
    1. Padding Unit: Pixel
    2. Padding Top, Bottom and Left 30px
    3. Select Background Image – Image Size to use 1920×600
  3. Heading H2, Heading H5 and Paragraph Block on left side

#2. Info Section

  1. Container
    1. Margin Bottom 4%
    2. Inside Max Width 1140px
  2. Heading H2, Spacer with “small” Advanced Class, Content and Button

#3. Education Details

  1. Container
    1. Padding Top and Bottom 3%
    2. Margin Top and Bottom 5%
    3. Inside Max Width 800px
    4. Background Image
    5. Advanced Css Class(es) “containbg” to fit background inside container
  2. Heading H5 and Paragraph

#4. Testimonial Section

  1. Container
    1. Padding Top and Bottom 2%
    2. Inside Max Width 1140px
  2. Advanced Columns
    1. Columns: 2
    2. Advanced Css Class(es) “testimonials”
  3. Inside Columns Media and Text Block used
          1. Left: Image, Size of Image 200×200
          2. Right: Content + Heading H5

 

#5. Quick Section

  1. Container
    1. Padding Top and Bottom 2%
    2. Inside Max Width 1140px
  2. Add Media & Text Block Inside
  3. Image left side, Size of Image 600×600
  4. Heading H2 and List Block with “Large” style on right side

#6. Call to Action Section

  1. Container
    1. Fullwidth
    2. Padding Top 2%
    3. Margin Bottom 8%
    4. Inside Max Width 1200px
  2. Add Call to Action Block with Below Settings
    1. Title Font Size 27px
    2. Text Font Size 17px
    3. Background Color set to same as Container Background Color
    4. Button Options: Size “Small” Button Share: “Square” and Background Color
    5. Advanced Css Class(es) “btn” so Call to Action button look like default button of theme

#7. More Info Sections

Section 1

  1. Advanced Columns
    1. Columns: 2
    2. Columns Gap 8%
  2. Add Heading H2, Heading H5 and Content on left side
  3. Add Image on right side, Size of Image 600×600
Spacer

  1. Spacer with Height 70px
Section 2

  1. Advanced Columns
    1. Columns: 2
    2. Columns Gap 8%
  2. Add Image on left side, Size of Image 600×600
  3. Add Content and Button on right side

#8. Testimonial Section

  1. Container
    1. Fullwidth
    2. Padding Top 2%
    3. Margin Top 8%
    4. Inside Max Width 1140px
    5. Background Color “#fef9f8”
  2. Advanced Columns
    1. Columns: 2
    2. Advanced Css Class(es) “testimonials”
  3. Inside Columns Media & Text Block
    1. Image on left side, Size of Image 200×200
    2. Content and Heading H5 on right side
  4. Add Call to Action Block inside Container with Below Settings
    1. Title Font Size 27px
    2. Text Font Size 17px
    3. Background Color set to same as Container Background Color
    4. Button Options: Size “Small” Button Share: “Square” and Background Color
    5. Advanced Css Class(es) “btn” so Call to Action button look like default button of theme
  1.  

Table of Contents