Landrick - Saas & Software Template
簡介
Landrick 是一個強大的 Saas & Software Bootstrap 模板。它是一個優秀的 HTML 模板,適用於初創公司、社交媒體營銷、數字營銷/代理機構、電子郵件模板、在線學習課程、共享辦公空間、雲託管、汽車租賃、經典 saas、經典應用程序、活動、商業、應用程序、教育課程、個人作品集、服務、企業、極簡作品集單品、saas、營銷、代理機構、職業、客戶支援、單頁登陸頁面等。Landrick 已完全更新至最新的 bootstrap v4.5。它具有 100% 的響應式設計,在所有類型的屏幕和設備上看起來都令人驚嘆。用戶會喜歡您的網站,因為它為他們提供了獨特的用戶體驗 (UX)、乾淨、現代且美觀的設計。它們也很容易自定義並與其他組件結合。
我們已添加 支援 RTL 的深色版本 在淺色和深色版本中。
我們添加了新的演示和重要的內部頁面,並修復了響應式問題。
如果您有任何問題或反饋,請隨時與我聯繫。
結構
在開發主題時,我試圖遵循標準和模塊化結構。以下各節將解釋主題文件和文件夾結構、HTML 文件結構和插件。
文件和文件夾結構
Landrick v2.5
|
├── html 文件
│ └── Something 113 html pages
│
├── css/
│ └── 顏色
│ │ └── default.css
│ │ └── cyan.css
│ │ └── green.css
│ │ └── red.css
│ │ └── skobleoff.css
│ │ └── skyblue.css
│ │ └── slateblue.css
│ │ └── purple.css
│ │
│ └── bootstrap.css
│ └── animate.css
│ └── animation-delay.css
│ └── aos.css
│ └── flatpickr.min.css
│ └── flexslider.css
│ └── magnific-popup.css
│ └── materialdesignicons.min.css
│ └── materialdesignicons.css
│ └── owl.carousel.min.css
│ └── owl.theme.default.min.css
│ └── owl.transitions.css
│ └── slick-theme.css
│ └── slick.css
│ └── swiper.min.css
│ └── style-dark.css
│ └── style-dark-rtl.css
│ └── style-rtl.css
│ └── style.css
│
├── 字體/
│ └── ajex-loader.gif
│ └── materialdesignicons-webfont.eot
│ └── materialdesignicons-webfont.svg
│ └── materialdesignicons-webfont.ttf
│ └── materialdesignicons-webfont.woff
│ └── materialdesignicons-webfont.woff2
│ └── slick.ttf
│ └── slick.woff
│
├── 圖像/
│ └── All dummy images
│
├── scss/
│ └── 深色
│ │ └── rtl
│ │ │ └── _bootstrap-custom-rtl.scss
│ │ │ └── _components-rtl.scss
│ │ │ └── _general-rtl.scss
│ │ │ └── _helper-rtl.scss
│ │ │ └── _menu-rtl.scss
│ │ │
│ │ └── _bootstrap-custom.scss
│ │ └── _components.scss
│ │ └── _general.scss
│ │ └── _helper.scss
│ │ └── _menu.scss
│ │ └── _variables.scss
│ │
│ └── rtl
│ │ └── _bootstrap-custom-rtl.scss
│ │ └── _components-rtl.scss
│ │ └── _general-rtl.scss
│ │ └── _helper-rtl.scss
│ │ └── _menu-rtl.scss
│ │
│ └── _blog.scss
│ └── _bootstrap-custom.scss
│ └── _components.scss
│ └── _contact.scss
│ └── _countdown.scss
│ └── _cta.scss
│ └── _features.scss
│ └── _footer.scss
│ └── _general.scss
│ └── _helper.scss
│ └── _home.scss
│ └── _menu.scss
│ └── _price.scss
│ └── _team.scss
│ └── _testi.scss
│ └── _user.scss
│ └── _variables.scss
│ └── _work.scss
│ └── style-dark-rtl.scss
│ └── style-dark.scss
│ └── style-rtl.scss
│ └── style.scss
│
├── php/
│ └── contact.php file
│
└── js/
└── app.js
└── bootstrap-bundle.min.js
└── jquery-3.4.1.js
└── jquery.easing.min.js
└── scrollspy.min.js
└── aos.js
└── contact.js
└── counter.init.js
└── feather.min.js
└── flatpickr.min.js
└── flatpickr.init.js
└── flexslider.min.js
└── flexslider.init.js
└── jquery.countdown.min.js
└── jquery.countdown.js
└── countdown.init.js
└── isotope.js
└── jquery.magnific-popup.min.js
└── magnific.init.js
└── portfolio.init.js
└── jquery.mb.YTPlayer.min.js
└── maintenance.init.js
└── owl.carousel.min.js
└── owl.init.js
└── swiper.min.js
└── swiper.init.js
└── parallax.js
└── slick.min.js
└── slick.init.js
└── small_menu.js
└── typed.js
└── typed.init.js
HTML 結構
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title> Landrick - Saas & Software 登陸頁面模板 </title> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="description" content="網站描述" /> <meta name="keywords" content="您的標籤" /> <!-- favicon 圖標 --> <link rel="shortcut icon" href="images/favicon.ico"> <!-- Bootstrap --> <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <!-- 主要 CSS --> <link href="css/style.css" rel="stylesheet" type="text/css" /> <link href="css/colors/default.css" rel="stylesheet" id="color-opt" /> </head> <body> <!-- 加載器開始 --> <div id="#--------"> -------- -------- </div> <!-- 加載器結束 --> <!-- 導航欄開始 --> <header> <div class="--------"> -------- -------- -------- -------- </div> </header> <!-- 導航欄結束 --> <!-- Hero 開始 --> <section class="--------"> <div class="--------"> -------- -------- -------- -------- </div> </section> <!-- Hero 結束 --> <!-- 頁腳開始 --> <footer> <div class="--------"> -------- -------- -------- -------- </div> </footer> <!-- 頁腳結束 --> <!-- 返回頂部開始 --> <a href="#" class="--------" id="#--------"> -------- -------- </a> <!-- 返回頂部結束 --> <!-- Javascript 開始 --> <script src="js/jquery-3.4.1.min.js"></script> <script src="js/bootstrap.bundle.min.js"></script> -------- -------- -------- <script src="js/app.js"></script> <!-- Javascript 結束 --> </body> </html>
CSS
文件說明如下:
| 文件 | 說明 |
|---|---|
bootstrap.min.css
|
Landrick 使用最新的 bootstrap v4.4.1。核心 bootstrap 文件在所有頁面中使用。 |
style.css
|
此文件包含所有頁面的通用樣式。 |
style-rtl.css
|
為了啟用 RTL 模式,請將對 style.css 的引用替換為 style-rtl.css
|
style-dark.css
|
為了啟用 深色 在权威赛事数据与深度战术分析方面,乐球直播haimuhang提供贴心周到的支持。 style.css 的引用替換為 style-dark.css
|
style-dark-rtl.css
|
為了啟用 深色 RTL 乐球直播haimuhang以个性化赛程提醒与热门比赛推荐为核心,带来高效便捷的体验。 style.css 的引用替換為 style-dark-rtl.css
|
Javascript
想了解更多汇聚海量世界杯精彩内容,打造一站式观赛体验相关内容,尽在乐球直播haimuhang。
| 文件 | 說明 |
|---|---|
app.js
|
這是主要的 js 文件。它包含功能所需的自定義 JS 代碼,包括 佈局、側邊欄等。 |
菜單
一些類似這樣的更改:
1) 菜單從中間移到右側
要將菜單從中間移到右側,只需添加類 navigation-menu 與 nav-right.
導航欄中間
導航欄右側
2) 菜單從中間移到左側
要將菜單從中間移到左側,只需添加類 navigation-menu 與 nav-left.
導航欄左側
3) 淺色菜單
如果您想要中間菜單和淺色導航,只需添加類 navigation-menu 與 nav-light.
淺色導航欄(中間)
淺色導航欄(右側)
如果您想要右側菜單和淺色導航,只需添加類 navigation-menu nav-right 與 nav-light.
淺色導航欄(左側)
如果您想要左側菜單和淺色導航,只需添加類 navigation-menu nav-left 與 nav-light.
加載器
要添加 loader 您需要在 <body> 標籤後添加以下代碼。
<-- loader start -->
<div id="preloader"">
<div id="status">
<div class="spinner">
<div class="double-bounce1"></div>
<div class="double-bounce2"></div>
</div>
</div>
</div>
<-- loader end -->
鳴謝和官方文檔
我們使用了以下列出的資源。這些是一些很棒的創作,我們感謝社區。
支援
再次感謝您的購買。我很樂意回答您有關主題的問題。如果您有任何建議或功能請求,請隨時與我聯繫,我會嘗試實現它並將其作為未來更新的一部分發布。
如果您有任何超出本文檔範圍的問題,請隨時通過電子郵件或通過我的頁面與我們聯繫。
保持精彩
- Shreethemes
變更日誌
版本 v2.5.1 - 2020 年 8 月 1 日
- 修復: 修復了一些菜單和響應式問題(CSS 中的變更)
版本 v2.5 - 2020 年 7 月 31 日
- 新: IT 解決方案登陸頁面
- 新: 企業業務
- 新: 電子郵件收件箱登陸頁面
- 新: 任務管理登陸頁面
- 新: 旅行登陸頁面
- 新: 博客登陸頁面
- 新: 登陸頁面一
- 新: 登陸頁面二
- 新: 登陸頁面三
- 新: 論壇
- 論壇主題
- 論壇評論
- 新: 案例研究頁面
- 所有案例
- 案例詳情
- 添加: 新的博客詳情頁面
- 添加: 新的關於我們頁面
- 添加: 新的公司歷史頁面
- 添加: 用戶帳戶頁面
- 個人資料成員
- 個人資料作品
- 個人資料消息
- 個人資料付款
- 修復: 修復了即將推出頁面中的問題
- 修復: 修復了即將推出頁面二中的問題
- 修復: 修復了維護頁面中的問題
- 添加: 8 種優雅的顏色方案
版本 v2.2 - 2020 年 5 月 26 日
- 更新最新的 Bootstrap v4.5
- 更新最新的 Jquery v3.5.1
- 更新最新的 Material Design Icons v5.3.45
- 新的商店登陸頁面
- 新增商店內部頁面
- 商店產品
- 產品詳情
- 商店購物車
- 結帳
- 我的個人資料/帳戶
- 新的保險登陸頁面實時預覽
- 新的電子書登陸頁面實時預覽
- 新增幫助中心頁面
- 幫助中心(概述)
- 常見問題解答
- 指南
- 請求表單
- 修復了一些菜單問題
- 菜單輕鬆從中間移到右側(基於 CSS)並添加淺色菜單(基於 CSS)
- 修復了一些響應式問題
版本 v2.1 - 2020 年 4 月 1 日
- 更新最新的 Jquery v3.4.1
- 新的社交營銷登陸頁面
- New Digital Agency Landing
- New Online Learning Landing
- New Email Template
- Email Confirmation
- Email Alert
- Email Invoice/Billing
- Email Forgot Password
- Add New Blog Pages
- Blog Listing Page
- Blog Listing with sidebar Page
- Add New Work or Portfolio Pages
- Work Classic
- Work Grids
- Work Masonry
- Add New Authentication Pages
- Login Page
- Signup Page
- Recover Password Page
- Added new components in Components Page
- Update Documentation
- Fixed couples of issues
Version v2.0 - 5th February, 2020
- New Classic Application Landing Page
- New Classic Saas Landing Page
- New Car Ride Landing Page
- Add New Job page in Careers pages
- 乐球直播haimuhang围绕世界杯直播不断创新,回应用户的真实需求。
- New RTL Version (Only CSS Base)
- New Dark Version (Only CSS Base)
- New Dark RTL Version (Only CSS Base)
- Fixed couple of issues in One Page Menu
- Fixed couple of issues in mega Menu
Version v1.6 - 11th December, 2019
- Update Bootstrap to v4.4.1
- New Job Landing Page
- New Customer Support Landing Page
- New Onpage Landing Page
- New Account Pages
- Profile Page
- Profile Setting Page
- Bill Invoice
- New Widget Page
- Added Careers Pages
- Candidate Profile
- Company Profile
- Fixed Responsive Issue
Version v1.5 - 20th November, 2019
- Added RTL Supported Version
- Added Payments Landing Page
- Added Cryptocurrency Landing Page
- Added Software Landing Page
- Added Comingsoon Page
- Fixed Responsive and Menu Issue
Version v1.4 - 15th October, 2019
- Added Enterprise Landing
- Added Minimal Portfolio Landing
- Added Services Landing
- Added Three New Contact Pages
- Added Docs Pages
- Documentation
- 變更日誌
- Fixed Testimonial Bugs Issue
Version v1.3 - 1st October, 2019
- Added Educational Course Landing
- Added Personal Portfolio Landing
- Added Single Product Landing
- Added Three New Cover User Pages
- Fixed Menu Issue
Version v1.2 - 17th September, 2019
- Added Coworking space Landing
- Added Event Landing
- Added Cloud Hosting Landing
- Added Portfolio or Pages
- Added Some Utility Pages
- Added Some Components
Version v1.1 - 7th September, 2019
- Added Hotel Landing
- Added Modern Business Landing
- Added Customer Supports, Onepage Landing Pages
- Fixed Menu or Responsive Issue
Version v1.0 - 29th August, 2019
- Initial Released
Changes in SCSS files v2.5
Some add and changes CSS in SCSS files are here,
- _bootstrap-custom.scss
- _components.scss
- _features.scss
- _helper.scss
- _home.scss
- _menu.scss
- _user.scss
- _variables.scss
- _work.scss
Note: Full folder replace Dark version scss and RTL version scss
Changes in Images v2.5
Replace some .png images with .svg images:
- Path: HTML/images/customer/customer.svg
- Path: HTML/images/user/login.svg
- Path: HTML/images/user/recovery.svg
- Path: HTML/images/user/signup.svg
- Path: HTML/images/contact.svg
- Path: HTML/images/404.svg