Hallo, da ich die Social Media Buttons in den Testshops von Gambio so schick finde möchte ich sie gern in meinen Shop integrieren. Eine " einfache Möglichkeit" mittels Style Edit gibt es ja leider nicht. Im Forum und den Tutorials habe ich einige Anleitungen gefunden und den Code in meinen Footer kopiert. Eigentlich funktioniert auch alles, nur werden die Icons als Eier und nicht als Kreise dargestellt. Das sind der Code den ich im Gambio Tutorial gefunden und eingefügt habe. Ich habe in nur ergänzt damit die Zielseite in einem neuen Fenster aufgeht. Folgen Sie uns:<br /> <br /> <ul class="social-media-icons"> <li><a class="facebook" href="(Link nur für registrierte Nutzer sichtbar.)"><i class="fa fa-facebook-f" target="_blank"></i></a></li> <li><a class="instagram" href="(Link nur für registrierte Nutzer sichtbar.)"><i class="fa fa-instagram" target="_blank"></i></a></li> </ul> Kann und möchte jemand helfen?
Ich habe meine so eigebunden, vielleicht hilft es ja.Wenn sie etwas kleiner sein sollen, dann 2x . Code: <div style="text-align: center;"> <div id="socialicons"> <a class="icon" href="https://twitter.com/xxxxxxxxx" rel="noopener" target="blank" title="Folgt mir auf Twitter"><i aria-hidden="true" class="fab fa-twitter-square fa-3x" style="color:#00aced;"></i></a> <a class="icon" href="https://www.facebook.com/xxxxxxxxxxx" rel="noopener" target="blank" title="Folgt mir auf Facebook"><i aria-hidden="true" class="fab fa-facebook-square fa-3x" style="color:#3b5998;"></i></a> <a class="icon" href="https://www.instagram.com/xxxxxx" rel="noopener" target="blank" title="Folgt mir auf Instagram"><i aria-hidden="true" class="fab fa-instagram fa-3x" style="color:#a94442;"></i></a>
Im StyleEdit als eigenes CSS... Wenn sie genauso hoch sein sollen, wie sie jetzt breit sind: Code: #footer .inside .row .footer-col-4 ul.social-media-icons > li a { font-size: 1em; } Wenn sie so breit sein sollen, wie sie jetzt hoch sind: Code: #footer .inside .row .footer-col-4 ul.social-media-icons > li a { width:50px; height:50px; }
Danke, hat funktioniert. Weißt du auch warum die beiden Icons nicht genau in einer Zeile stehen? Das zweite ist um einige Millimeter nach unten versetzt. Das ist jetzt nicht weiter schlimm, aber nicht perfekt.
Das wäre mir nicht aufgefallen ;-) Das hier sollte es vereinheitlichen: Code: #footer .panel .panel-body .social-media-icons li:first-child { padding: 2px 10px 2px 0; }