Ändra färg på ”Gilla-knappen” på blogg.se

Blogg.se har lagt in en egen Gilla-knapp som du kan addera till din blogg om du så vill. Denna Gilla-knapp finns i lite olika färger, men vi har tipset som du garanterat kommer älska – du kan nämligen ändra färgen så att den matchar resten av färgerna på din blogg!

Lägg in detta längst ner i din stilmall:

.like-container .likebtn .likebtn__btn { /* Ändrar utseendet på "Gilladelen" */ background: #000 !important; font-family: Arial, Helvetica, sans-serif !important; border: solid 1px rgba(0, 0, 0, 0.2); border-radius: 3px; box-shadow: inset 0 1px 3px rgba(255, 255, 255, 0.3), 0 1px 3px rgba(0, 0, 0, 0.15); color: #fff !important; display: inline-block; font-size: 13px; font-weight: bold; padding: 4px 10px 3px; text-align: center; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4); text-decoration: none !important; text-transform: capitalize; letter-spacing: 0.2px; }
.likebtn.liked .likebtn__btn { /* Ändrar utseendet på "Gilladelen" när en klickat "Gilla" */ background-color: #fff !important; }
.likebtn__count { /* Ändrar utseendet på "Nummerdelen" */ background-color: #fff; border: solid 1px #a5b1bd; border-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15); color: #424a4d; float: left; font-weight: bold; margin-right: 10px; padding: 5px 10px; position: relative; text-align: center; line-height: 17px; font-size: 13px; }

Som ni ser så finns det alltså tre olika klasser som styr detta (det finns fler, men vi kör såhär så länge, då dessa är lättast ändra.
Det går att ändra det mesta, och vill du ta bort någon finess eller något i utseendet, ta inte bort det i koden, utan skriv kort och gott 0px eller none. För att ta bort skuggan till exempel, så kan du helt enkelt skriva ordet none som värde för box-shadow & text-shadow. Vill du ändra rundningen av kanterna så skriver du 0px som värde för border-radius.

Värt att nämna är också att de har använt rgba()-värden för färger här, men det går bra att ändra det till en hexfärg (alltså hashtag-färgkod = #000 för svart till exempel). I övrigt är det bara att pyssla på med dina egna värden och egenskaper.

The post Ändra färg på ”Gilla-knappen” på blogg.se appeared first on Bloggdesign | Designa Din Blogg.