# Ronby

## 6 Niche Multi-Purpose HTML5 Bootstrap 3 Template

- Created: 30/11/2018
- By: Themesquared

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

#####

    									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

- Raleway from google webfont.
- Open Sans from google webfont.

jQuery Plugins

- Isotope plugin by metafizzy
- Owlscroll carousel plugin by owlgraphic

Images

- Images used from Source name

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