1. Start
  2. Files & Directories
  3. Structure
  4. HTML Structure
  5. CSS Structure
  6. Skins
  7. Contact Us
  8. Shortcode
  9. Credits

Ori – Multi-purpose Business HTML Template

Thank you for purchasing my template. If you have any questions that are beyond the scope of this help file, please feel free to use my contact here. Thanks so much!

Files & Directories


Includes bootstrap and fontello files and font-awesome files and you will find 110 files
  1. index.html (The 1 homepage example)
  2. index-2.html (The 2 homepage example)
  3. index-3.html (The 3 homepage example)
  4. index-4.html (The 4 homepage example)
  5. index-5.html (The 5 homepage example)
  6. index-6.html (The 6 homepage example)
  7. index-7.html (The 7 homepage example)
  8. index-animate.html (The index animate page)
  9. index-one-page.html (The index one page page)
  10. fixed-nav.html (The fixed nav page)
  11. index-boxed.html (The homepage boxed example)
  12. index-boxed-2.html (The homepage boxed 2 example)
  13. index-blue.html (The homepage blue example)
  14. index-brown.html (The homepage brown example)
  15. index-cyan.html (The homepage cyan example)
  16. index-purple.html (The homepage purple example)
  17. index-red.html (The homepage red example)
  18. index-green.html (The homepage green example)
  19. index-greensea.html (The homepage greensea example)
  20. index-lightgreen.html (The homepage lightgreen example)
  21. index-pink.html (The homepage pink example)
  22. index-yellow.html (The homepage yellow example)
  23. features.html (The Features page)
  24. header-2.html (The header 2 page)
  25. header-3.html (The header 3 page)
  26. header-4.html (The header 4 page)
  27. header-5.html (The header 5 page)
  28. header-6.html (The header 6 page)
  29. about.html (The about 1 page)
  30. about-2.html (The about 2 page)
  31. about-3.html (The about 3 page)
  32. testimonials.html (The testimonials page)
  33. faq.html (The faq page)
  34. faq-left-sidebar.html (The faq left sidebar page)
  35. faq-centered.html (The faq centered page)
  36. team.html (The team page)
  37. team-left-sidebar.html (The team left sidebar page)
  38. team-right-sidebar.html (The team right sidebar page)
  39. pricing-tables.html (The pricing tables page)
  40. typography.html (The typography page)
  41. right-sidebar.html (The right sidebar page)
  42. left-sidebar.html (The left sidebar page)
  43. full-width.html (The full width page)
  44. page-centered.html (The page centered page)
  45. animation.html (The animation page)
  46. 404.html (The 404 page)
  47. coming-soon.html (The coming soon page)
  48. services.html (The services page)
  49. services-2.html (The services 2 page)
  50. services-3.html (The services 3 page)
  51. portfolio-description.html (The portfolio description page)
  52. portfolio-description-left-sidebar.html (The portfolio description left sidebar page)
  53. portfolio-description-full-width.html (The portfolio description full width page)
  54. portfolio-gallery.html (The portfolio gallery page)
  55. portfolio-gallery-left-sidebar.html (The portfolio gallery left sidebar page)
  56. portfolio-gallery-full-width.html (The portfolio gallery full width page)
  57. portfolio-4-columns-no-margin.html (The portfolio 4 columns no margin page)
  58. portfolio-4-columns-no-margin-full-width.html (The portfolio 4 columns no margin full width page)
  59. portfolio-4-columns-no-margin-left-sidebar.html (The portfolio 4 columns no margin left sidebar page)
  60. portfolio-3-columns-full-width.html (The portfolio 3 columns full width page)
  61. portfolio-3-columns.html (The portfolio 3 columns page)
  62. portfolio-3-left-sidebar.html (The portfolio 3 left sidebar page)
  63. portfolio-gallery-3-columns.html (The portfolio gallery 3 columns page)
  64. portfolio-gallery-full-width-3-columns.html (The portfolio gallery full width 3 columns page)
  65. portfolio-gallery-left-sidebar-3-columns.html (The portfolio gallery left sidebar 3 columns page)
  66. portfolio-3-columns-no-margin.html (The portfolio 3 columns no margin page)
  67. portfolio-3-columns-no-margin-full-width.html (The portfolio 3 columns no margin full width page)
  68. portfolio-3-columns-no-margin-left-sidebar.html (The portfolio 3 columns no margin left sidebar page)
  69. portfolio-2-columns.html (The portfolio 2 columns page)
  70. portfolio-2-columns-full-width.html (The portfolio 2 columns full width page)
  71. portfolio-2-left-sidebar.html (The portfolio 2 left sidebar page)
  72. portfolio-gallery-2-columns.html (The portfolio gallery 2 columns page)
  73. portfolio-gallery-full-width-2-columns.html (The portfolio gallery full width 2 columns page)
  74. portfolio-gallery-left-sidebar-2-columns.html (The portfolio gallery left sidebar 2 columns page)
  75. portfolio-2-columns-no-margin.html (The portfolio 2 columns no margin page)
  76. portfolio-2-columns-no-margin-full-width.html (The portfolio 2 columns no margin full width page)
  77. portfolio-2-columns-no-margin-left-sidebar.html (The portfolio 2 columns no margin left sidebar page)
  78. portfolio-3.html (The portfolio 3 page)
  79. portfolio-3-5-columns.html (The portfolio 3 5 columns page)
  80. carousel-portfolio-4-columns.html (The carousel portfolio 4 columns page)
  81. carousel-portfolio-4-columns-left-sidebar.html (The carousel portfolio 4 columns left sidebar page)
  82. carousel-portfolio-4-columns-full-width.html (The carousel portfolio 4 columns full width page)
  83. carousel-portfolio-3-columns.html (The carousel portfolio 3 columns page)
  84. carousel-portfolio-3-columns-left-sidebar.html (The carousel portfolio 3 columns left sidebar page)
  85. carousel-portfolio-3-columns-full-width.html (The carousel portfolio 3 columns full width page)
  86. carousel-portfolio-2-columns.html (The carousel portfolio 2 columns page)
  87. carousel-portfolio-2-columns-left-sidebar.html (The carousel portfolio 2 columns left sidebar page)
  88. carousel-portfolio-2-columns-full-width.html (The carousel portfolio 2 columns full width page)
  89. single-portfolio.html (The single portfolio page)
  90. single-portfolio-2.html (The single portfolio 2 page)
  91. single-portfolio-3.html (The single portfolio 3 page)
  92. single-portfolio-right-sidebar.html (The single portfolio right sidebar page)
  93. single-portfolio-left-sidebar.html (The single portfolio left sidebar page)
  94. blog.html (The blog page)
  95. blog-1-left-sidebar.html (The blog 1 left sidebar page)
  96. blog-1-full-width.html (The blog 1 full width page)
  97. blog-2.html (The blog 2 page)
  98. blog-2-left-sidebar.html (The blog 2 left sidebar page)
  99. blog-2-full-width.html (The blog 2 full width page)
  100. single-blog.html (The single blog page)
  101. single-blog-left-sidebar.html (The single blog left sidebar page)
  102. single-blog-full-width.html (The single blog full width page)
  103. shortcodes.html (The shortcodes page)
  104. contact.html (The contact 1 page)
  105. contact-2.html (The contact 2 page)
  106. contact-3.html (The contact 3 page)
  107. contact-4.html (The contact 4 page)
  108. contact-5.html (The contact 5 page)
  109. style.css (Main style css)
  110. contact_us.php (The php file contact us)

