#### Documentation

### Introduction

Get Start With Landrick. Launch your campaign and benefit from our expertise on designing and managing conversion centered bootstrap4 html page.

#### Quick start

Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect. Head to the downloads page.

##### CSS

Copy-paste the stylesheet `<link>` into your `<head>` before all other stylesheets to load Bootstrap CSS.

`<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />`

##### JS

Many of our components require the use of JavaScript to function. Specifically, they require jQuery and our own JavaScript plugins. Place the following `<script>` near the end of your pages, right before the closing `</body>` tag, to enable them. jQuery must come first, then bootstrap.bundle.min.js, and then our JavaScript plugins.

###### `<script src="js/jquery.min.js"></script>`

###### `<script src="js/bootstrap.bundle.min.js"></script>`

##### Starter Template

Be sure to have your pages set up with the latest design and development standards. That means using an HTML5 doctype and including a viewport meta tag for proper responsive behaviors. Put it all together and your pages should look like this:

##### HTML :

    <!doctype html>
    <html lang="en">
        <head>

            <meta charset="utf-8" />
            <title> Landrick - Saas & Software Landing Page Template </title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0" />
            <meta name="description" content="Site description" />
            <meta name="keywords" content="Your tags" />

            <!-- favicon icon -->
            <link rel="shortcut icon" href="images/favicon.ico">

            <!-- Bootstrap -->
            <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />

            <!-- Main css -->
            <link href="css/style.css" rel="stylesheet" type="text/css" />

        </head>

        <body>

            <!-- Loader Start -->
            <div id="#--------">
                --------
                --------
            </div>
            <!-- Loader End -->

            <!-- Navbar Start -->
            <header>
                <div class="--------">
                    --------
                    --------
                    --------
                    --------
                </div>
            </header>
            <!-- Navbar End -->

            <!-- Hero Start -->
            <section class="--------">
                <div class="--------">
                    --------
                    --------
                    --------
                    --------
                </div>
            </section>
            <!-- Hero End -->

            <!-- Footer Start -->
            <footer>
                <div class="--------">
                    --------
                    --------
                    --------
                    --------
                </div>
            </footer>
            <!-- Footer End -->

            <!-- Back To Home Start -->
            <a href="#" class="--------" id="#--------">
                --------
                --------
            </a>
            <!-- Back To Home End -->

            <!-- Javascript Start -->
            <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 End -->
        </body>
    </html>

##### RTL Version

In order to have RTL mode enabled, replace the reference of `style.css` to `style-rtl.css`

##### Dark Version

###### Dark Version :

In order to have Dark mode enabled, replace the reference of `style.css` to `style-dark.css`

###### Dark RTL Version :

In order to have Dark RTL mode enabled, replace the reference of `style.css` to `style-dark-rtl.css`

##### Menu

###### Menu Center to Right

To move menu from center to right side then just add class `navigation-menu` along with `nav-right`

###### Menu Center to Left

To move menu from center to right side then just add class `navigation-menu` along with `nav-left`

###### Menu Light with Center

If you want menu center and light navigation just add class `navigation-menu` along with `nav-light`

###### Menu Light with Right

If you want menu right side and light navigation just add class `navigation-menu nav-right` along with `nav-light`

###### Menu Light with Left

If you want menu left side and light navigation just add class `navigation-menu nav-left` along with `nav-light`