Hero Box
Möchten Sie unsere Hero-Box nutzen, stellen wir hier eine Schritt-für-Schritt-Anleitung zur Verfügung.
Erstellen Sie im ACP unter Inhalt ⇨ Boxen ⇨ Boxhinzufügen eine neue Template-Box. Vergeben Sie einen Namen, wählen Sie die gewünschten Optionen aus und wählen Sie als Position Hero aus. Anschließend gehen Sie in den Tab Inhalte und fügen Folgendes in der Codebox ein:
Smarty
<!DOCTYPE html>
<html>
<head>
<style>
.BerryfoxHeroBox {
text-align: left;
background-color: #0000009c;
padding: 15px 15px 15px 40px;
border-radius: 1rem;
width: 40rem;
margin-left: -30px;
}
.BerryfoxHeroBox h2 {
font-size: 16px;
}
.BerryfoxHeroBoxLogin {
text-align: center;
}
</style>
</head>
<body>
<div class="BerryfoxHeroBox">
{if $__wcf->getUser()->userID}
<!-- Eingeloggter Zustand -->
<h2 class="boxTitle">Willkommen zurück!</h2>
<br>
<p>
Tauchen Sie ein in die aufregende Welt des Stils "Berryfox" – eine faszinierende Kombination aus Eleganz und Innovation, die Ihre Sinne verzaubern wird. Lassen Sie sich von den satten Beerentönen und modernen Designelementen inspirieren, während wir gemeinsam eine neue Dimension des Stils erkunden. Herzlich willkommen bei "Berryfox" – wo Eleganz und Kreativität eins werden.
</p>
<br>
<!-- Eingeloggter Zustand ENDE -->
{else}
<!-- Ausgeloggter Zustand -->
<h2 class="boxTitle">Herzlich Willkommen!</h2>
<br>
<p>
Tauchen Sie ein in die aufregende Welt des Stils "Berryfox" – eine faszinierende Kombination aus Eleganz und Innovation, die Ihre Sinne verzaubern wird. Lassen Sie sich von den satten Beerentönen und modernen Designelementen inspirieren, während wir gemeinsam eine neue Dimension des Stils erkunden. Herzlich willkommen bei "Berryfox" – wo Eleganz und Kreativität eins werden.
</p>
<br>
<div class="BerryfoxHeroBoxLogin">
<a href="{link controller='login'}{/link}" title="{lang}wcf.user.button.login{/lang}">
<button class="button buttonPrimary">
{icon name='right-to-bracket' type='solid'} Anmelden
</button>
</a>
<a href="{link controller='Register'}{/link}" title="{lang}wcf.user.button.register{/lang}">
<button class="button buttonPrimary">
{icon name='user-plus' type='solid'} Registrieren
</button>
</a>
</div>
<!-- Ausgeloggter Zustand ENDE -->
{/if}
</div>
</body>
</html>Bitte denken Sie daran, Ihren Text hinzuzufügen. Nun können Sie noch in dem Tab Bedingungen festlegen, wo die Box überall angezeigt werden soll.
