Malibu - Hintergrundbild nur am Rand

Thema wurde von mastavit, 17. März 2023 erstellt.

  1. mastavit

    mastavit Aktives Mitglied

    Registriert seit:
    7. Dezember 2022
    Beiträge:
    31
    Danke erhalten:
    1
    Danke vergeben:
    11
    Hallo zusammen,

    wie kann ich ein Hintergrundbild im Mailbu Theme nur am Rand und im Footer Bereich anzeigen lassen?
    Wie unten im Bild möchte ich über den kompletten Contentbereich ein Hintergrundbild an den Seite leicht durchschimmern lassen?

    Kann man vielleicht ein Hintergrundbild komplett hinterlegen und mittels css oder so nur am Rand darstellen?

    hintergrund.PNG

    Über den Styleedit kann man ja ein Hintergrund für den Container hinterlegen aber das gilt dann auch für den mittleren Bereich
     
  2. ingo_scharp

    ingo_scharp Erfahrener Benutzer

    Registriert seit:
    5. September 2018
    Beiträge:
    274
    Danke erhalten:
    65
    Danke vergeben:
    80
    Um etwas durchschimmern zu lassen musst du transparente Farben verwenden.
    Das sind HSLA Farben, die du direkt eingeben musst.
    Hasla Farben
    hsla(125,50%,80%,0.5)

    zusätzliche Alphakanal Angabe zum HSL-Wert, zur Regelung der Deckkraft der
    Farbe( a/ 0.0 = transparent, a/ 1.0 = opak, Werte von 0.0 - 1.0 können verwendet werden)

    Die HSLA-Schreibweise definiert Farben über Werte für Hue (Farbton), Saturation (Sättigung), Lightness (Helligkeit) und Alpha (Transparenz).

    Farbton 0 - 360
    Regenbogenbogenfarben in einem Kreis angeordnet sind. 0 entspricht Rot, 120 entspricht grün, 240 entspricht blau und 360 entspricht wieder Rot.

    Wir verwenden diese unter Honeygrid
     
  3. mastavit

    mastavit Aktives Mitglied

    Registriert seit:
    7. Dezember 2022
    Beiträge:
    31
    Danke erhalten:
    1
    Danke vergeben:
    11
    Vielen Dank für deine Rückmeldung. Aber wo muss ich das im Theme denn hinterlegen?
    Das mit dem durschschimmern habe ich hinbekommen aber ich möchte ja das der innere Bereich (Content) einen weißen Hintergrund behält und nur am Rand das Hintergrundbild erscheint.
     
  4. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.546
    Danke erhalten:
    11.305
    Danke vergeben:
    1.612
    Versuche es mit
    Code:
    #wrapper #main  {
    background-color: #fff;
    }
    im eigenen css
     
  5. mastavit

    mastavit Aktives Mitglied

    Registriert seit:
    7. Dezember 2022
    Beiträge:
    31
    Danke erhalten:
    1
    Danke vergeben:
    11
    Wenn ich das eintrage ist der Rand ebenfalls wieder weiß.
     
  6. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.881
    Danke erhalten:
    786
    Danke vergeben:
    296
    #6 Anonymous, 22. März 2023
    Zuletzt bearbeitet: 22. März 2023
    Wenn du bei Bereiche > Layout > Varianten "Boxed" nimmst geht der Hintergrund auch neben den Header und Footer.
     
  7. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.546
    Danke erhalten:
    11.305
    Danke vergeben:
    1.612
    Auf der Startseite, oder überall?

    Das Malibu ist da tricky, die Startseite besteht aus einzelnen Widgets, eventuell musst du hier überall die Hintergrundfarbe
    in der sektion einstellen.
     
  8. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.881
    Danke erhalten:
    786
    Danke vergeben:
    296
    #8 Anonymous, 22. März 2023
    Zuletzt bearbeitet: 22. März 2023
    Nimm die "boxed" Variante. Lade dann bei "Grundlagen > Hintergrund" dein Bild hoch.
    Dann kannst du den Footer bei "Bereiche > Footer > Standard > Footer Body" auf Hintergrund durchsichtig stellen.
    Dann gehst in jede Sektion und stellst die Hintergrundfarbe auf weiß.
     
  9. mastavit

    mastavit Aktives Mitglied

    Registriert seit:
    7. Dezember 2022
    Beiträge:
    31
    Danke erhalten:
    1
    Danke vergeben:
    11
    Nee die "boxed" Variante gefällt uns nicht wirklich. Wir möchten ja weiterhin das der Header und Footer bereich nicht im Boxedmodus ist.
     
  10. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    5. Mai 2022
    Beiträge:
    1.881
    Danke erhalten:
    786
    Danke vergeben:
    296
    #10 Anonymous, 22. März 2023
    Zuletzt bearbeitet: 22. März 2023
    dann mach das Hintergrundbild in den Containerbereich. und dann gehst du in jede Spalte und stellst den Hintergrund auf weiß. Und dann auf Vorschau klicken.

    Nachtrag: geht nur wenn du nur eine Sektion hast....