help file of paidjoo bus...st builder landing page

8/9/2019 Help File of Paidjoo Bus...St Builder Landing Page

1/13

Works of Wisnu

Start

HTML structure

CSS FIles and Structure

Elements

Javascript

PHP File

PSD File

Sources and Credits

1. Paidjoo Business and ListBuilder Landing PageResponsive business and list builder landing page built with Bootstrap

Paidjoo Business andList Builder LandingPageResponsive business and list builder landing page built with

Bootstrap by Works of Wisnu.


2/13


3/13

24.

25.

26.

27.

28.

29.

30.

31. Your Tagline Goes Here

32.

33.

34.

35. Lorem ipsum dolor sit amet... .

36. John Doe, United Kingdom

37.

38. ...

39. ...40.

41.

42. ...

43. ..

44.

45.

3. CSS FIles and Structure

There are some CSS Files used in this theme. And here are the short explanations about them :

bootstrap.css - The Twitter Bootstrap Framework, do not edit this file.

bootstrap-responsive.css - The Twitter Bootstrap Framework for Responsive layout, do not edit

this file.

style.css - This is the main CSS file that controls almost everything on the Green Loan layout

style2.css - This is the main CSS for Blue List layout

style-flat1.css - This is the main CSS for Flat Green Loan layout

style-flat2.css - This is the main CSS for Flat Blue List layout

style-responsive.css - The resposive style for all layouts above

flexslider.css - The style for jQuery Flexslider plugin Please note that this theme has a bit

custom flexslider style on the header of each layout

prettyPhoto.css - The style for jQuery Pretty Photo lightbox plugin

animate.min.css - The style for making some effects on Head Banner and Slider

Here is the presets of the Green Loan layout (style.css):


4/13

1. /************************************************************************

**********

2.

3. Project Name: Green Skeuomorph Style for Paidjoo Landing Page

4. Project Description: Paidjoo is a business, corporate landing pag

e, and subscribe list page

5. Author: xWisnux (Works of Wisnu)

6. Author URI: http://www.worksofwisnu.com

7. Version: 1.0.0

8.

9. *************************************************************************

*********/

10. @font-face, Icon Fonts style

11.

12. /* General */

13.

14. body, list, paragraph, headings, link, section, .centered, .uppercase, .rollover

15.

16. /* Gradient BG */

17. .green-gradient, .blue-gradient

18.

19. /* Buttons */

20. /btn, .btn-small, .btn-yellow

21.

22. /* Social Buttons */

23. .social, .social li, .social li a

24.

25. /* Alerts */

26. .alert .alert-icon, .alert-success, .alert-info, .alert-error, .form-erro

r-message

27.

28. /* #Top Header Section */

29.

30. top-header, .head-social, .head-email

31.

32. /* #Head Content Section */

33. head-content, .chat-box, .login-box

34.

35. /* #Head Banner Section */

36. head-banner, .tagline, .sub-tagline, .testi, .author, .video-button, .hea

dbanner-form, .form-spacer, .headbanner-form input, .headbanner-form labe

l, .headbanner-form select, .small-form-text, .layout-slider

37.

38. /* #Marketing Section */39. marketing, marketing .title, .marketing-content, .marketing-icon

40.


5/13

41. /* #Featurettes Section */

42. featurettes, .dark-section, .dark-section .title, .dark-section h3, .dar

k-section span*, .dark-subtitle, .checklist, .green-list, .blue-list

43.

44. /* #Lower Content Section */

45. lower-content, lower-content .title, lower-content h3, .subtitle, .toggl

e-content, .toggle-group, .toggle-heading .toggle-button, .toggle-faq, .t

oggle-inner, .map, .contact-info p, .contact-info li, .green-contact-info-icon, .blue-contact-info-icon, .flexslider-content-testimonial, .flexsl

ider-content-testimonial ul.testimonials-list li

46.

47. /* #Breakline Section */

48. breakline, breakline h3, .counter, .clients

49.

50. /* #Footer Section */

51. footer, .copyright, .footer-subscribe, .footer-subscribe input, .footer-s

ubscribe-text, .toTop52.

4. ElementsBelow are some example codes to make the elements used in this template:

4.1. Head Banner Testimonial Slider

1.

2.

3.

4. Lorem ipsum dolor sit amet... .

5. John Doe, United Kingdom

6.

7.

8. ...

9. ...

10.

11.

12.


6/13

4.2. Dark Section Featurettes Slider

1.

2.

3.

4.

5.

