Core Feature Module Overview

Download File Details

  • Unsplash Gallery
  • NothingToChance
  • Gratisography

Welcome to the Official 开云 Website

This is , and it wont install like a WordPress theme, (static website). this is a HTML5 templateNote:not a WordPress theme

Softar is a Responsive Software Landing Page HTML5 Template that comes with 10+ pages and 5 home page variations. Softar is a graphically polished, interactive, easily customizable, highly modern, fast loading, search engine optimized, efficiently coded, well documented, vibrant and fully responsive HTML5 and CSS3 Software Landing Page template specifically for , software , start-ups and mobile apps, Automotive site or your just a Blog

To edit this template with your info you will need a code editor, i use Sublime Text (http://www.sublimetext.com/3) and a browser i recommend to use Google Chrome.

It is really easy to use. There is multiple home page layouts to chose, also various selection of pages that you can use to create your website, but you can also create your own page layouts very easily (just copy and paste code form the elements examples).

When you start editing the template with your info is good idea to create separate folder, copy the assets folder and 404.html page there, rename one of the index... files to index.html and then move and edit pages that you will use. Also is good practice to create separate styleseet for your edits and load it bellow Softar CSS.

Quick Start Guide

Follow the steps below to setup your site template:

  1. After unzipping the package, please navigate to the 'HTML' folder to find all template files. Use an FTP client to upload these files to your website's root directory.
  2. Here is a recommended folder structure for deployment to your website's root directory: HTML/css - Stores all stylesheet files HTML/fonts – Stores icon font files HTML/img - Stores images and media assets HTML/js - Stores all JavaScript files
  3. Please upload HTML files selectively based on your website's needs.
  4. You can now start adding personalized content and images to create a new and professional website for your users.

Website Structure Details

HTML File Structure Analysis

Once you download the template, you can see a folder with several files and sub folders. You can read description of some important files in continue.

  • assets
    • css
      • Animation CSS
      • Navigation Bar CSS
      • Bootstrap Core CSS
      • FontAwesome Icons CSS
      • Themify Icons CSS
      • Popup Window CSS
      • Owl Carousel Core CSS
      • Owl Carousel Default Theme CSS
      • Responsive Design CSS
      • Merged and Minified Version of All Required CSS Files
    • Fonts
    • Media Files Storage (e.g., Logo, Background Images, Product Images)
    • js
      • Navigation Bar JavaScript
      • Bootstrap Core JavaScript
      • Block Height Auto-Adaptation JavaScript
      • MixItUp Dynamic Layout Plugin
      • jQuery Animation Helpers
      • jQuery Easing Effects
      • Magnific Popup Modal Component
      • jQuery Core Library
      • Modernizr Feature Detection
      • Owl Carousel Slider Plugin
      • WOW.js Animation Library
      • Progress Bar Component
      • Isotope Masonry Plugin
      • ImagesLoaded Image Detection
      • CountTo Number Counter
      • Core Script Aggregation
      • Custom Scripts
  • Homepage
  • Homepage 2
  • ...
  • Stylesheet

Personalization Settings

Please Note the Following Important Matters

Softar follows a simple and easy to customize coding structure. Here is the sample for your reference:


<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Softar - Software Landing Page Template</title>

    <!-- ========== Start Stylesheet ========== -->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/css/font-awesome.min.css" rel="stylesheet">
    <link href="assets/css/themify-icons.css" rel="stylesheet">
    <link href="assets/css/magnific-popup.css" rel="stylesheet">
    <link href="assets/css/owl.carousel.min.css" rel="stylesheet">
    <link href="assets/css/owl.theme.default.min.css" rel="stylesheet">
    <link href="assets/css/animate.css" rel="stylesheet">
    <link href="assets/css/bootsnav.css" rel="stylesheet">
    <link href="assets/style.css" rel="stylesheet">
    <link href="assets/css/responsive.css" rel="stylesheet">
    <link href="style.css" rel="stylesheet">
  </head>
  

  <body>

    <!-- Start Navigation -->
    <nav class="navbar navbar-default navbar-fixed white no-background bootsnav">

    </nav>
    <!-- End Navigation-->


    <!-- Start Main
    ============================================= --->
    <main>

    </main>
    <!-- END Main Content -->


    <!-- Star Footer
    ============================================= -->
    <footer>

    </footer>
    <!-- End Footer -->


    <!-- jQuery Frameworks
    ============================================= -->
    <script src="assets/js/jquery-1.12.4.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
    <script src="assets/js/jquery.appear.js"></script>
    <script src="assets/js/jquery.easing.min.js"></script>
    <script src="assets/js/jquery.magnific-popup.min.js"></script>
    <script src="assets/js/modernizr.custom.13711.js"></script>
    <script src="assets/js/owl.carousel.min.js"></script>
    <script src="assets/js/wow.min.js"></script>
    <script src="assets/js/progress-bar.min.js"></script>
    <script src="assets/js/isotope.pkgd.min.js"></script>
    <script src="assets/js/imagesloaded.pkgd.min.js"></script>
    <script src="assets/js/count-to.js"></script>
    <script src="assets/js/bootsnav.js"></script>
    <script src="assets/js/custom.js"></script>

  </body>
</html>

Brand Visual Element Adjustments

How to change logo

开云

How to change favicon

Thumb

How to change page title

Thumb

How to Change Banner Text & Background

Banner One

Thumb

Banner Two

Thumb

How to change Team Section

Thumb

How to change testimonial Section

Thumb

How to Change Breadcrumb

Thumb

How to Add/Remove Footer Bottom

Thumb

How to change contact form email

Thumb

How to control Fun Factor

Thumb

How to control Owl Carousel

Thumb

How to control Preloader

Thumb

How to Add/Remove CSS

Thumb

How to Add/Remove JS

Thumb

Important Notices and Safety Precautions

The official 开云 website defaults to using Manrope and Roboto fonts, both from Google Fonts. You can find instructions on how to modify the fonts here.

 @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&display=swap');
                    

Acknowledgements and Community Contributions

Read The following information Carefully

  • All fonts used on this website are sourced from Google Fonts. In case of network issues, fonts will automatically fallback, ensuring uninterrupted browsing.
  • For more in-depth customization assistance, please contact us through our official channels.
  • Before seeking assistance, please ensure you are the actual purchaser of this content. You can verify this by: 1. Submitting a support ticket. 2. Providing a screenshot of your account after login to prove download rights.

credits

We sincerely thank all community members who have contributed to the official 开云 website. Their support and feedback are the driving force behind our continuous progress.

Images and video

JS Libraries

  • jQuery
  • HTML5 Compatibility
  • Modernizr
  • jQuery Easing Effects
  • Smooth Scrolling
  • jQuery Element Visibility Detection
  • Bootsnav Navigation
  • WOW Animations
  • jQuery CountTo Plugin
  • Magnific Popup
  • Element Height Auto-adaptation
  • Owl Carousel Slider

CSS & Fonts

  • Bootstrap Framework
  • Animation Effects
  • Font-Awesome Icons
  • Flaticons Icons
  • Google Fonts
开云 Technology Co., Ltd.Quality you can rely onPhone:+86 188 6853 3093Email:[email protected]Block 814, North District, Science Park, Nanshan District, Shenzhen
📍 View location on Baidu Maps