HTML Structure - top
Hostinza - Isometric Web Hosting and Domain Html Template is built with the Bootstrap 4 framework - that means you have access to all the great features, css & js goodies has to offer. Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases.
To learn more about Bootstrap's grid system, please refer to Bootstrap 4 Grid
CSS Structure - top
I'm using one main CSS file (assets/css/styles.css) and sass file available on (assets/sass), in this template which you are free to modify depending on the customization you require. There are also other additional style sheets that I do not recommend changing. Those style sheets reside in the 'css' folder and 'sass' file on 'sass' folder.
- https://fonts.google.com/ - Web font Cabin from Google Fonts
- bootstrap.min.css - This is a main stylesheet that required for basic template styling like form, input, div, list element and etc.
- font-awesome.min.css - Web font containing all the icons from the Bootstrap framework and more.
- styles.css - The main stylesheet you are encouraged to modify.
The Styles CSS file contains all of the specific stylings for the page. The file is separated into sections using:
1. predefine 2. nav 3. banner 4. modal 5. modal search 6. modal flag 7. offset sidebar 8. offset cart 9. offset info bar 10. domain search 11. why choose us 12. pricing 13. service 14. call to action 15. feature 16. clients 17. hosting information 18. testimonial 19. blog 20. footer 21. pricing feature 22. included feature 23. inner banner 24. contact info 25. form filed 26. intro video 27. office 28. team 29. included feature list 30. domain price 31. blog list 32. side bar 33. post single 34. comments area 35. cart 36. cart check out ========================== element list start ======================== 37. Element 38. Buttons 39. Social list 40. Select 41. Section title 42. nav tab 43. unorder list 44. breadCumb 45. accordion 46. map 47. custom control 48. pagination 49. prelaoder 50. inheritance
If you would like to edit a specific section of the site, simply find the appropriate label in the css or sass file, and then scroll down until you find the appropriate style that needs to be edited.
Color Styles (Variations) - top
This theme comes with Unlimited color variations. To change the color style from the theme edit the following lines:
... // primary and secondary color list $color-primary: #1868dd; // Navy Blue $color-secondary: #103dbe; // Limerick // other color list $titleColor: #1e1e1e; $linkColor: #3482ff;
Just change the color code name for example form $color-primary: #1868dd; to #114898.
Available assets/sass/variable/_variable.scss directory
Brand / Logo - top
To change the logo edit the following lines:
...
...
The value is the header logo image path from the assets/images/logo.png
The value is the footer logo image path from the assets/images/footer_logo.png
Section heading - top
To add or change a team edit the following lines:
...Best Hosting
WHY CHOOSE US
Pricing table element - top
To add or change a pricing table edit the following lines:
...
Cloud Hosting
The High performance cloud platform ever
Starting at
$49
25% Discount
$49.99
Expandable business category pricing table element - top
To add or change a pricing table edit the following lines:
...
Visits per monthTotal SitesHosting typeLocal storageBandwidth per monthImported SSL24/7 phone supportConsultative onboardingDev, Stage, ProdTransferable SitesMultisite readyPHP 7 readyLargeFSGlobal CDNPage PerformanceSSL certificatesGeoTargetContent PerformanceImported SSLReadiness assessmentSuccess managementApplication PerformanceHigh availability
if you change content just follow my instructions example
..... .......Visits per month
..... .......Visits per monthUp to 25000
Pricing table element - top
To add or change a pricing table edit the following lines:
Name Register Transfer Renew 
$19.95 $29.95$19.95 $19.95 $16.95 $16.95 $16.95 $09.95 $09.95 $09.95 
$15.95 $15.95 $15.95 $19.95 $19.95 $19.95 $14.95 $29.95$14.95 $14.95 
$16.95 $16.95 $16.95 $18.95 $18.95 $18.95
Parallax image - top
To add or change parallax image open file eaxmple (filename.html)change image assets/images/welcome/banner_image-2.png, find and edit code below:
......
Edit parallax speed just change data-parallax='{"y": 150}' y value
Wave parallax image - top
To add or change wave parallax image open file eaxmple (filename.html)change image assets/images/welcome/horizontal-shape.png, find and edit code below:
......
video section - top
To add or change video content edit the following lines:
...
you add your custom video just following instructions: got to https://www.youtube.com/ copy video url and paste it
Team - top
To add or change team content edit the following lines:
...
Dimon Lake
CEO
Dimon Lake
CEO
Share processes an data secure lona need
change team image and add your own image just following instructions: assets/images/teams/team-1.jpg
Accordion - top
To add or change a contact filed edit the following lines:
...No, its completely unmanaged — if you experience issues with your server, you can reach out to our support team.
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod brunchAnim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin.Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod brunchAnim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin.
Contact - top
The Contact form is based on jQuery. You don't have to know PHP. To change sample email adress, open assets/php/c_config.php, find and edit code below:
...
define('YOUR_EMAIL_ADDRESS', 'info@example.com');
define('YOUR_EMAIL_SUBJECT', 'your mail subject');
define('YOUR_SUCCESS_MASSAGE', 'Successfully Sent Email');
Twitter - top
The Twitter is based on jQuery. You don't have to know PHP. To change simple change username, open assets/js/main.js just search (12. twitter api init), and you also change twit count just simple count: 2 to change 3 or 4 find and edit code below:
... if ($('.xs-tweet').length > 0) { $('.xs-tweet').twittie({ dateFormat: '%b. %d, %Y', template: '{{tweet}}{{date}}Details', count: 2, username: 'xpeedstudio', loadingText: 'Loading!', }); }
VPS Slider - top
To add or change a VPS slider content edit the following lines:
first you go to assets/js/vps-slider.js and edit file
Just you change projects ===> 'name' or other example 'price'just change 'Basic Pack' to 'Business Pack' change price '$5.99' to '$500.99'
JavaScript - top
This theme imports the following Javascript files.
- assets/js/jquery-3.2.1.min.js
- assets/js/plugins.js
- assets/js/bootstrap.min.js
- assets/js/isotope.pkgd.min.js
- assets/js/jquery.magnific-popup.min.js
- assets/js/owl.carousel.min.js
- assets/js/tweetie.js
- assets/js/jquery.parallax-scroll.js
- assets/js/jquery.ajaxchimp.min.js
- assets/js/jquery.parallax.js
- https://maps.googleapis.com/maps/api/js?v=3&key=AIzaSyCy7becgYuLwns3uumNm6WdBYkBpLfy44k
- assets/js/main.js
PSD Files - top
The following Photoshop file are included with the download package place in /PSD/ folder:
hostinza.psd
Credits - top
Once again, thank you so much for purchasing this template. As I said at the beginning, I'd be glad to help you if you have any questions relating to this template. No guarantees, but I'll do my best to assist. If you have a more general question relating to the templates on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.
XpeedStudio