LaywerPro Demo for ListingProWP With Elementor

 

For Elementor Page Builder Users

We are going to make the below sections with different page builder elements.

Section 01

 

Page builder Element: LPRO Stats Element

For this, we need the LPRO Stats Element

Please go to your WordPress admin dashboard. Edit your desired page with Elementor page builder and create a new section and then follow the below steps

Section setting

    1. Click on the Style tab  and set these properties
      • Background: Normal
      • Background Type: Classic
      • Color: #282D41

Step 1: Add LPRO Stats Element

    1. Set these details if you want this as like on the demo
      • First Stat Number: 100
      • First Stat Unit; YRS
      • First Stat Details: Of matching people to attorneys
      • Second Stat Number: 98
      • Second Stat Unit; %
      • Second Stat Details: Lawyers listed are verified
      • Third Stat Number: 10
      • Third Stat Unit; M
      • Third Stat Details: Monthly visit our network
      • Fourth Stat Number: 100
      • Fourth Stat Unit; +
      • Fourth Stat Details: Practice areas covered

______________________________________________________________________________________________________________________________________

Section 02

Section Title:  Our Top Rated Lawyers 

Page builder Element: LPRO Stats Element

For this, we need Heading + Text Editor and LPRO Listings Posts Elements

Step 1: Add Heading Element 

    1. Change the text to Our Top Rated Lawyers 
    2. Align: Center
    3. Go to the Style tab and change the text color to black
    4. Click on Typography and set these properties. 
      • Font Size: 22px
      • Font weight: Bold
      • Line height: 40
    5. Go to the Advanced tab and set the Margin Top: 100px

Step 2: Add Text Editor Element

    1. Change the text to Popular Exclusive Listings In Our Directory
    2. Go to the Style tab and align it to the Center
    3. Click on Typography and set these properties
      • Font Family: Open Sans
      • Font Size: 13px
      • Line Height: 18px
      • Letter Spacing: 2

Step 3: Add LPRO Listings Posts Element

    1. Go to the Content tab and Listings to show 6 and select Ads listings
    2. Go to Advanced and Select the below properties
      • Margin-Top: 50px
      • Margin-Bottom: 70px

______________________________________________________________________________________________________________________________________

Section 03

 

Section Title:  How it Works

Page builder Element: LPRO Columns Element

For this, we need Heading + Text Editor and LPRO Columns Elements

Section setting

    1. Create a section and then edit the section
    2. Click on the Style tab and set these properties
      • Background: Normal
      • Background Type: Classic
      • Color: #282D41

Step 1:: Add Heading Element 

    1. Change the text to How it Works
    2. Align: Center
    3. Go to the Style tab and change the text color to white
    4. Click on Typography and set these properties. 
      • Font Size:  22px
      • Font weight: Bold
      • Line height: 40px
    5. Go to Advanced > Select the below properties
      • Margin-Top: 100px
      • Margin-Bottom: -10px

Step 2: Add Text Editor Element

    1. Change the text to It’s easy to find and book a lawyer and also to share your experience.
    2. Go to the Style tab and align it to the Center
    3. Click on Typography and set these properties
      • Font Family: Open Sans
      • Font Size: 13px
      • Line Height: 18px
      • Letter Spacing: 2

Step 3: Add LPRO Columns Element

    1. Add the search icon in the first columns
    2. Add the calendar icon in the second columns
    3. Add the star icon in the third columns
    4. Go to Advanced and Select the below properties
      • Margin-Top: 50px
      • Margin-Bottom: 100px

______________________________________________________________________________________________________________________________________

Section 04

Section Title:  Browse Attorneys

Page builder Element: LPRO Listings taxonomies Element

For this, we need Heading + Text Editor and LPRO Listings taxonomies Elements

Step 1: Add Heading Element 

    1. Change the text to Browse Attorneys
    2. Align: Center
    3. Go to the Style tab and change the text color to black
    4. Click on typography and set these properties. 
      • Font-family: Open Sans
      • Font Size to 22px
      • Font weight Bold
      • Line height: 40
    5. Go to Advanced > Select the below properties
      • Margin-Top: 100px
      • Margin-Bottom: -10px

Step 2: Add Text Editor Element

    1. Change the text to It’s easy to find and book a lawyer and also to share your experience.
    2. Go to Style tab > and align it to center
    3. Click on Typography and set these properties
      • Font Family: Open Sans
      • Font Size: 13px
      • Line Height: 18px
      • Letter Spacing: 2

Step 3: Add LPRO Listings Taxonomies Element

    1. Select your desired Locations, Practice area, Legal topics, and Features.
    2. Go to Advanced and Select the below properties
      • Margin-Top: 30px
      • Margin-Bottom: 100px

__________________________________________________________________________________________________________________________

Section 05

 

Page builder Element: LPRO Activities Element 

For this, we need the LPRO Activities Element 

Section Setting:  

    1. Create a section and then edit the section
    2. Click on the Style tab > and set these properties
      • Background: Normal
      • Background Type: Classic
      • Image: Blue ( Available in the Media)

Step 1: Add LPRO Activities Element 

    1. Go to the Content tab > Check the section title and sub-title
    2. Activities:  9 Activities

__________________________________________________________________________________________________________________________

Section 06

 

Section Title:  From Our Blogs

Page builder Element: LPRO Blog Posts

For this, we need Heading + Text Editor and LPRO Blog Posts Elements

Step 1: Add Heading Element 

    1. Change the text to From Our Blogs
    2. Align: Center
    3. Go to the Style tab and change the text color to black
    4. Click on Typography and set these properties.
      • Font-family: Open Sans
      • Font Size:  22px
      • Font weight: Bold
      • Line height: 40
    5. Go to Advanced and Select the below properties
      • Margin-Top: 100px
      • Margin-Bottom: -10px

Step 2: Add Text Editor Element

    1. Change the text to See Services In These Cities
    2. Go to the Style tab and align it to center
    3. Text-color: #7A7A7A
    4. Click on Typography and set these properties
      • Font Family: Open Sans
      • Font Size: 13px
      • Line Height: 18px
      • Letter Spacing: 2

Step 3:  Add LPRO Blog Posts

    1. Go to Advanced and Select the below properties
      • Margin-Top: 50px
      • Margin-Bottom: 70px

 

__________________________________________________________________________________________________________________________

Section 06

 

Section Title:  Featured in

Page builder Element: LPRO Partners Element 

For this, we need Heading and LPRO Partners Elements

Section setting

    1. Create a section and then edit the section
    2. Click on the Style tab > and set these properties
      • Background: Normal
      • Background Type: Classic
      • Color: #282D41

Step 1: Add Heading Element 

    1. Change the text to Featured in
    2. Align: Center
    3. Go to the Style tab and change the text color to white
    4. Click on Typography and set these properties. 
      • Font-family: Open Sans
      • Font Size to 22px
      • Font weight Bold
      • Line height: 40
    5. Go to Advanced > and add Margin Top: 20px

Step 2: Add LPRO Partners Element 

    1. Add your Partners logo
    2. Copy the repeated field and add your logos 
    3. Also, you can add dummy logos from your media.
    4. Go to Advanced > Select the below properties
      • Margin-Top: 15px
      • Margin-Bottom: 30px

 

__________________________________________________________________________________________________________________________

Congratulations! 

You have created your LawyersPro demo with Elementor successfully 

CBDPro Demo for ListingProWP With Elementor

For Elementor Page Builder Users

We are going to make the below sections with different page builder elements.

Section 1

cbdpro1

Section Title: Featured In

Page Builder Element: CBDPRO Partners Element

For this, we need Heading and CBDPRO Partners Element

Go to your WordPress admin dashboard. Edit your desired page with Elementor page builder and create a new section and then follow the below steps:

Section Setting

      1. Go to the Advanced tab and add Margin-Top: 60px

