Hi all,
With the system described below, I created a page layout called main and when I try to create a page content using the layout page, I just get a blank page. What can I be doing wrong? thanks for your help. I am attaching layout page code.
Best,
Jay
Wappler Version : 3.7.3
Operating System : Windows 10
Server Model: node js v 14.15 .1 says on the local system on docker says 12.20.1
Database Type: MySql v 8.0
Hosting Type: Docker on desktop
I was expected the content page to render the components of the main layout page
Actual behavior
What actually happens?
the content page renders blank, The components from the main layout page don’t appear
<!doctype html>
<html>
<head>
<base href="/">
<script src="dmxAppConnect/dmxAppConnect.js"></script>
<meta charset="UTF-8">
<title>Untitled Document</title>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="bootstrap/4/css/bootstrap.min.css" />
<script src="dmxAppConnect/dmxBootstrap4Navigation/dmxBootstrap4Navigation.js" defer=""></script>
<script src="dmxAppConnect/dmxRouting/dmxRouting.js" defer=""></script>
</head>
<body is="dmx-app" id="main">
<header class="bg-light wappler-block">
<div class="container">
<div class="row">
<div class="col">
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand mr-auto" href="#"><img src="assets/images/logo4.png" wappler-command="updateImage"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar1_collapse" aria-controls="navbar1_collapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbar1_collapse">
<div class="navbar-nav">
<a class="nav-item nav-link active" href="#">Home</a>
<a class="nav-item nav-link" href="#">About</a>
<a class="nav-item nav-link" href="#">Contact</a>
</div>
<a class="btn btn-dark btn-sm" href="#">Sign up</a>
</div>
</nav>
</div>
</div>
</div>
</header>
<div is="dmx-view" id="content">
<%- await include(content, locals); %>
</div>
<footer class="bg-light wappler-block">
<div class="container">
<div class="row align-items-top">
<div class="col-6 col-md text-center">
<h5>Features</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Cool stuff</a></li>
<li><a class="text-muted" href="#">Random feature</a></li>
<li><a class="text-muted" href="#">Team feature</a></li>
<li><a class="text-muted" href="#">Stuff for developers</a></li>
<li><a class="text-muted" href="#">Another one</a></li>
<li><a class="text-muted" href="#">Last time</a></li>
</ul>
</div>
<div class="col-6 col-md text-center">
<h5>Resources</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Resource</a></li>
<li><a class="text-muted" href="#">Resource name</a></li>
<li><a class="text-muted" href="#">Another resource</a></li>
<li><a class="text-muted" href="#">Final resource</a></li>
</ul>
</div>
<div class="col-6 col-md text-center">
<h5>About</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Team</a></li>
<li><a class="text-muted" href="#">Locations</a></li>
<li><a class="text-muted" href="#">Privacy</a></li>
<li><a class="text-muted" href="#">Terms</a></li>
</ul>
</div>
</div>
<div class="row mt-3">
<div class="col">
<p class="text-secondary text-center small mb-0 p-1">© Copyright 2021. All Rights Reserved.</p>
</div>
</div>
</div>
</footer>
<script src="bootstrap/4/js/popper.min.js"></script>
<script src="bootstrap/4/js/bootstrap.min.js"></script>
</body>
</html>
Community Page
Last updated:
Last updated: