DBzP#5 Jak znaleźć id gadżetu?

Heii!

To już (a może dopiero) piąty post z serii DBzP. Tym razem pokażę Wam jak w kodzie HTML bloga znaleźć id gadżetu, który jest potrzebny do np. kodu CSS na rozwijany gadżet. Może brzmi to skomplikowanie, ale w rzeczywistości jest bardzo proste.


1.Wchodzimy w 'Szablon', a następnie naciskamy 'Edytuj kod HTML'.

 2. Następnie w kodzie wyszukaj id (szukaj ich przy tych czarnych strzałkach). Moja rada: gadżet, którego id chcesz znaleźć, wstaw na sam dół w 'Układzie' bloga. Dzięki temu szybciej znajdziesz id - wystarczy zjechać suwakiem na sam dół i poszukać odpowiedniej linijki. Id znajdziesz po nazwie gadżetu. Mój ma nazwę 'Popularne posty', a jego id to PopularPosts1 :)

Skoro już wiecie jak znaleźć id, pokażę Wam kod CSS na rozwijany widżet, który będzieice musieli uzupełnić własnymi 'danymi'. 

#id .widget-content {
   height: 45px; /*schowanie widżetu*/
   overflow: hidden;
   transition: height .7s ease; /*animacja*/
   -webkit-transition: height .7s ease;
   -moz-transition: height .7s ease;
   -o-transition: height .7s ease;
   -ms-transition: height .7s ease;
}

#id:hover .widget-content {
   height: 280px; /*wysokość docelowa widżetu*/

}

W miejscu id wpiszcie odpowiednią nazwę. Cała reszta jest gotowa, ale oczywiście wartości możecie zmieniać :)

(Jeżeli ktoś z Was nie wie, gdzie wkleić gotowy kod - zapraszam tu).