gelöst Warenkorb Icon änden

Thema wurde von Mark_Oh, 19. September 2016 erstellt.

  1. Jan Brodowsky

    Jan Brodowsky Erfahrener Benutzer

    Bitte/danke
    HTML:
    {load_language_text section="box_cart"}
    
    <nav id="cart-container" class="navbar-cart" data-gambio-widget="menu cart_dropdown" data-menu-switch-element-position="false">
        <ul class="cart-container-inner">
            <li>
                <a href="{'shopping_cart.php'|xtc_href_link}" class="dropdown-toggle">
                    <span class="gm-cart-basket">
                            <img src="{$tpl_path}assets/images/icons/basket-gift.png"
    </span>
                    <span class="cart">
                        {$txt.heading_cart}<br />
                        <span class="products">
                            {$TOTAL}
                        </span>
                    </span>
                    <span class="cart-products-count{if $productsCount == 0} hidden{/if}">
                        {$productsCount}
                    </span>
                </a>
                ###SHOPPING_CART_DROPDOWN###
            </li>
        </ul>
    </nav>
    Code:
    @media (min-width: $grid-float-breakpoint) {
        #outer-wrapper {
            @include border-radius(10px);
            @include box-shadow(0 0 10px rgba(0, 0, 0, .3));
        }
       
        #header {
            background: transparent;
        }
        #topbar-container {
            background: transparent;
            margin-top: -30px;
            @include border-top-radius(10px);
            .navbar-topbar {
                margin-right: 30px;
            }
        }
        #footer {
            @include border-bottom-radius(10px);
        }
    #header.navbar  {
            background: url('https://aloha-bowling.de/shop/gx2/headermas.jpg');
              background-repeat: no-repeat;
            border-top-right-radius: 0px;
            border-top-left-radius: 10px;
        }
    #mc_embed_signup    {
          background:transparent; clear:right; font:10px Helvetica,Arial,sans-serif;
          width: 25em;
      }
                   
    }
    
    @media (min-width:768px){
    .gm-cart-basket:before {
        content: '';
    }}
    @media (max-width:767px){
    .gm-cart-basket:before {
        content: '\e80c';
    }}
    
    
    Danke schon mal für Deine Mühen
     
  2. barbara

    barbara G-WARD 2014-2020

    Ich sagte doch, da fehlt eine schließende Klammer :D
    Code:
     <img src="{$tpl_path}assets/images/icons/basket-gift.png"
    setzte da am Ende mal ein ">"

    Ich habe aber gerade gesehen, das die bei mir auch gefehlt hat - :oops:
     
  3. Jan Brodowsky

    Jan Brodowsky Erfahrener Benutzer

    Fast perfekt :) hab alle caches (browser & Shop) geleert, dennoch bleibt das alte Warenkorb Symbol erhalten.
    Ich habe es jetzt im StyleEdit transparent gemacht und nun gefällt und passt es.
    @barbara : Vielen, vielen Dank für den schnellen und guten Support!
     
  4. ruben_calabrese

    ruben_calabrese Neues Mitglied

    Hallo Zusammen, ich bin ein richtig schlimmer Anfänger. Ich habe überhaupt keinen Plan von CSS oder HTML.

    Ich habe mich in Filezilla eingelogt jetzt bin ich bei der datei box_cart_head.html

    Die Datei Box_cart_head.html konnte ich nun ändern, das icon habe ich auch in den richtigen ordner gespeichert. Was muss ich jetzt noch tun

    Kann mir jemand eine Anleitung für Dummies geben?

    Meine Seite: www.califashion.ch
     
    Zuletzt bearbeitet: 8. Dezember 2016
  5. thomasgabriel

    thomasgabriel Mitglied

    Danke, Barbara!!! :)
     
  6. gkwachau

    gkwachau Aktives Mitglied

    Hallo,

    Verwende die Lösung von Communicate:
    Erste Frage: woher kommen: fa-shopping-cart ??? ist ja eine Schrift / gibt's noch andere ?? ?
    danke
    mfg
     
    Zuletzt bearbeitet: 8. Januar 2017
  7. barbara

    barbara G-WARD 2014-2020

    ich glaube ich verstehe die Frage nicht.
     
  8. Anonymous

    Anonymous Administrator Mitarbeiter

    Hi,

    Man kann das Icon des Warenkorb-DropDown Menüs verändern, indem man folgende CSS im StyleEdit3 als eigene CSS hinzufügt:

    Code:
    .gm-cart-basket::before
    {
        content: '\f290' !important;
        font-family: FontAwesome !important;
    }
    Welches Icon angezeigt werden soll, kann über die Seite
    https://fortawesome.github.io/Font-Awesome/icons/ gesucht werden, wenn das Icon aufgerufen wird, kopiert man die Nummer die bei Unicode steht, z.B. f290. Diese trägt man dann wie oben gezeigt bei content mit einen \ vor dem f ein.
    Damit wird dann nach dem klicken auf Vorschau auch schon das neue Icon angezeigt.

    Für alle anderen die ein Bild statt CSS Icon einfügen möchten, ist leider oder oben beschriebene Weg über die Anpassung der HTML Datei nötig.
     
  9. gkwachau

    gkwachau Aktives Mitglied

    naja ich habe das Warenkorb Icon geändert wie es Communicate erklärt hat:
    <i class="gm-cart-basket"></i>
    ändern in:
    HTML:
    <i class="fa fa-shopping-cart fa-3x"></i>
    usw. (sein Eintrag vom15.10.2016)
    also meine Frage: fa fa-shopping-cart ergibt einen anderen Warenkorb als der Originale
    der in Gambio-SHop angegeben war ...
    als das ist alles eine SChriftart und nun würde ich gerne wissen
    ob es da auch noch andere gibt al: fa fa-shopping-cart ODER wie das läuft ?
    danke
    mfg
     
  10. gkwachau

    gkwachau Aktives Mitglied

    AAHH Sehr schön Danke Till
     
  11. Anonymous

    Anonymous Erfahrener Benutzer

    Hey zusammen, habe mich an die Anleitung gehalten aber bei mir wird der Warenkorb auf 90x90px vergrößert/verkleinert egal, wie groß das Bild ist, dass ich einspiele (hier 48x48px). wie kann ich das denn abstellen?

    upload_2017-3-15_19-51-56.png
     
  12. barbara

    barbara G-WARD 2014-2020

    Dazu braucht man einen Link zum Shop, damit man schauen kann wo die 90px herkommen.
     
  13. Anonymous

    Anonymous Erfahrener Benutzer

    Geht leider immernoch nicht solange der Shop offline ist...

    Aber kann man denn nicht dem Bild im html die Größe vorschreiben?
    Bloss funktioniert nichts von den Codes, bzw. bin ich nicht in der Lage diese Korrekt anzugeben.
     
  14. barbara

    barbara G-WARD 2014-2020

    Lege einen Testkunden an und verschiebe den in die Kundengruppe "Gast"
    Dann gibst Du dem Kunden nur das Recht den Shop zu sehen.

    Normalerweise wird das Bild in der vorhandenen Größe genommen.
    Wenn Dein bild nur 45 x 45px groß ist, müsste es auch in 45 x 45px angezeigt werden.
    Irgendwo steht demnach ein Code, der das Bild auf 90px setzt.

    Nachtrag:
    hast Du nach dem Ändern des Bildes die Cache (auch vom Browser) geleert?
     
  15. Anonymous

    Anonymous Erfahrener Benutzer

    upload_2017-3-16_7-0-40.png

    den Cache im Shop ja, aber manchmal muss ich wie hier den kompletten Firefox bereinigen :-(

    Sry und danke für deine Mühe!
     
  16. barbara

    barbara G-WARD 2014-2020

    Ja, das was gut für die Ladezeit ist, kann einen beim Stylen in den Wahnsinn treiben :D
     
  17. tierurnen-profi.de

    tierurnen-profi.de Erfahrener Benutzer

     
  18. barbara

    barbara G-WARD 2014-2020

    Du kannst einem Gast keine Admin-Rechte geben.
    Lege einen neuen Kunden (als neukunde, nciht als Gast) an, verschiebe ihn in die Kundengruppe Admin und lege fest welche Rechte er haben soll.
     
  19. Holzstaub

    Holzstaub Mitglied

    Guten Abend,
    meine Frage,
    das css einfach als Usermod.hmtl speichern und in den css Ordner hochladen?
     
  20. Jein, als z.B mein.css im /css Ordner hochladen/speichern und dann Cache leeren.