Hallo k-webdesign
So habe ich das dk-mmenu eingebunden:
fe_page.html5 Template
HTML-Code:
<!DOCTYPE html>
<html lang="<?= $this->language ?>"<?php if ($this->isRTL): ?> dir="rtl"<?php endif; ?>>
<head>
<?php $this->block('head'); ?>
<meta charset="<?= $this->charset ?>">
<title><?= $this->title ?></title>
<base href="<?= $this->base ?>">
<?php $this->block('meta'); ?>
<meta name="robots" content="<?= $this->robots ?>">
<meta name="description" content="<?= $this->description ?>">
<meta name="generator" content="Contao Open Source CMS">
<?php $this->endblock(); ?>
HIER KOMMT ALLENFALS DIE ANBINDUNG VON FONTAWESOME HIN
<script src="HIER KOMMT DER LINK ZU FONTAWESOME HIN" crossorigin="anonymous"></script>
<?= $this->viewport ?>
<?= $this->framework ?>
<?= $this->stylesheets ?>
<?= $this->mooScripts ?>
<?= $this->head ?>
<?php $this->endblock(); ?>
</head>
<body id="top"<?php if ($this->class): ?> class="<?= $this->class ?>"<?php endif; ?><?php if ($this->onload): ?> onload="<?= $this->onload ?>"<?php endif; ?> itemscope itemtype="http://schema.org/WebPage">
<?php $this->block('body'); ?>
<?php $this->sections('top'); ?>
<div id="wrapper">
<?php $this->block('header'); ?>
<?php if ($this->header): ?>
<header id="header">
<div class="inside">
<?= $this->header ?>
</div>
</header>
<?php endif; ?>
<?php $this->endblock(); ?>
<?php $this->sections('before'); ?>
<?php $this->block('container'); ?>
<div id="container">
<?php $this->block('main'); ?>
<main id="main">
<div class="inside">
<?= $this->main ?>
</div>
<?php $this->sections('main'); ?>
</main>
<?php $this->endblock(); ?>
<?php $this->block('left'); ?>
<?php if ($this->left): ?>
<aside id="left">
<div class="inside">
<?= $this->left ?>
</div>
</aside>
<?php endif; ?>
<?php $this->endblock(); ?>
<?php $this->block('right'); ?>
<?php if ($this->right): ?>
<aside id="right">
<div class="inside">
<?= $this->right ?>
</div>
</aside>
<?php endif; ?>
<?php $this->endblock(); ?>
</div>
<?php $this->endblock(); ?>
<?php $this->sections('after'); ?>
<?php $this->block('footer'); ?>
<?php if ($this->footer): ?>
<footer id="footer">
<div class="inside">
<?= $this->footer ?>
</div>
</footer>
<?php endif; ?>
<?php $this->endblock(); ?>
</div>
<?php $this->sections('bottom'); ?>
<?php $this->endblock(); ?>
<?= $this->mootools ?>
</body>
</html>
Ein Frontend-Modul einfügen vom Typ: Navigationsmenü
|__ bei Experteneinstellungen bei der CSS-ID folgendes einfügen: menu (hier natürlich das was Du drinn haben möchtest, das war glaube ich mobileMenu)
Ein Frontend-Modul einfügen vom Typ: Eigener HTML-Code
|__
HTML-Code:
<div class="offcanvas"><a href="#offcanvas"><i class="fas fa-bars fa-3x"></i></a></div>
WICHTIG: im fe_page.html5 muss Fontawesome eingebunden sein (das kann aber auch durch eine Erweiterung geschehen. Ich habe das bei mir so gelöst: Einen Account auf Fontawesome angelegt und den Code dann im fe_page.html5 eingebunden
Ein Frontend-Modul einfügen vom Typ: mmenu - Navigationsmenü
|
1.png
|
2.png
|
3.png
|
4.png
Die erstellten Frontend-Module im Seitenlayout in der Kopzeile einbinden und danach noch im CSS folgendes einfügen
|
HTML-Code:
.offcanvas {
display: none;
}
@media screen and (max-width: 1180px) {
.offcanvas {
display: block;
float: right;
margin-top: -85px;
margin-right: 20px;
}
.fas.fa-bars.fa-3x {
color: black;
font-size: 30px;
}
#HIER DIE ID EINFÜGEN VON DEINER NORMALEN NAVIGATION {
display: none;
}
Ich hoffe das ich das gut rübergebracht habe
Zitieren
Zitat von Spooky
. Wenn eine der nächsten Versionen der Extension mal finanziert wird, werde ich den Namen dieses Templates ändern, war unglücklich gewählt.
Lesezeichen