Structure


Ori Template is well commented to easily understand, everypage has
  1. <head> area which contains the meta tags and css files
  2. <body> area which contains the site and divided into
  3. <header> with id "header" and includes menu, logo area
  4. <footer> with id "footer" includes all footer content .

HTML Structure


  1. To set the boxed page add in #wrap class boxed
  2. To set the boxed 2 page add in #wrap class boxed-2
  3. To set the fixed nav page add in #wrap class fixed-enabled

CSS Structure


  1. style.css this the main style
  2. css/base.css
  3. css/bootstrap.min.css
  4. css/lists.css
  5. css/prettyPhoto.css
  6. css/responsive.css
  7. css/animate-custom.css
  8. css/dark.css
  9. css/font-awesome/css/font-awesome.min.css
  10. css/fontello/css/fontello.css
  11. css/skins/skins.css
  12. css/skins/blue.css
  13. css/skins/green.css
  14. css/skins/purple.css
  15. css/skins/red.css
  16. css/skins/pink.css
  17. css/skins/greensea.css
  18. css/skins/yellow.css
  19. css/skins/cyan.css
  20. css/skins/brown.css
  21. css/skins/lightgreen.css

Skins


<link rel="stylesheet" href="css/skins/skins.css">
replace skins.css to your favourite color
  1. skins ( default )
  2. blue
  3. green
  4. purple
  5. red
  6. pink
  7. greensea
  8. yellow
  9. cyan
  10. brown
  11. lightgreen

Contact Us


Setup contact form
  1. Open the contact_us.php file
  2. // edit this only :)
    $your_email = "youremail@gmail.com";
    $your_name = "vbegy";

Shortcode


Shortcode

Credits


  1. Bootstrap - Copyright 2013 Twitter
  2. font-awesome - Copyright font awesome
  3. fontello - Copyright fontello
  4. jquery.min.js - jQuery function.
  5. html5.js
  6. jquery.bxslider.min.js - jQuery bxslider.
  7. jquery.inview.min.js - jQuery inview.
  8. jquery.prettyPhoto.js - jQuery prettyPhoto.
  9. jquery.isotope.min.js - jQuery isotope.
  10. count-to.js - jQuery count to.
  11. jquery.appear.js - jQuery appear.
  12. jquery.nicescroll.min.js - jQuery nicescroll.
  13. jquery.nav.js
  14. jquery.scrollTo.js
  15. Revolution - Revolution slider