Sziasztok!
Megint volna egy kérdésem. Hogy tudnám lecserélni a kis » jeleket különbféle ikonokra? Nagyjából mindenhova különböző kis ikont szeretnék rakni (kategóriák, archívum, stb). Az ikonokat a szerveren helyzném el .png kiterjesztésben.
Előre is köszi!
http://categoryicons.wordpress.com/ Nem tudom, ezt a plugint próbáltad-e, vagy erre gondoltál-e ?
Üdvözlettel:
Nem igazán erre gondoltam. Ha megnézem a Widgetek között, akkor az alábbi kód “felelős” a kis » megjelenéséért.
Code:
Na én ezeket a kis nyilakat szeretném helyettesíteni iconokkal. Néhány sablonnál nem nyilak vannak azonos kódnál, hanem adott iconok. Példának kapásból tudnám a Tutorial.hu oldalsávját hozni.
Sajnos, amit mutattál plugint csak a kategóriáknál rendezné át.
Én manuálsian szeretném. Remélem érthetően fogalmaztam. :)
Előre is köszi!
CSS, valahogy így:
li
{
background-image: url(http://eleresiut/li.png);
background-repeat: no-repeat;
background-position: 3px;
padding-top: 2px;
padding-bottom: 2px;
padding-right: 0px;
padding-left: 12px;
margin: 0;
}
Ez nem lesz jó.
Nem kell a defaultot használni, és akkor nem lesznek rusnya kis nyilacskák. Különben a style.css-ben van, a Begin Lists fejezet alatt a 406-407. sorban (WP 2.5.1)
Code:
.entry ul li:before, #sidebar ul ul li:before {
content: "00BB 0020";
}
content: "00BB 0020";
}
More: http://www.fileformat.info/info/unicode/char/00bb/index.htm
Valahogy így szeretném megvalósítani (ez csak egy photoshopban összeállított kép):
moshu amit te írsz nekem picit kínai. De azért átrágom, de gondolom nem az lesz a megoldás.
Ha “kínai”, akkor keress egy olyan sablont, ami megcsinálja, amit akarsz, indulásból. Akinek kínai a CSS, az soha nem nyúljon a default sablonhoz, mert az egy bestia, és nem kezdőknek való.
Én megmondtam, HOL van az, amit nem szeretsz, mano megmondta, hogy MIVEL helyettesítsd, ha saját image-t akarsz a lista elemekhez…
Mi köll még?
Mano megoldása nem volt jó! Te viszont jó helyen kutakodtál.
Ezt módosítottam:
Code:
.entry ul li:before, #sidebar ul ul li:before {
content: "00BB 0020";
}
content: "00BB 0020";
}
Erre:
Code:
.entry ul li:before, #sidebar ul ul li:before {
content: url(/wp-content/icons/tag_green.png);
}
content: url(/wp-content/icons/tag_green.png);
}
Ezzel sikerült elérnem, hogy megjelenjenek az ikonok. De én azt szeretném elérni, amit a képen látsz. Arra van esetleg tipp?
Ui.: Azért örülnék, ha nem néznéd 100% hülyének az embert. Mindenki elkezdi valahol...
Hello!
az oldalad sidebar-ja jeleneleg a következőképp fest:
Code:
Nos egyszerűen a style.css-edben az egyes csoportok felsorolásánál így hívd meg őket:
#sidebar ul .widget_categories ul{
list-style-image: url('kep1.png');
}
#sidebar ul .widget_archives ul{
list-style-image: url('kep2.png');
}
ez egy ötlet remélem működik neked..
Sajnos nem találok “egyes csoport felsorolást” a stly.css-ben. Találtam közben egy plugint, ami ilyen dologra hivatott, de az oldalsávban az istenért nem akar dolgozni. A plugin neve File Icons.
'» wrote:
Sajnos nem találok "egyes csoport felsorolást" a stly.css-ben. Találtam közben egy plugint' date=' ami ilyen dologra hivatott, de az oldalsávban az istenért nem akar dolgozni. A plugin neve File Icons.
Egyes csoportoknak én azokat az egységeket becézgettem aminként te külön képeket akarsz adni például archívok kategóriák stb kutyafule.. ezekre a hivatkozást a megfelelő classból szedd ki pld a következő a "widget_pages".. a style.cssben pedig nemvalószínű hogy találnál rá bármit is ha a sablonodban nincsenek külön wisgetek is beállítgatva.. tehát ezeket neked kell beszúrnod.. :)
remélem érthetőbb..
meg lehet ezt oldani csak css segítségével, a jelenlegi template-t néztem meg kódra, hogy van megoldva.
Ha megnézed, hogy most az egyes blokkok (kategóriák, arhivum, oldalak stb.) hol szerepelnek a kódban, akkor látható, hogy mindegyik egy ID-vel ellátott tag-ben van, amely segítségével már megírható a css.
pl.
Code:
li#categories-1 ul li.cat-item {}
li#archives ul li {}
li#pages ul li.page_item {}
li#recent-comments ul#recentcomments li.recentcomments {}
li#archives ul li {}
li#pages ul li.page_item {}
li#recent-comments ul#recentcomments li.recentcomments {}
stb...
Ãgy írd meg a css kódot a #4 hozzászólásban ismertetett módon.
Megírtam a css-t, és elmentettem egy külön fájlba: icon.css néven.
Próbáltam rá így hivatkozni:
Code:
.entry ul li:before, #sidebar ul ul li:before {
content: url(http://milho.extra.hu/wp-content/themes/milho/icon.css);
}
content: url(http://milho.extra.hu/wp-content/themes/milho/icon.css);
}
De sajnos így nem működik. Gondolom nem jól csináltam, azért. :) Vagy egyáltalán jól írtam meg a css-t? Lehet félreértettem valamit...
Vagy nem külön css fájlba kellene mentenem, hanem a style.css fájlon belül kellene beszúrni valahova? Ha igen hova?
@import url(‘icon.css’);
ezt szúrd be a style.css elejére…
Sikerült, köszönöm. Már csak azzal szívok, hogy néhány widgetnél nem hajlandó reagálni az alábbi megadott értékre:
Code:
padding-left: 22px;
nekem a következő kis “csalással” sikerült:
Code:
.kateg li a{
background: url('icons/flag_green.png') no-repeat left;
margin-left: -20px;
padding-left:20px;
}
background: url('icons/flag_green.png') no-repeat left;
margin-left: -20px;
padding-left:20px;
}
Tehát nem a listaelemeknek, hanem a bennük lévő hivatkozásoknak adom a paddingot..
Megpróbáltam, de így sem akarnak odébbmenni azok a nyamvadt ikonok. 
Sajnos még mindig nem találtam a behúzásra megoldást. Valaki valamit esetleg? :o
Hello!
Firefox alatt sem működött? nekem csak IE alatt szórakozott mint most láttam… Nos íme a megoldás:
Code:
/*
29es kategória
*/
.kateg a{
background: url('icons/csillag.png') no-repeat left;
margin-left: -21px;
padding-left:20px;
}
.kateg {
list-style-image:none;
}
29es kategória
*/
.kateg a{
background: url('icons/csillag.png') no-repeat left;
margin-left: -21px;
padding-left:20px;
}
.kateg {
list-style-image:none;
}
Az eltérés annyi, h a marginnal meg a paddingal játszani kell egy kicsit a saját designedhez és ne legyenek ugyanakkorák mert azt explorer valamiert nem birja..
itt látható működés közben(ff opera ie 6,7)(http://regos.hu/beta)