Step 1: Add Heading Element

      1. Change the text to Featured In
      2.  Html tag: H3
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set Font Family: Roboto

Step 2:  Add the CBDPRO Partners element in the same section

      1. Add your partner’s logo and if you want to add more then click on add new items or click on the copy icon.

 

______________________________________________________________________________________________________________________________________

 Section 2

cbdpro2

Section Title: Discover CBD stores & dispensaries in your state

Page Builder Element: CBDPRO Listing Locations Element

For this, we need Heading and CBDPRO Listing Locations Elements

Section Setting

      1. Click on the Advanced tab and set the Margin-Bottom:60px

Step 1: Add Heading Element

      1. Change the text to: <h2>Discover CBD stores & dispensaries in your state</h2><br>Popular Exclusive Listings In Our Directory
      2.  Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set Font Family: Roboto

Step 2:        Add the CBDPRO Listing Location Element in the same section

      1. Add your desired locations.
      2. Listing to show: Name only

 

_____________________________________________________________________________________________________________________________________

 Section 3

cbdpro3

Section Title: Featured Dispensaries

Page Builder Element: CBDPRO Listing Posts Element

For this, we need Heading and CBDPRO Listing Posts Elements

Section Setting

      1. Click on the Advanced tab and set the Margin-Bottom 60px

Step 1: Add Heading element

      1. Change the text to <h2>Featured Dispensaries</h2><br>Popular Exclusive Listings In Our Directory
      2. Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family Roboto

Step 2:  Add the CBDPRO Listing Posts Element in the same section

      1. Listing to show: 3 Listings
      2. Listing to show: Ads Listings

 

______________________________________________________________________________________________________________________________________

 Section 4

cbdpro4

Section Title: Browse CBD Business By Category

Page Builder Element: CBDPRO Listing Category

For this, we need Heading and CBDPRO Listing Category Elements

Section Setting

      1. Click on the Advanced tab  and set the Margin-Bottom 60px

Step 1: Add Heading Element

      1. Change the text to <h2>Browse CBD Businesses By Category</h2><br>Popular Exclusive Listings In Our Directory
      2.  Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family Roboto.

 

Step 2:  Add the CBDPRO Listing Category Element in the same section

      1. Select your desired categories

______________________________________________________________________________________________________________________________________

 Section 5

cbdpro5

Section Title: Recently Added Dispensaries

Page Builder Element: CBDPRO Listing Posts

For this, we need Heading and CBDPRO Listing Posts Elements

Section Setting

      1. Click on the Advanced tab and set the Margin-Bottom 60px

Step 1: Add Heading Element

      1. Change the text to <h2>Recently Added Dispensaries</h2><br>Popular Exclusive Listings In Our Directory
      2. Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family: Roboto

Step 2:   Add the CBDPRO Listing Posts Element in the same section

      1. Listing to show: 3 Listings
      2. Listing to show: Recent Listings

______________________________________________________________________________________________________________________________________

 Section 6

cbdpro6

Section Title: Most Popular Destinations

Page Builder Element: CBDPRO Listing Locations Element

For this, we need Heading and CBDPRO Listing Locations Elements

Section Setting

      1. Click on the Advanced tab > and set these Margin Bottom 60px

Step 1: Add Heading Element

      1. Change the text to <h2>Most Popular Destinations</h2><br>checkout latest news and articles from our blog
      2. Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family Roboto.

 

Step 2:   Add the CBDPRO Listing Location Element in the same section

      1. Select your desired Locations.
      2. Listing to show: Grid View

 

______________________________________________________________________________________________________________________________________

 Section 7

cbdpro7

Section Title: Testimonials

Page Builder Element: CBDPRO Activities

For this, we need Heading and CBDPRO Activities Elements

Section Setting

      1. Click on the Advanced tab and set the Margin-Bottom 60px

Step 1: Add Heading Element

      1. Change the text to<h2>Testimonials</h2><br> Popular Exclusive Listings In Our Directory<br><br><br>
      2.  Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family Roboto

