Kriegste hin, ich glaube an dich.Zitat:
Zitat von MacPix
Druckbare Version
Kriegste hin, ich glaube an dich.Zitat:
Zitat von MacPix
Und warum nicht?Zitat:
Zitat von MacPix
Ich denke du verschachtelst dich in deinen Gedanken. Wenn man dein PDF aus dem ersten Beitrag nimmt, dann würde ich das im Backend so aufbauen:
Wenn das alles gemacht hast müsste ja dann etwas in der Art herauskommen:Code:1 - Für die Seite ganz normal einen Artikel anlegen der dann zwischen Header und Footer ist
2 - In diesem Artikel dann einen Elementtyp "Text" einbetten:
> Die Überschrift h2 eintragen
> Den Text eintragen
> Als CSS-Klassen "rte-h2 rte-h2-top" eintragen
3 - Darunter dann einen Elementtyp ""Elementgruppe einbetten:
> Zur Übericht im Backend als Titel "Grid Container" eintragen
> Als CSS-Klasse "grid__container" eintragen
4 - Nun bei der soeben angelegten Elementgruppe auf das Icon für "Kindelemente ... anlegen" klicken
> Hier kannst du nun deine Schachteln anlegen indem du in der Kindelementeansicht nun
4.1 - Für jede deiner Gruppierungen (Bild, Überschrift, Link) einen Elementtyp ""Elementgruppe einbetten z.B. 3 Stück
(Alternativ nur eines anlegen, bearbeiten und anschließend kopieren und entsprechend nachbearbeiten)
> Zur Übericht im Backend als Titel "Grid Item" eintragen
> Als CSS-Klasse "grid__item" eintragen
4.2 - Nun in eines der soeben angelegten "Gruppen"-Elementgruppe auf das Icon für "Kindelemente ... anlegen" klicken
> Hier kannst du nun deine Gruppierung anlegen indem du in der Kindelementeansicht nun
4.2.1 - Einen Elementtyp "Bild", einen Elementtyp Überschrift und einen Elementtyp "Hyperlink" einbetten, was ja deine Gruppierung ist
Nun noch mit passendem CSS (grob so) designen und dann sollte es doch gehen und du kannst jede Gruppierung ein-/ausblenden usw.:HTML-Code:<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="generator" content="Contao Open Source CMS" />
<title>Titel</title>
<meta name="robots" content="noindex,nofollow" />
<meta name="description" content="" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,shrink-to-fit=no" />
<link rel="stylesheet" href="layout_default.css" />
</head>
<body>
<main>
<div id="article-3" class="mod_article block">
<div class="rte-h2 rte-h2-top content-text">
<h2>Lassen Sie den Alltag hinter sich...</h2>
<div class="rte">
<p>Und geniessen Sie eine entspannende Zeit beim Wellness- & Beautycenter.</p>
<p>
Erleben Sie neue und innovative Pflegekonzepte, kombiniert mit hochwirksamen und bestens verträglichen Produkten,
optimal abgestimmt auf den Hauttyp und Hautzustand jeden Alters.
</p>
<p>
Hier eine kurze Beschreibung zu den einzelnen Angeboten, genaue Informationen über die speziellen Körper- und
Gesichtsbehandlungen sowie die Zeitangaben.
</p>
</div>
</div>
<div class="grid__container content-element-group">
<div class="grid__item content-element-group">
<div class="content-image">
<figure>
<img src="/images/gesichtsbehandlung_02-ymr4gh1bswdf8d6.webp" alt="" width="362" height="163" />
</figure>
</div>
<h2 class="content-headline">Kosmetik</h2>
<div class="content-hyperlink">
<a href="/macpix" title="mehr ...">mehr ...</a>
</div>
</div>
<div class="grid__item content-element-group">
<div class="content-image">
<figure>
<img src="/images/opi-h-18pd4y8hkgz1v5g.webp" alt="" width="362" height="163" />
</figure>
</div>
<h2 class="content-headline">Kosmetik</h2>
<div class="content-hyperlink">
<a href="/macpix" title="mehr ...">mehr ...</a>
</div>
</div>
<div class="grid__item content-element-group">
<div class="content-image">
<figure>
<img src="/images/gesichtsbehandlung_02-ymr4gh1bswdf8d6.webp" alt="" width="362" height="163" />
</figure>
</div>
<h2 class="content-headline">Kosmetik</h2>
<div class="content-hyperlink">
<a href="/macpix" title="mehr ...">mehr ...</a>
</div>
</div>
</div>
</div>
</main>
</body>
</html>
HTML-Code:.rte-h2 {
margin: 0;
padding: 0;
}
.rte-h2 h2 {
font-family: "beauty_mountains";
margin: 0 auto;
}
.rte-h2 p {
margin-bottom: 16px;
}
.rte-h2-top {
max-width: 875px;
margin: 0 auto;
}
.rte-h2-top h2 {
margin-bottom: 30px;
}
.grid__container {
max-width: 1475px;
margin: auto;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(350px, 100%), 1fr));
gap: 1em;
}
.grid__item {
color: hsl(0, 0%, 95%);
background-color: hsl(0, 0%, 26%);
border-radius: 7px;
display: flex;
flex-direction: column;
flex-wrap: inherit;
justify-content: space-evenly;
align-items: center;
padding: 30px;
}
.grid__item img {
max-width: 100%;
height: auto;
}
DANKEEEEE wow ich versuche dies so wie Ihr beiden oder eher alle sagen umzubauen. Brauch leider da bisschen Zeit, da ich nicht der Profi bin wie ihr…Zitat:
Zitat von miniA4kuser
Ich sehe da kann man einiges an divs sparen. Muss auch viel umbauchen ;-) DANKE
UND AN ALLE HIER
DANKE - DANKE - DANKE
Und jetzt modifiziere dir noch das Element-Group Template und spare dir eine weitere Verschachtelung im Backend, da dies über das Element-Group Template das Grid außerhalb setzen würde (Gedankenexperiment).
Das macht mich jetzt leicht sprachlos - auf Deiner eigenen Website wirbst Du mit "Webdesign aus Leidenschaft" und schreibst weiter "Als unsere Kernaufgabe sind wir fokusiert speziell auf effiziente und optimierter Quellcode-Programmierung.", da erwarte ich einen Profi - übrigens erwarte ich das unabhängig vom Text auf der eigenen Webseite von jedem der Webdesign professionell anbietet.Zitat:
Zitat von MacPix
Die Seiten sind auch im umbau, mit den div war es füher anders und wenn man noch eine farbe als Hintergrund hatte mir Float dann weisst was ich meine. Klar gibt es grid/Flex nicht seit gestern. Das mit Profi mente ich auch auf Contao. Ist es auch alles zum Detail immer wieder neues und sauber aufbauen. Aber denke das gehört nicht hier in den Chat hier.Zitat:
Zitat von mlweb
Na dann warten wir mal auf deine Rückmeldung wie es so geklappt hat.Zitat:
Zitat von MacPix
Muss kurz schreiben ...
Ihr mit euren Gruppenelement in Contao.... Muss sagen einfach HAMMER COOL
Bin die ganze Webpage am ändern, ich brauche keine Templates mehr und weitere schöne Vorteile...
(Habe das mit Gruppenelemente in Contao gar nicht so gesehen)
DANKEEEEEEEE euch allen...
PS seit ihr sicher dass die Gruppenelemente weiter kommen? so kann ich weiter Pages so anpassen-