Ronby

6 Niche Multi-Purpose HTML5 Bootstrap 3 Template

Thank you very much for purchasing our theme!

If you have any issue or question that this document does not cover, feel free to contact us here.. Thank you.

About

It is creative and clean HTML Template. We have tried our best to cover all possible pages. HTML files are well organized. The design is very elegant and modern, and also very easy customizable. It is pixel perfect, made with Bootstrap Grid. Also we offer dedicated 24/7 Free support for our valuable customers. Feel free to get support as we love to help our clients.

It is creative and clean HTML Template. We have tried our best to cover all possible pages. HTML files are well organized. The design is very elegant and modern, and also very easy customizable. It is pixel perfect, made with Bootstrap Grid. Also we offer dedicated 24/7 Free support for our valuable customers. Feel free to get support as we love to help our clients.

HTML Structure

This theme is a Responsive layout with four columns. The general template structure is the same throughout the template. Here is the general structure.


	

		

			.....
			.....
			.....

CSS files and structure

I have used Ten CSS files in this theme.

  1. style.css - Contains all of the specific stylings for the page.
  2. bootstrap.css - Bootstrap css.
  3. font-awesome.min.css - Fontawesome Icons.
  4. owl.carousel.css - Contains all of the specific stylings for Owl Carousel
  5. owl.theme.css - Contains all of the specific stylings for Owl Carousel
  6. owl.transitions.css - Contains all of the specific stylings for Owl Carousel
  7. bootstrap-datetimepicker.css - Contains all of the specific stylings for Datepicker
  8. responsive-styling.css - Contains all of the specific stylings for responsive styling
  9. layerslider.css - Contains all of the specific stylings for Layerslider Plugin
  10. isotope.css - Contains all of the specific stylings for Isotope plugin
Style.css file contains all of the specific stylings for the page. The file is separated into sections using: 
    /*-----------------------------------------------------------------------------------*/  
    /* GLOBAL STYLES  
    /*-----------------------------------------------------------------------------------*/  
    css codes  
      
    /*-----------------------------------------------------------------------------------*/
    /* HEADER WRAP
    /*-----------------------------------------------------------------------------------*/
     css codes  
          
    /*-----------------------------------------------------------------------------------*/
    /* SLIDER WRAP
    /*-----------------------------------------------------------------------------------*/ 
    css codes  
          
    /*-----------------------------------------------------------------------------------*/
    /* SERVICES WRAP
    /*-----------------------------------------------------------------------------------*/ 
    css codes  
      
    /*-----------------------------------------------------------------------------------*/
    /* INDEX - PORTFOLIO STYLES
    /*-----------------------------------------------------------------------------------*/ 
    css codes  
      
    /*-----------------------------------------------------------------------------------*/
    /* RECENT BLOG POST STYLES
    /*-----------------------------------------------------------------------------------*/
    css codes  
      
    /*-----------------------------------------------------------------------------------*/
    /* TESTIMONIAL STYLES
    /*-----------------------------------------------------------------------------------*/ 
    css codes  
      
    /*-----------------------------------------------------------------------------------*/  
    /* ABOUT CONTENT STYLES  
    /*-----------------------------------------------------------------------------------*/  
    css codes  
      
    /*-----------------------------------------------------------------------------------*/  
    /* BLOG CONTENT STYLES  
    /*-----------------------------------------------------------------------------------*/  
    css codes  
      
    /*-----------------------------------------------------------------------------------*/  
    /* CONTACT FORM CONTENT STYLES  
    /*-----------------------------------------------------------------------------------*/  
    css codes  
      
    /*-----------------------------------------------------------------------------------*/  
    /* FOOTER CONTENT STYLES  
    /*-----------------------------------------------------------------------------------*/  
    css codes  

and much more
If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited. Dont change anything in foundation.css file. It may affect the whole theme.

Javascript

