Hintergrundbild der horizontalen Kategoriespalte

Thema wurde von claudia_rumpf, 27. Januar 2021 erstellt.

  1. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    Hallo, ich habe ein Hintergrundbild für die horizontale Kategoriespalte eingefügt, dass sie "eingerahmt" ist. Das gefiel mir optisch für die Desktop-Ansicht besser. Jetzt befinden sich die Striche des "Rahmens" aber wahllos in der mobilen Version im Menü. Ist es möglich, das Bild lediglich in der Desktop Version anzeigen zu lassen und in der mobilen Version auszublenden?

    LG
     
  2. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Ich weiß ja nicht wie Dein Rahmen aussieht, aber wenn es nur eingerahmt werden soll, würde ich kein Bild laden, sondern per css einen Rahmen darum setzen.
     
  3. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    So sieht mein Rahmen aus.

    Wie kann ich denn einen Rahmen per CSS darum setzen? Das wäre eine super Idee
     

    Anhänge:

  4. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Wenn du das im eigenen css eingibst:
    Code:
    @media (min-width: 768px){
    .navbar-collapse .navbar-categories ul.navbar-nav {
        border-bottom: 2px solid #663300;
        border-top: 2px solid #663300;
    }}
    müsste das so aussehen:
    Unbenannt.JPG

    Farb-Code und Stärke musst du nach Deinen Wünschen ändern.

    ist aber nur bei den Menüpunkten.
    Wenn die Linien über die ganze Breite gehen sollen, wäre der Code etwas anders.
     
  5. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    Danke, das hat geklappt! Allerdings ist jetzt der untere Strich in meinem Header.. ist es möglich die Striche etwas näher an die Kategoriewörter (Wein..Grappa..etc) heranzusetzen?

    Und wie wäre der Code, wenn es über die gesamte Breite gehen soll?
     
  6. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Das müsste ich mir dann mal bei Dir direkt ansehen.
     
  7. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    ja, gerne. Was brauchst du dafür?
     
  8. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Nur einen Link zu Deiner Seite, wenn diese online ist.
     
  9. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    ist sie leider noch nicht.
     
  10. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    der Shop ist jetzt online: https://casa-olivino.gambiocloud.com
     
  11. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Ändere den oben genannten Code mal in:
    Code:
    @media (min-width: 768px){
    #header .navbar-categories {
        height: 45px !important;
        border-bottom: 2px solid #881538;
        border-top: 2px solid #881538;
    }}
    sollte sich die Höhe damit nicht anpassen, müsstest Du die Höhe der Kategorie-Leiste im style Editor ändern
    und die Zeile "height:...." hier raus nehmen.
     
  12. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    Super danke!

    Kannst du mir auch noch sagen, wieso die Formatierung des Dropdown-Menüs nicht immer klappt? Ich habe im Style-Editor die Anzahl der Blöcke auf 4 gesetzt. In der normalen Shopansicht wird mir das auch dann richtig angezeigt. Allerdings nicht in der Vorschau im StyleEditor und auch nicht wenn wir über einen Asus Laptop über Google Chrome auf den Shop gehen. Woran liegt das?

    Ich füge die Bilder mal zum Vergleichen bei.
     

    Anhänge:

  13. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Das liegt an den Gridspalten / Bildschirmbreite - Bildschirmauflösung
    Im Style Editor ist die Breite nicht = PC, sondern eher Tablet und ein kleinerer Laptop könnte auch unterhalb der Grenze liegen.
     
  14. claudia_rumpf

    claudia_rumpf Mitglied

    Registriert seit:
    28. Oktober 2020
    Beiträge:
    13
    Danke erhalten:
    0
    Danke vergeben:
    6
    und wie kann ich das jeweils beeinflussen?
     
  15. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Du hast eine Breite pro Block von 180px
    ab 1400px Bildschirmbreite passt das - unter 1400px ist die Dropdown-Box aber nicht groß genug.
    zwischen 768px und 1399px ist das Dropdown bei Dir nur 713px breit.
    Das reicht nicht für 4x 180px
    das reicht nur für 4 x 177 - 178px
    Wenn Du die Größe der Blöcke ein bisschen kleiner machst, sollte es passen.