6.

7.

8.

9.

10.

11.

12. Some Feature Here?13. some description about your special se

rvice here

14. Lorem ipsum dolor sit amet...

.

15.

16.

17. ...

18. ...

19.

20.

21.

4.3. Lower Content Testimonial Slider

1.

2.

3.

4.

5.

Lorem ipsum dolor sit amet... .

6. John Doe / Some Profession

7.

8. ...

9. ...

10.


7/13

11.

4.4 Toggle FAQ

1.

2.

3.

4.

5. QMaecenas faucibus mollis interdum?

6.

7.

8.

Cras mattis consectetur purus sit amet fermentum. Sed posuere co

nsectetur est at lobortis. Donec ullamcorper nulla non metus auctor fring

illa. Nulla vitae elit libero, a pharetra augue.

9.

10.

11.

12.

13.

14. QDuis mollis, est non commodo luctus, nisi erat porttitor ligula?15.

16.

17.

Maecenas sed diam eget risus varius blandit sit amet non magna.

Curabitur blandit tempus porttitor. Nulla vitae elit libero, a pharetra a

ugue. Cum sociis natoque penatibus et magnis dis parturient montes, nasce

tur ridiculus mus.

18.

19.

20. ...21. ...

22.

If you want to apply the toggle without "Q" marks, simply remove the span .toggle-faq .

4.5. Clients Counter on Breakline


8/13

1.

2.

3. 1

4.

5.

6. 2

7.

8.

9. 3

10.

11.

12. 4

13.

14.

15. 5

16.

17.

5. Javascript

This theme uses several scripts many of which are documented within the theme's code. If you're a

developer, you will find this particularly useful.

jQuery

bootstrap.min.js - Minified version of Bootstrap jQuery plugins

Gmap3 - jQuery Google Map

jQuery EasingFlexslider

prettyPhoto, and

jQuery Input Slider (jSlider)

All those jQuery plugins controled under paidjoo.js, except the classie.js(take a look at the javascript

code before the closing of body tags).

6. PHP File


9/13

There are 3 PHP files included in this theme, they are subscribe.php, and footer-subscribe.php

Subscribe

subscribe.php used in List template layout(Blue) on the head banner form and will make a list of

subscriber data such as name, email, and telephone into a text file called subscriber-data.txt, this file

will placed in your server folder. Below is the example code to make a subscribe form :

1.

2.

3.

4.

5.

6.

7.

8. 9.

10.

11.

12.

13.

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26. ... The Alerts here ...

27.

28.

29.

30.

31.

32.

33.

34. 35.

36.


10/13

37. By clicking the buttons above, you certify tha

t you have read & agreed to our Privacy Policy and Terms. See Rates & Fee

s.

38.

39.

40.

Footer Subscribe

footer-subscribe.php used in Loan template layout(Green) on the footer subscribe form and will make

a list of subscriber email address only into a text file called list.txt, this file will also placed in your

server folder. Below is the example code to make a footer subscribe form :

1.

2.

3.

4.

5.

6.

7.

8.

9.

10.

11.

12. ... The Alerts here ...

13.

14.

15.

16.

17. * Don't worry to subscribe. We hate spam

too!

18.19.

All the forms above will only works with some javascript, and you can

find the javascript on the paidjoo.js file inside the js folder. This

javasript works for the validation of the forms and the execution of the

php files. Note, Why I didn't made the PHP file for loan form is

because I only provide the place-holder as every loan/lender site has


11/13

it own "logic"

Contact

contact.php used in contact.html file(Contact Page). Below is the example code to make a contact

form :

1.

2.

3.

4.

5. .. The alerts here ..

6.

7.

8.9.

10.

11.

12.

13.

14.

15.

16.

17.

18.

19.

20.

21.

22.

23.

24.

25.

26.

27.

28.

29.

30.

31.

32.33.

34.


12/13

t" value="Submit">

35.

36.

37.

38.

39.

7. PSD File

I've included 2 psd files with this theme. The PSD files are well

documented on the groups and layered

8. Sources and Credits

I've used the following images, icons or other files as listed.

Animate CSS

Soft Media Icons vol.1 and 2

Linecons

Icon Fonts and Some Icons (Entypo)

Atmosphere Apps background

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to

help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist.

If you have a more general question relating to the themes on Themeforest, you might consider

visiting the forums and asking your question in the "Item Discussion" section.

Fitryan Wisnu Pratama


13/13

help file of paidjoo bus...st builder landing page

Documents