Step 2:   Add the CBDPRO Activities Element in the same section

      1. Activities to show: 3

______________________________________________________________________________________________________________________________________

 Section 8

cbdpro8

Section Title: See How it Works

Page Builder Element: CBDPRO Columns

For this, we need Heading and CBDPRO Columns Elements

Section Setting

      1. Click on the Advanced tab and set the Margin Bottom 60px

Step 1: Add Heading Element

      1. Change the text to <h2>See How it Works</h2><br> Popular Exclusive Listings In Our Directory
      2. Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set the Font Family Roboto

Step 2:  Add the CBDPRO Columns Element in the same section

      1. Add your column content according to you

 

______________________________________________________________________________________________________________________________________

 Section 9

 
cbdpro9
 

Section Title: Latest CBD NEWS

Page Builder Element: CBDPRO Blog Posts

For this, we need Heading and CBDPRO Blog Posts Elements

Section Setting

      1. Click on the Advanced tab and set the Margin Bottom 60px

Step 1: Heading element

      1. Change the text to <h2>Our Blog & Latest CBD News</h2> Popular Exclusive Listings In Our Directory
      2. Html tag: P
      3. Align: Center
      4. Go to the Style tab and change the text color to #54595F
      5. Click on Typography and set Font Family Roboto.

Step 2:  Add the CBDPRO Blog Posts Element in the same section

      1. Blogs to show: 3

______________________________________________________________________________________________________________________________________

 Section 10

 

cbdpro10
 

Section Title: OUR FAMOUS PARTNERS

Page Builder Element: CBDPRO Partners

For this, we need Heading and CBDPRO Partners Elements

Section Setting:

      1. Click on the Style tab  and set these properties
        • Background: Normal
        • Background Type: Classic
        • Color:#3B7E00

 

Step 1: Add Heading Element

      1. Change the text to OUR FAMOUS PARTNERS
      2.  HTML tag: H3
      3. Align: Center
      4. Go to the Style tab and change the text color to #FFFFFF
      5. Click on Typography and set Font Family Roboto.

Step 2:   Add the CBDPRO Partners Element in the same section

      1. Add your partner’s logo and if you want to add more then click on add new items or click on the copy icon.
      2. Click on the Advanced tab and set the Padding Top 30px

______________________________________________________________________________________________________________________________________

Congratulations!

You have created your CBDPro demo with Elementor successfully

 

 

EventPro Demo for ListingProWP With Elementor

For Elementor Page Builder Users

We are going to make the below sections with different page builder elements.

Section 01

Eventpro1

Section Title: Upcoming Events

Page builder Element: Event Posts Element

For this, we need Event Posts Element

Please go to your WordPress admin dashboard. Edit your desired page with Elementor page builder and create a new section and then follow the below steps

Section setting

  • Create a section and then edit the section
  • Click on the Advanced tab > and set these properties
  • Margin-Top: 85px

Step 1: Add Event Posts Element

 

___________________________________________________________________________________________________________________________________

Section 02

Eventpro2

 

Section Title: Experiences to Explore 

Page builder Element: Event Types Element

For this, we need Event Types Element

Section setting

  • Create a section and then edit the section
  • Click on the Style tab > and set these properties
  • Background: Normal
  • Background Type: Classic
  • Color: #EFF8FF
  • Click on the Advanced tab > and set these properties
  • Padding-Top: 90px

Step 1: Add Event Types Element

______________________________________________________________________________________________________________________________________

Section 03

Eventpro3

 

Section Title: Upcoming Events Calender 

Page builder Element: Events Calendar Element

For this, we need Heading + Text Editor and Events Calendar Element

Step 1: Add Heading Element

  • Change the text to <h2>Upcoming Events Calendar</h2>
  • Align center
  • Go to the Style tab > Change the text color to black
  • Click on Typography and set these properties. 
  • Font Family: Roboto
  • Font weight: 600px

