Steps for setup  preloader on divi websiteNote : Compatible with 4.0+

Steps for setup Link Hover & Box Hover Effect & Pricing Table & Progress Bar

1. Download Link Hover & Box Hover Effect & Pricing Table & Progress Bar Part10.zip File.

2. Unzip file.

3. Import “Link Hove Effects Style 13.json”,”Box Hover Effect 19.json” , “Box Hover Effect 20.json”, “Pricing Table Style19.json” , “Pricing Table Style20.json”,”Progress Bar Style19.json”and “Progress Bar Style20.json” file on Divi -> Divi Library -> Import & Export Button

4. After import both layout you can see in below

5. Add New Page and Click on “Add From Library”

6.Select One of layout

7. After select layout

8. Add “part10.css” file on your child theme and Enqueue your style using wordpress function wp_enqueue_style

OR

Copy CSS from file and PASTE on Theme Option -> General -> Custom CSS

9. Publish Page and see on front end.

Box Hover Effect 19

Box Hover Effect 20

Pricing Table Effect 19

Pricing Table Effect 20

Progress Bar Effect 19

Progress Bar Effect 20

Link Hover

9. Edit Content on Text Module

Steps for setup Link Hover & Box Hover Effect & Pricing Table & Progress Bar

1. Download Link Hover & Box Hover Effect & Pricing Table & Progress Bar Part9.zip File.

2. Unzip file.

3. Import “Link Hove Effects Style 9.json”, “Link Hove Effects Style 10.json”, “Link Hove Effects Style 11.json”, “Link Hove Effects Style 12.json”,”Box Hover Effect 17.json” , “Box Hover Effect 18.json”, “Pricing Table Style17.json” , “Pricing Table Style18.json”,”Progress Bar Style17.json”and “Progress Bar Style18.json” file on Divi -> Divi Library -> Import & Export Button

4. After import both layout you can see in below

5. Add New Page and Click on “Add From Library”

6.Select One of layout

7. After select layout

8. Add “part9.css” file on your child theme and Enqueue your style using wordpress function wp_enqueue_style

OR

Copy CSS from file and PASTE on Theme Option -> General -> Custom CSS

9. Publish Page and see on front end.

Box Hover Effect 17

Box Hover Effect 18

Pricing Table Effect 17

Pricing Table Effect 18

Progress Bar Effect 17

Progress Bar Effect 18

Link Hover

9. Edit Content on Text Module

Steps for setup Link Hover & Box Hover Effect & Pricing Table & Progress Bar

1. Download Link Hover & Box Hover Effect & Pricing Table & Progress Bar Part8.zip File.

2. Unzip file.

3. Import “Link Hove Effects Style 6.json”, “Link Hove Effects Style 7.json”,”Box Hover Effect 15.json” , “Box Hover Effect 16.json”, “Pricing Table Style15.json” , “Pricing Table Style16.json”,”Progress Bar Style15.json”and “Progress Bar Style16.json” file on Divi -> Divi Library -> Import & Export Button

4. After import both layout you can see in below

5. Add New Page and Click on “Add From Library”

6.Select One of layout

7. After select layout

8. Add “part8.css” file on your child theme and Enqueue your style using wordpress function wp_enqueue_style

OR

Copy CSS from file and PASTE on Theme Option -> General -> Custom CSS

9. Publish Page and see on front end.

Box Hover Effect 15

Box Hover Effect 16

Pricing Table Effect 15

Pricing Table Effect 16

Progress Bar Effect 15

Progress Bar Effect 16

Link Hover

9. Edit Content on Text Module

Steps for setup Link Hover & Box Hover Effect & Pricing Table & Progress Bar & Counter Style

1. Download Link-Hover-Box-Hover-Effect-Pricing-Table-Progress-Bar-Counter-Style-Part7.zip File.

2. Unzip file.

3. Import “Link Hove Effects Style 5.json”, “Link Hove Effects Style 6.json”, “Counter style1.json”, “Counter style1.json” ,”Box Hover Effect 13.json” , “Box Hover Effect 14.json”, “Pricing Table Style13.json” , “Pricing Table Style14.json”,”Progress Bar Style13.json”and “Progress Bar Style14.json” file on Divi -> Divi Library -> Import & Export Button

4. After import both layout you can see in below

5. Add New Page and Click on “Add From Library”

6.Select One of layout

7. After select layout

8. Add “part7.css” file on your child theme and Enqueue your style using wordpress function wp_enqueue_style

OR

Copy CSS from file and PASTE on Theme Option -> General -> Custom CSS

9. Publish Page and see on front end.

Box Hover Effect 13

Box Hover Effect 14

Pricing Table Effect 13

Pricing Table Effect 14

Progress Bar Effect 13

Progress Bar Effect 14

Counter Style1

Counter Style2

Link Hover

9. Edit Content on Text Module

Steps for setup Box Hover Effect & Pricing Table & Progress Bar

1. Download Box Hover Effect & Pricing Table & Progress Bar Part6.zip File.

2. Unzip file.

3. Import Box Hover Effect 11.json” , “Box Hover Effect 12.json”, “Pricing Table Style11.json” , “Pricing Table Style12.json””Progress Bar Style11.json”and “Progress Bar Style12.json” file on Divi -> Divi Library -> Import & Export Button

4. After import both layout you can see in below

5. Add New Page and Click on “Add From Library”

6.Select One of layout

7. After select layout

8. Add “part6.css” file on your child theme and Enqueue your style using wordpress function wp_enqueue_style

OR

Copy CSS from file and PASTE on Theme Option -> General -> Custom CSS

9. Publish Page and see on front end.

Box Hover Effect 11

Box Hover Effect 12

Pricing Table Effect 11

Pricing Table Effect 12

Progress Bar Effect 11

Progress Bar Effect 12

9. Edit Content on Text Module