11. februar 2013

Sådan sætter du smukke ikoner med links til sociale medier på din blog (blogspot)

Dette indlæg er ikke madrelateret. Men alligevel ret relevant, hvis du har en eller anden form for blog.
Jeg brugte ret lang tid på at finde ud af dette selv, så jeg tænkte at der var andre der kunne få glæde af en fremgangsmåde.

Jeg har længe gerne ville have nogle lidt smartere "følg mig" knapper. Og der ligger faktisk utrolig mange smukke og gratis løsninger derude på nettet. Se bare nedenstående eksempler:



Men da jeg skulle finde ud af hvordan de skulle sættes ind i koden, blev det straks lidt værre... Så her kommer en guide for dummies!



Guide til sociale medier knapper på din blog


  1. Først går du på nettet og finder de ikoner du synes passer til din blog (se for eksempel disse social media buttons her.) Her er det lidt vigtigt at du lige vurdere hvor store de skal være... Nogen kommer i forskellige størrelser, andre gør ikke (jeg mener at mine er 50x50). Download den ønskede type, og gem dem på din computer.
  2. Nu skal vi have oploaded billederne til blogger. Opret en ny kladde og kald den ikoner (eller hvad du lyster). opload billederne som du gør normalt. Når de er oploaded, højreklikker du på hver enkelt og går ned i "properties". Her finder du "Adress URL" som du kopierer, og gemmer i et tomt word dokument. Dette er stien til dit billede - altså der hvor blogger skal kunne finde billedet når du sætter det ind i din kode. Dette gør du for hvert enkelt billede, samtidig med at du noterer hvilket billede det er (f. eks. facebook billede: og så din URL her). Gem kladden og gå ud af den.
  3. Gå ind i "Layout" i blogger og vælg "Tilføj en Gadget". Vælg den der hedder "HTML/Javascript").
  4. Det er her koden skal stå. Nedenfor har jeg kopieret min kode ind præcis som den står i min gadget:

<div style="text-align:center;"><a href="http://twitter.com/foodmad"><img title="Tweet Me @foodMAD!" src="https://lh5.googleusercontent.com/-Ng26KitoGs0/URiwSRjrL5I/AAAAAAAADfs/l-c6nEGZTNo/h120/Sketch-twitter.png" /></a><a
href="https:></a
href="http:></div>


  • Dette gør du nu for samtlige links du ønsker, og derefter trykker du gem, og et voila! Du er nu en super haj til at udskifte ikoner....!!

Jeg har på fornemmelsen at denne blog kommer til at skifte ikoner med jævne mellemrum, for det er bare så super svært at vælge mellem alle disse smukheder!

Husk at du også kan følge mig på instagram under "foodMAD"... Den knap er endnu ikke kommet på :)

Nu er næste projekt at få ændret de "døde" faner øverst så jeg kan få katagoriseret mine indlæg i madrelateret, og ikke mad-relateret... Hvis der er nogen af jer der ved hvordan man gør det, så skriv endelig!



6 kommentarer:

GASTROmad sagde ...

Rigtig god beskrivelse du her har skrevet og tak for det :-).
Og så har du en rigtig spændende blog :-).
/Søren

foodMAD sagde ...

Hej Søren! Det var så lidt, og tak! :-)

Natascha De Jesus sagde ...

Hej... Dette fungere ikke på mac? Har du nogle idéer.

Heidi Sanda Reka Johansen sagde ...

Hej Natascha
Jeg har selv gjort det på en mac, så kan du give mig lidt flere oplysninger. Hvad er det præcist at den ikke vil?
Hilsen Heidi

Natascha De Jesus sagde ...

2. Nu skal vi have oploaded billederne til blogger. Opret en ny kladde og kald den ikoner (eller hvad du lyster). opload billederne som du gør normalt. Når de er oploaded, højreklikker du på hver enkelt og går ned i "properties". Her finder du "Adress URL" som du kopierer, og gemmer i et tomt word dokument. Dette er stien til dit billede - altså der hvor blogger skal kunne finde billedet når du sætter det ind i din kode. Dette gør du for hvert enkelt billede, samtidig med at du noterer hvilket billede det er (f. eks. facebook billede: og så din URL her). Gem kladden og gå ud af den.

^Det ovenstående jeg har problemer med :).

Natascha De Jesus sagde ...

det med "properties"