Designhjälp för din blogg

Dela dina inlägg på facebook & twitter

Kategori: Roligheter
 
Dessa share buttons kan du nu ha på på din blogg om du vill dela ett specifikt inlägg på facebook eller twitter!
 

1. Gå in i din HTLM-mall (Kugghjulet -> Design -> Redigera HTML (Startsida))

2. Leta upp <div class="entrymeta"> och kopiera och klistra in följande precis under:

<div class="social">
<a href="{{ entry.facebook_share }}" alt="Dela på Facebook"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve"><path d="M12,0.001c-6.627,0-12,5.373-12,12C0,18.629,5.373,24,12,24s12-5.371,12-11.999 C24,5.374,18.628,0.001,12,0.001z M16.787,9.923l-0.168,2.187h-2.242v7.6h-2.834v-7.6H10.03V9.923h1.513V9.237V8.564V8.452 c0-0.647,0.016-1.646,0.487-2.266c0.495-0.655,1.176-1.101,2.347-1.101c1.906,0,2.711,0.272,2.711,0.272l-0.379,2.24 c0,0-0.631-0.182-1.217-0.182c-0.59,0-1.115,0.21-1.115,0.798v0.238v0.785v0.686H16.787z"/></svg></a>
<a href="{{ entry.twitter_share }}" alt="Dela på Twitter"><svg xml:space="preserve" enable-background="new 2.766 0 24 24" viewBox="2.766 0 24 24" height="24px" width="24px" x="0px" y="0px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M14.766,0c-6.627,0-12,5.373-12,12c0,6.627,5.373,12,12,12s12-5.373,12-12C26.766,5.373,21.393,0,14.766,0z M20.513,9.72c0.004,0.116,0.006,0.233,0.006,0.351c0,3.585-2.728,7.719-7.719,7.719c-1.532,0-2.958-0.45-4.159-1.22 c0.213,0.025,0.429,0.038,0.647,0.038c1.271,0,2.441-0.434,3.369-1.161c-1.187-0.021-2.188-0.806-2.534-1.885 c0.166,0.032,0.335,0.049,0.511,0.049c0.248,0,0.486-0.033,0.714-0.094c-1.239-0.25-2.176-1.347-2.176-2.66c0-0.012,0-0.024,0-0.035 c0.366,0.202,0.784,0.325,1.229,0.34c-0.727-0.487-1.206-1.317-1.206-2.259c0-0.497,0.133-0.963,0.367-1.363 c1.337,1.641,3.337,2.721,5.592,2.834c-0.047-0.199-0.071-0.406-0.071-0.617c0-1.499,1.215-2.714,2.713-2.714 c0.781,0,1.486,0.329,1.979,0.857c0.618-0.122,1.2-0.348,1.724-0.659c-0.201,0.634-0.633,1.166-1.192,1.502 c0.549-0.066,1.071-0.212,1.559-0.428C21.501,8.86,21.042,9.338,20.513,9.72z"/></svg></a>
</div>

 

3. Spara

 

4. Gå in i din stilmall (ändrar från startsida till stilmall i rullgardinsmenyn)

Kopiera och klistra in följande längst ned i stilmallen:

.social, .social a:visited {
fill: #999;
}

.social a:hover, .social a:visited:hover {
fill: #ccc;
}

 

5. Spara

Du ändrar färg på knapparna genom att ändra i stilmallen. I det första stycket ändrar du hur de ser ut som vanligt. I andra stycket ändrar du hur de ser ut när du har musen över knapparna.



Hos blogghjalparn.blogg.se finner du textguider om HTML & CSS. Guiderna riktar sig till bloggare som vill ha hjälp med sin bloggdesign. Man kan själv läsa sig till hur man ska göra eller så kan man beställa sin egna design alternativt köpa en redan färdig design.

Copyright © 2017 Blogghjälparn

BLOGGHJÄLPARN


Senaste inläggen

Portaler & Listor
Webbdesign