Cikkajánló
Egy újabb WordPress leírást hoztam. A WP-Polls szavazó bővítmény beállításáról és annak használatáról olvashatsz. A cikkben szó van a szavazó kinézetéről, magyarosításáról és arról is, hogyan tudod kódokkal az
Igazából nevezhetnénk ezt is Kiemelt képnek a blog modulban, de mivel a beállításai eltérőek és itt pont arra mentem rá, hogy háttérképeket jelenítsünk meg, aminek nem számít a kép
Igaz, mondhatni senki nem használja a címkéket a WordPress-ben, csak a kategóriákat. Pedig ennek a használatával pl. a Google keresőben még előrébb lehetne az oldal a találati listák között.
Emma Roberts G-Portálos téma Instagram doboz weboldalra Project dobozok és egy Elit csere effekt Elit csere effekt szöveggel és képekkel Lana Del Rey és Kylie Jenner G-Portálos témák
Eltérő linkelt képeffekt a Blogban

A blog modulban azt is meg lehet csinálni, hogy teljesen eltérő linkelt képet adtok meg. Vagy lehet eltérő sima link vagy a vastag, dőlt, aláhúzott stílus is lehet teljesen eltérő a blog modulban. Én most konkrétan a linkelt képekre térek ki, de a kód alatt azért hozok példát a többire is. Szóval, ha a linkelt képeket szeretnétek a blog modulban megváltoztatni, akkor ahhoz ez a CSS kód kell:

 

div[id*="post"] p a:link img, div[id*="post"] p a:visited img { /* linkelt kép a blogban */
background: #F0F0F0;
padding: 7px;
filter: alpha(opacity=70);
opacity: .7;
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}
div[id*="post"] p a:hover img { /* linkelt kép a blogban, ha ráviszed az egeret */
background: #E6E6E6;
padding: 7px;
filter: alpha(opacity=100);
opacity: 10;
-webkit-filter: grayscale(0);
filter: grayscale(0);
}

 

Itt ez a rész a fontos. Ezzel hivatkozik arra a CSS kód, hogy csak a blogban lévő linkelt képekre fog hatni. A többire nem. A div[id*=”post”] p kódrész az, amivel a blogra hivatkozik.

 

div[id*="post"] p a:link img, div[id*="post"] p a:visited img
div[id*="post"] p a:hover img

 

Sima képeknél így néz ki a kód:

 

div[id*="post"] p img
div[id*="post"] p img:hover

 

Vastag, dőlt, aláhúzott szavaknál így néz ki a kód:

 

div[id*="post"] p strong, div[id*="post"] p B
div[id*="post"] p EM, div[id*="post"] p I
div[id*="post"] p underline, div[id*="post"] p U

 

stb…

lindadesign Hozzászólások
503 megtekintés

Hozzászólások