Can someone please lay this out for me?

I have been trying for months with every free minute I have to wrap my head around all of this. Can someone please lay this out in Wappler for me? I keep trying different ways but I’m getting really frustrated. I don’t know what else to do. I have tried so many variations of containers, headers, sections. I just can’t make good sense of it all. I think if I had the layout, I could tweak it and make it work.

If anybody could please help, I would really appreciate it. Thank You.

Could modify a template I put together a few months back, think it has the majority of what you require ready to go. You’ll just have to add a footer and modify column sizes. Pretty simple to do, won’t take you long and you’ll be on your merry way with your Wappler project!

:wink:

1 Like

Thanks.

Can I just pay you to make one for me. I have wasted five hours today trying to make a simple layout.

Its all in that template Tony. You just need to extract it to your Project directory, add your logo where it says company name, add a footer. As it is there is no need to pay for the template. I’d have to raise an invoice, pass you my IBAN, confirm payment, when it would take you a few minutes to do it yourself. I’m always happy to accept paid work but can not do so on the spur of the moment due to other Client commitments and deadlines unfortunately.

@nshkrsh may take you up on the offer if he is free though?

Thanks. I’m not interested in learning Bootstrap.

I own Dreamweaver, so I’m just going to use that to lay things out. The interface makes sense, and most importantly the Undo always works.

Undo always works fine for me… It’s your choice Tony. Good luck with your endeavors.

It doesn’t always work for me. I have tried on a Mac and on Windows. It’s always a mystery if it’s going to work.
DW works everytime.

That is unfortunate. As I said, good luck Tony, hope you sort the issue.

No, I hope Wappler sorts out the issues. Good luck with figuring it out.

I really don’t understand what an outdated and dead product like Adobe Dreamweaver has to do with Wappler and its features. I also don’t understand what do you mean by:

Bootstrap (4 and 5) is integrated in Wappler so whether or not you want to “learn” it, that’s how you build your page layout.

Also i am not sure i understand what issues are you actually referring to?

But you can easily set up a layout like this in about 15 seconds in Wappler.

<!doctype html>
<html>

<head>
    <title>Untitled Document</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <script src="dmxAppConnect/dmxAppConnect.js"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous" />
    <script src="dmxAppConnect/dmxBootstrap5Navigation/dmxBootstrap5Navigation.js" defer=""></script>
</head>

<body is="dmx-app" id="index">
    <header class="fixed-top">
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div class="container">
                <a class="navbar-brand" href="#">Navbar</a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#collapse1" aria-controls="collapse1" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div id="collapse1" class="collapse navbar-collapse justify-content-end">
                    <div class="navbar-nav">
                        <a class="nav-item nav-link" href="#">Link</a>
                        <a class="nav-item nav-link" href="#">Link</a>
                    </div>
                </div>
            </div>
        </nav>
    </header>
    <main class="mt-5">
        <div class="container-fluid">
            <div class="row">
                <div class="col-2">
                </div>
                <div class="col-10">
                </div>
            </div>
        </div>
    </main>
    <footer class="fixed-bottom pt-4 pb-4">
        <div class="container">
            <div class="row">
                <div class="col">
                    <p class="mb-0">This is the footer</p>
                </div>
            </div>
        </div>
    </footer>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</body>
</html>

Thank You for this.