Step 2: Add Text Editor Element

  • Change the text to Checkout all the upcoming events in the list view and map view. For Calendar View Click Here.
  • Go to Style tab > and align it to center text color #7A7A7A
  • Click on Typography and set these properties
  • Font Family: Roboto
  • Font weight: 400px

Step 3: Add Events Calendar  Element

  • Event View: List 
  • Events Per Page: 5

______________________________________________________________________________________________________________________________________

Section 04

eventpro4

Section Title: Top Destination

Page builder Element: Events Calendar Element

For this, we need Events Locations Element

Step 1: Add Events Locations  Element

______________________________________________________________________________________________________________________________________

Section 05

eventpro5

Section Title: Explore Groups 

Page builder Element: Group Posts Element

For this, we need HTML and Group Posts Element

Step 1: Add HTML Element

  • Change the text to <div class=”ep-section-title-container row”><div class=”col-md-12″><h2>Explore Groups </h2><p class=”ep-sub-title col-md-6″>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout</p></div></div>

Step 2: Add Group Posts  Element

  • Events Per Page: 3

______________________________________________________________________________________________________________________________________

Section 06

eventpro6

 

Element Title: Explore the World

Page builder Element: Event Posts Element

For this, we need Event Posts Element

Step 1: Add Event Posts  Element in the new Section

  • Edit the Element and set the below properties.
  • Event post Title: Explore the World
  • Types of Events: All Events

______________________________________________________________________________________________________________________________________

Congratulations! 

You have created your EventPro Home Page Demo with Elementor Successfully

BlackPro Demo for ListingProWP With Elementor

                                               

For Elementor Page Builder Users

We are going to make the below sections with different page builder elements.

Section 01

BlackPro Section 1

Section Title: Top Business Providers​

Page Builder Element: BPRO Listings Post

For this, we need Heading + Text Editor and BPRO Listings Post Element.

Go to your WordPress admin dashboard. Edit your desired page with Elementor page builder and create a new section and then follow the below steps:

Step 1: Add Heading element

  1. Change the text to Top Business Providers and Center align.
  2. Go to the Style tab and change the text color to #241B1B
  3. Click on Typography and set these properties.
      • Font family: Roboto
      • Font Size to 24px
      • Font weight Bold
      • Line height: 40
      • Letter spacing: 1
  1. Go to the Advanced tab and add Margin-Top: 100px

Step 2: Add Text Editor Element for Sub-title.

  1. Change the text to Popular Exclusive Listings In Our Directory
  2. Go to Style tab > and align it to center text color: #7C758D
  3. Click on Typography and set these properties
      • Font Family: Roboto
      • Font Size: 13px
      • Font weight: 400
      • Line Height: 17px
      • Letter Spacing: 1px

Step 3: Add the BPRO Listings Posts element in the same section

  1. Go to the Content tab
      • Select the number of listings to show: 3
      • Select the type of listings to show: Ads listings
  1. Go to the Advanced tab and add Margin-Top: 30px

_______________________________________________________________________________________________________________________

Section 02

BlackPro2

Section Title: Discover Gulf Coast Black Businesses

Page builder Element: BPRO Listings Category

For this, we need Heading + Text Editor and BPRO Listings Category Elements:

Section settings

  1. Create a section and then edit the section
  2. Click on the Style tab > and set these properties
    • Background: Normal
    • Background Type: Classic
    • Color: #DB69DF10

Step 1: Add Heading element

  1. Change the text to Discover Gulf Coast Black Businesses
  2. Align center
  3. Go to Style tab > Change the text color to #241B1B
  4. Click on typography and set these properties:
    • Font family: Roboto
    • Font Size to 24px
    • Font weight Bold
    • Line height: 40
    • Letter spacing: 1
  5. Go to Advanced tab > and set these properties
    • Margin Top: 70px
    • Margin Bottom: -10px

Step 2: Add Text Editor Element for Sub-title.

