Autor Zpráva
MartaNov
Profil
Je možné přes CSS změnit v následujícím kódu ikonu vozík (fa-shopping-cart) na ikonu košík (fa-shopping-bag)? Prosím o radu...
<i class="fa fa-shopping-cart fa-lg" aria-hidden="true"></i>
Radek9
Profil
MartaNov:
Proč přes CSS? Je problém ji změnit v HTML?
MartaNov
Profil
Radek9:
Bohužel nemohu přepsat html kód, ale mohu ho vložením vlastního kódu do administrace e-shopové platformy změnit. Dosud mi stačilo jednoduché CSS např. display: none, když jsem potřebovala něco na e-shopu skrýt. Tady bych potřebovala ikonu nahradit a na to mé velmi omezené znalostí kódování bohužel nestačí. Proběhl i pokus typu - skrýt .fa.fa-shopping-cart.fa-lg a vložit novou ikonu přes background-image: url("/eshop/nazevsouboru.svg"), ale není to graficky dokonalé.
Tomáš123
Profil
MartaNov:
Tá ikona .fa-shopping-cart asi bude mať niekde v CSS nastavené niečo ako content: '/0738';. Je to kód toho symbolu v rámci nejakého ikonkového fontu. Často je to nastavené podobným spôsobom.

Tú číselnú hodnotu potrebuješ zmeniť na číselnú hodnotu ikonky .fa-shopping-bag. Pozor, aby si použila dosť konkrétny selektor a nezmenila všetky ikonky. Ak nejde o ikonkový font alebo si nevieš rady, prilož, prosím, odkaz na živú ukážku.
MartaNov
Profil
Podařilo se mi vložit nový content - ale bohužel ne jako číselný kód ikony tašky, ale jako jako odkaz na soubor .svg
.fa-shopping-cart:before {content: url("/shop-data/icon/icon-cart-default-black.svg");}

Pokud by existovala možnost vložení správného funkčního číselného kódu (zkoušela jsem "f290" ale to mi nefungovalo...), tak bych byla vděčná za radu. Zde link: www.deelive.cz
Radek9
Profil
MartaNov:
#userCart .fa-shopping-cart::before {
  content: "\f290";
}
MartaNov
Profil
Super! A přitom chyběla taková "drobnost" tj. zpětné lomítko. Teď je to mnohem lepší. Ještě jednou děkuji.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0