ULaunch
Multi Purpose Products Landing Page
Features
- Multi-Purpose Template
- 100+ Ready to use Content Elements
- Modern, Flat & Unique Design.
- Bootstrap Grid Layout.
- Effects And Animations
- w3c valid html5 & css3
- Fully Responsive
- Cross Browser Compatible
- SEO Friendly
- Easy to Edit & Customize
- Working AJAX Contact Form
- Well Written Commented HTML5 & CSS3 code
- Detailed documentation
Template folders and files are divided as following.
-
css - contains css files
-
fonts - contains fonts files
-
images - contains images
-
js - contains javascript files
-
index.html - Main landing page
- form-process.php - contact form process file
We have used following CSS files to create different layout of app launch.
- bootstrap.min.css - Framework
- font-awesome-all.css - Font icons font-awesome
- flaticon.css - Font icons flaticon
- swiper.min.css - Swiper carousel
- animate.css - animated css
- magnific-popup.css - popup for screenshot, images & video
- sliderstyle.css - MS Slider CSS
- custom.css - Css file for layout
Note: We have included only required file in particular layout.
We have used following Javascript files to create different layout of app launch.
-
jquery-3.6.0.min.js - Javascript library
- SmoothScroll.js - SmoothScroll
- bootstrap.min.js - Bootstrap framework
-
validator.min.js - Contact form validation
-
jquery.waypoints.min.js - Trigger a function when you scroll to an element
-
jquery.counterup.min.js - Animates a number from zero (counting up towards it)
- wow.js - Animation
- jquery.magnific-popup.min.js - Magnific Popup
- swiper.min.js - Swiper carousel
- parallaxie.js - parallax effects
- function.js - configuration code for layout
Note: We have included only required file in particular layout.
form-process.php - is used for sending an email
You need to add your email, please open "form-process.php" file and edit variable $EmailTo.
$EmailTo = "info@yourdomain.com";
To use element in your template follow the following steps
- Copy
elements.css
file from elements/css
folder to your template css folder
- Copy
elements.js
file from elements/js
folder to your template js folder
- Copy
images
files from elements/images
folder to your template images folder
Note: Don't modify our elements.css and elements.js file. We recomonded you to please make your one own css file & one js files and add that in your page, so whenever the update of ULaunch comes it does not affect your code.
To use accordions in your template open elements/accordion.html
and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
To use Infobar in your template open elements/infobar.html
and follow the following steps.
- Select your style
- Right side of each title you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
To use Offer Box in your template open elements/offerbox.html
file and follow the following steps.
- Select your style
- Right side of each title you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
To use Pricing Box in your template open elements/pricing-box.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
To use Product Box in your template open elements/product-box.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
To use Progress Bar in your template open elements/progress-bar.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
- Copy
jquery.waypoints.min.js
file from elements/js
folder to your template js folder and include it in template using script tag.
To use Stats Counter in your template open elements/stats-counter.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
- Copy
jquery.waypoints.min.js
and jquery.counterup.min.js
file from elements/js
folder to your template js folder and include both file in template using script tag.
We have used Counter-Up jQuery plugin for Stats Counter. For more detail read here https://github.com/bfintal/Counter-Up
To use Tab in your template open elements/tab.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
- Copy
bootstrap-responsive-tabs.css
file from elements/css
folder to your template css folder and include it in template using link tag.
- Copy
jquery.bootstrap-responsive-tabs.min.js
file from elements/js
folder to your template js folder and include it in template using script tag.
To use Team Box in your template open elements/team-box.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML code.
- Copy HTML code in your template at your desire location.
We have used Counter-Up jQuery plugin for Stats Counter. For more detail read here https://github.com/bfintal/Counter-Up
To use Testimonials in your template open elements/testimonials.html
file and follow the following steps.
- Select your style
- Bottom of each style you can see "View Code" button click on it, now you can see HTML & JS code.
- Copy HTML code in your template at your desire location.
- Copy JS code in your template JS file.
- Copy
swiper.min.css
file from elements/css
folder to your template css folder and include it in template using link tag.
- Copy
swiper.min.js
file from elements/js
folder to your template js folder and include it in template using script tag.
We have used Swiper slider jQuery plugin for testimonials. For more detail read here https://github.com/nolimits4web/swiper
Twitter Bootstrap framework:
Icons:
Images in preview are used from:
Note : The images used in the template are not included in the main download file, they are only for the preview purpose.