Jak spersonalizować LinkWithin? Cz. 2

LinkWithin to bardzo przydatne narzędzie - o tym jak go zainstalować i do czego służy można przeczytać TUTAJ
Pierwsza część kodów, które zmieniają wygląd widgetu TUTAJ

Dzisiaj kolejna porcja przydatnych kodów.
Wchodzimy w edycję HTML

Przypominam, że można użyć wszystkich a można tylko jednego - do wyboru do koloru. Każdy kod musi być wklejony w sekcji CSS czyli przed znacznikiem 

]]></b:skin>

 Zmiany jakie wprowadzają dane kody postaram się pokazać obrazkowo. Obraz pod tytułem "Tak było" to obraz zawsze standardowy - przed jakimikolwiek zmianami.

1. Poniższy kod zmienia ramkę obrazka, poniższa 2px to grubość ramki, natomiast zamiast ZZZZZZ wstawiamy wybrany kolor.

.linkwithin_img_0 {
border: 2px solid #ZZZZZZ!important; padding:2px !important; width:100px!important; height:100px!important;
} 

2. Kolejna możliwość to zmiana ramki ale po najechaniu myszką, 2px to grubość ramki, natomiast zamiast XXXXXX wstawiamy wybrany kolor.

.linkwithin_img_0:hover {
border: 2px solid #XXXXXX !important; padding:2px !important;
}

3. Tutaj możemy zmienić kolor linku - tytułu posta na kolor YYYYYY, zmienić wielkość czcionki i styl

.linkwithin_title {
color:#YYYYYY !important;
font-family:'tahoma', sans-serif !important;
font-size:11px !important;
text-align:center !important;
line-height:14px !important;
text-decoration: none;
border-top:1px solid #ddd !important;
}

 4. Kolejny kod dotyczy pozwoli na wyśrodkowanie widgetu:

.linkwithin_inner {
margin: 0 auto !important;
}

 5. Kolejny kod nadaje obrazkom kształt od zaokrąglonych rogów po koło, im wyższa wartość tym bliżej koła,

.linkwithin_posts a div {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

 Powodzenia :)