Robert asked 2 év ago Kedves WP szaki és WP közösség!
Rengeteg WP téma engedi a widgetben HTML kód futtatását. Én ezt arra használtam, hogy színátmentés gombot készítettem az inline CSS képességet felhasználva.
Kérdésem az volna, hogy miként lehetséges az, hogy ha a cursort felé viszem, akkor a tartalma megváltozzon, pl a színe. Tehát a CSS hover képességet szeretném használni, de inline CSS-ben ez nem működik, nem implementálható.
Mit javasoltok/javasolsz ennek a problémának a megoldására? Egyáltalán jó úton indultam el?
Köszönöm szépen a segítséget!
Robi
WPSzaki Staff answered 2 év ago Szia!
Igen, a widgetekben alapértelmezetten megengedett a HTML kódok használata, így az inline CSS is, viszont ezt nagyon nem szokták szeretni a fejlesztők, mert elég rossz szokás, nem eredményez szép kódot és a későbbi szerkesztést is nehezíti. Plusz ugye emellett felmerül az itt is említett probléma, azaz hover-t nem tudsz ilyen módon implementálni.
Ahhoz, hogy ez működhessen át kell alakítani a kódot és a CSS szabályokat vagy a sablon CSS fájljába kellene írni, vagy a WordPress beépített “egyedi CSS” részébe (Megjelenés / Testreszabás / További CSS).
Tehát ha ilyen egy inline CSS-t tartalmazó kód:
[a style="font-color:#fff;font-size:12px;font-weight:bold;"]Linkem[/a]
Akkor ennek adni kell egy class-t vagy ID-t és ehhez kell hozzárendelni a CSS szabályokat a fent említett helyek egyikén:
[a class="linkem"]Linkem[/a]
Az egyedi CSS részbe pedig mehetnek a szabályok:
.linkem {
font-color:#fff;
font-size:12px;
font-weight:bold;
}
Így már könnyedén tudsz adni hover-t is az elemnek:
.linkem:hover {
font-color:#000;
font-size:16px;
}