> For the complete documentation index, see [llms.txt](https://docs.sprinthub.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.sprinthub.com/en/topics/attract/landing-page/landing-page-how-to-import-your-website-into-sprinthub.md). # Landing Page - How to import your website into SprintHub Creating an efficient landing page is essential for capturing leads and increasing conversions in your business. At SprintHub, we offer a practical solution to import your custom landing page directly

### Step-by-Step Guide to Import Your Landing Page into Sprinthub To import your landing page into Sprinthub, follow the steps below: #### 1. Access the Landing Page Builder First, log in to your Sprinthub account and navigate to the landing page creation section. Click "Create New Page" to begin the process.

You will be directed to an initial setup page, where you need to add the page title and alias:

#### 2. Use the Custom Code Component Inside the landing page builder, you will find several components that can be dragged and dropped to build your page. Look for the "HTML" component or similar, which allows the insertion of HTML and CSS code.

After adding the component, click on it and click on advanced editor:

#### 3. Add the HTML and CSS Code Copy the HTML and CSS code from the landing page you want to import. In the "Custom Code" component, paste that code. Make sure all necessary CSS is embedded in the HTML, as using external links for style sheets is not allowed. **Code Example:**

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Landing Page</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
        }
        .container {
            width: 80%;
            margin: auto;
            overflow: hidden;
        }
        #main-header {
            background-color: #333;
            color: #fff;
            padding-top: 30px;
            min-height: 70px;
            border-bottom: #77aaff 3px solid;
        }
        #main-header h1 {
            text-align: center;
            text-transform: uppercase;
            margin: 0;
            font-size: 24px;
        }
        #cta {
            margin: 30px;
            text-align: center;
        }
        #cta button {
            background-color: #333;
            color: #fff;
            border: none;
            padding: 15px 20px;
            cursor: pointer;
            font-size: 18px;
        }
        #cta button:hover {
            background-color: #555;
        }
    </style>
</head>
<body>
    <header id="main-header">
        <div class="container">
            <h1>Welcome to My Landing Page</h1>
        </div>
    </header>
    <section id="cta">
        <div class="container">
            <h2>Call to Action</h2>
            <button>Click Here</button>
        </div>
    </section>
</body>
</html>

After adding it, view the changes on your page:

#### 4. Preview and Adjust After adding the code, preview your landing page to make sure everything is working as expected. Make the necessary adjustments directly in the code inside the "Custom Code" component. #### 5. Save and Publish After confirming that your landing page is correctly configured and visually appealing, save your changes. Finally, publish the page to make it accessible to your leads and visitors.

### Conclusion Importing your landing page into Sprinthub is a simple process that offers great flexibility and customization. By using the "Custom Code" component, you can integrate your HTML and CSS directly into the landing page builder, maintaining total control over your page's design and functionality. Follow the steps mentioned and make the most of Sprinthub's features to create effective and attractive landing pages. If you have any questions or need assistance, our support team is always available to help. Happy converting! *** We hope this guide has been useful in understanding how to import your landing page into Sprinthub. For more tips and tutorials, keep following our blog and stay tuned for updates!