This theme imports Fifteen Javascript files.

  1. jquery.js - To Enable jQuery.
  2. bootstrap.js - Plugin for Bootstrap framework.
  3. html5shiv.js - Enable HTML5.
  4. layerslider.kreaturamedia.jquery.js - Layer slider plugin.
  5. layerslider.transitions.js - Layer slider plugin.
  6. greensock.js - Layer slider plugin.
  7. bootstrap-datetimepicker.js - Datepicker plugin.
  8. jquery.isotope.min.js - Isotope Plugin.
  9. stellar.js - Parallax plugin.
  10. owl.carousel.js - Owl Carousel plugin.
  11. waypoints.js - Waypoints plugin.
  12. waypoints-sticky.js - Waypoints plugin.
  13. respond.js - IE mediaqueries plugin.
  14. stellar.js - Parallax plugin.
  15. custom-scripts.js - Theme custom plugin.

Tutorial

Lets start updating the template. Open index.html file and follow the steps.

Most of the updates are same for all versions. So will explain once here.

Header - Logo
  1. Replace "assets/img/logo/logo.png" with the your logo url or source.

Top Slider.

  1. Check this Link for Layerslider documentation.

Navmenu

This is the basic structure.
  1. Replace "Menu title" with the menu name and url .
  2. Replace "#home" with your content id to scroll to.
  3. Same for all. You can add unmited menus.

About content

About - Content

							

								icon
								

									
Health Information

									
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incidid
  1. replace "assets/img/icons/icon-1.png" with you icon image source or url
  2. replace the text between "<h5>" "</h5>" with the service title.
  3. replace the text between "<p>" "</p>" with the service description.
  4. Same for all service section.

Job section

				

					

						
are you looking for job?

						
Lorem ipsum dolor sit amet

						
Lorem ipsum dolor sit amet, consectetur adi pisicing elit, sed do eiusmod tempor incidid. Sed ut perspiciatis unde omnis iste natus error sit voluptatem. Lorem ipsum dolor sit amet, consectetur adi pisicing elit, sed do eiusmod tempor incidid. 

					

				

				

					Apply for a job
  1. replace the text between "<h3>" "</h3>" with the job section title.
  2. replace the text between "<h5>" "</h5>" with the job section subtitle.
  3. replace the text between "<p>" "</p>" with the job section description.
  4. replace "Apply for a job" with the button title.

Team Content

					

						

							
								

									
								

							
							

								
clinic Manager

								
Frank Rooney

								
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 

								

									
Social Profiles
This is the basic structure. Same as for all.
  1. replace "assets/img/team/team-member1.jpg" with the staff profile image.
  2. replace the text between "<h6>" "</h6>" with the staff profession.
  3. replace the text between "<h4>" "</h4>" with the staff name.
  4. replace the social icons as per the social name.
  5. same for all.

Portfolio Wrap

					
  • 
						
						
    
							
    
								
    Clinic office Durning work
    
								30 comments
								View more
							
    
						
    
					
    •
    1. replace "assets/img/projects/1.jpg" with the portfolio image.
    2. replace the text between "<h4>" "</h4>" with the Project title.
    3. replace "#" with the link and "View more" with the link button name.
    4. same for all.

    Portfolio

    					
    
						
    
							
    
								
								
							
    
							
    
								
									
    This is a Standard post format with preview picture
    
								    
								
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incidid
    1. replace "assets/img/blog/post-img1.jpg" with the blog thumb.
    2. replace "assets/img/blog/post-icon.png" with the blog post icon source or url.
    3. replace the text between "<h5>" "</h5>" with the blog title.
    4. replace the text between "<p>" "</p>" with the blog description.
    5. replace "icon-user" with your icon name. To replace, check this link
    6. same for all.

    Twitter Section
    1. Replace "96635299" with your vimeo video ID.



    Footer

    	
    
		
    
			
    
				
    Copyright 2018. Ronby. All Rights Reserved.
    
			
    
			
    
				
      
					
      • 
					
      • 
					
      • 
					
      • 
					
      •
    1. replace "Copyright 2018. Ronby. All Rights Reserved." with the copyright info.
    2. replace the social links as per the name.


    Thats it. You are done. Now your website is ready to launch.




    PSD files

    PSD files are not added with this template. You can get it here

    Sources and Credits

    We have used the following plugins, fonts & images. All fonts, images, icons used in this template are free for commercial use.

    Fonts
    jQuery Plugins
    Images Images in live preview are not included to the template.





    Once again, thank you so much for purchasing this theme.
    As I said at the beginning, We'd be glad to help you if you have any questions relating to this theme. We I'll do our best to assist.

    Thanks

    Themesquared