Change the text to Successful Black Owned Businesses exist up and down our great gulf coast. Check out a few in a city near you!

  1. Go to Style tab > and align it to center text color: #7C758D
  2. Click on Typography and set these properties:
    • Font Family: Roboto
    • Font Size: 13px
    • Font weight: 400
    • Line Height: 17px
    • Letter Spacing: 1px

Step 3: Add the BPRO Listings Category element in the same section

  1. Go to the Content tab and add your desired categories
  2. Go to Advanced and select the below properties:
      • Margin-Top: -30px
      • Margin Bottom: -30px

__________________________________________________________________________________________________________________________

 

Section 03

Section Title: WHY TO CHOOSE US

Page Builder Element: BPRO Columns

 

For this, we need Heading + Text Editor and BPRO Columns Elements

Section setting

  1. Create a section and then edit the section
  2. Click on the Style tab and set these properties:
      • Background: Normal
      • Background Type: Classic
      • Color: #DFBA6910

Step 1: Add Heading element

  1. Change the text to WHY TO CHOOSE US and Center Align
  2. Go to the Style tab and change the text color to #241B1B
  3. Click on typography and set these properties.
      • Font family: Roboto
      • Font Size to 24px
      • Font weight Bold
      • Transform: Uppercase
      • Line height: 40
      • Letter spacing: 1px
  1. Go to the Advanced tab:
      • Margin top: 70px
      • Margin-Bottom: -10px

Step 2: Add Text Editor Element for Sub-title.

Change the text to Checkout the latest news and articles from our blog

  1. Go to Style tab > and align it to center text color: #7C758D
  2. Click on Typography and set these properties
      • Font Family: Roboto
      • Font Size: 13px
      • Font weight: 400
      • Line Height: 17px
      • Letter Spacing: 1px

Step 3: Add the BPRO Columns element in the same section

Go to Advanced > Select the below properties

      • Margin-Top: -60px
      • Margin-Bottom: -20px

__________________________________________________________________________________________________________________________

Section 04

blackpro4

Section Title: LATEST NEWS ARTICLES

Page Builder Element: BPRO Blog Posts

For this, we need Heading and BPRO Blog Posts Elements

Step 1: Add Heading element

  1. Change the text to Latest News Articles
  2. Align center
  3. Go to Style tab > Change the text color to #241B1B
  4. Click on typography and set these properties.
    • Font family: Roboto
    • Font Size to 24px
    • Font weight Bold
    • Transform: Uppercase
    • Line height: 40px
    • Letter spacing: 1px
  5. Go to the Advanced tab and add Margin-Top: 70px

Step 3: Add the BPRO Blog Posts element in the same section

Go to Advanced  and add Margin-Top: 15px

__________________________________________________________________________________________________________________________

Section 05

blackpro5

Section Title: Our Famous Partners

Page Builder Element: BPRO Partners

For this, we need Heading and BPRO Partners Elements

Section setting

  1. Create a section and then edit the section
  2. Content width: Full width.
  3. Click on the Style tab and set these properties:
    • Background: Normal
    • Background Type: Classic
    • Color: #DFBA69
    • Go to the Advanced tab and add Margin-Top: 60px

Step 1: Heading element

  1. Change the text to Our Famous Partners
  2. Align center
  3. Go to Style tab > Change the text color to #FFFFFF
  4. Click on typography and set these properties.
    • Font family: Roboto
    • Font Size to 22px
    • Font weight: Bold
    • Transform: Uppercase
    • Line height: 29
    • Letter spacing: 1
  5. Go to the Advanced tab and add Margin-Top: 35px

Step 2: Add BPRO Partners Element

  1. Add your Partners logo
  2. Copy the repeated field and add your logos
  3. Also, you can add dummy logos from your media.
  4. Go to the Advanced tab and set the below properties
    • Margin-Top: -13px
    • Margin-Bottom: -30px

 __________________________________________________________________________________________________________________________

Congratulations!

 

You have created your BlackPro demo home page with Elementor successfully!