Lägga in bilder i widgeten

Det är snyggt att kunna visa bilder i widgeten och inte bara text. Jag tänker visa två sätt att göra det på.

1. Använda Jetpack.

2. Använda HTML.

 

INSTALLERA JETPACK
Jag börjar med det första sättet, att installera och använda pluginet Jetpack och därmed få tillgång till ett enkelt sätt att placera bilder i widgeten.

Jetpack finns till WordPress 3.7 och nyare och erbjuder en mängd nya funktioner till WordPress-sidan. Jetpack är knutet till wordpress.com och det innebär att de som driver en blogg/sajt på wordpress.com har redan haft tillgång till dessa funktioner men det här innebär att även andra med WordPress får tillgång till dem.

För att använda bildfunktionen i Jetpack behöver tillägget/pluginet finnas installerat. Om hur du installerar tillägg finns en film här i Snabbkurs i WordPress. Den heter Hantera widgets.

När du går in i widgeten finns Jetpack´s bildfunktion bland Tillgängliga widgets som Image (Jetpack). Välj var i widgeten du vill visa bilden och dra Image (Jetpack) dit. Här drar jag in den i Tertiary Sidebar men det är bara ett exempel.

[dropshadowbox align=”none” effect=”lifted-both” width=”700px” height=”” background_color=”#ffffff” border_width=”1″ border_color=”#dddddd” ][/dropshadowbox]

 

Nu vecklar du ut (klickar på pilen) Image (Jetpack) och då ser det ut på följande sätt.

[dropshadowbox align=”none” effect=”lifted-both” width=”700px” height=”” background_color=”#ffffff” border_width=”1″ border_color=”#dddddd” ][/dropshadowbox]

Nu är det dags att tala om vilken bild som ska visas så fyll i:

Bildens titel (Widget title): Den text du vill ska stå ovanför bilden. Vill du inte ha någon text lämnar du den raden tom.

Bildadressen (Image URL): Webbadressen till bilden hittar du i Mediabiblioteket när du går in i den aktuella bildens redigeringsläge. Se Hantera bilder i WordPress.

Alt text (Alternate text): Den text som visas om inte bilden av någon anledning går att visa.

Bildens titel: Den text som visas när muspekaren förs över bilden.

Rubrik (Caption): Bildens rubrik som visas under bilden. Anger du en rubrik så kommer bild och rubrik omges av en linje.

Slutligen väljer du bildens placering, om den ska vara centrerad eller höger- eller vänsterjusterad och bildens storlek. Väljer du inget här kommer programmet att försöka anpassa bilden till övrigt innehåll.

Läs mer om Jetpack här.

 

ANVÄNDA HTML
Ett annat sätt att lägga in bilder är genom att använda HTML-kod. Då behöver du inte ha något särskilt plugin installerat. Det är i första hand en kod-snutt du behöver använda och det är <img src=””>. Img src står för image search och det kommandot talar om för programmet var det ska leta efter bilden någonstans.

Det är här bildens adress kommer in för den talar om just var bilden finns. Mellan citationstecknen ska bildadressen, som du hittar i Mediabiblioteket, skrivas in.

För bilden här nedanför är bildadressen:
http://wpabc.se/wp-content/uploads/2014/05/iStock_KlädstorlekXSmall.jpg
Nu stoppar vi in den i kod-snutten <img src=””> och då ser det ut så här:

<img src=”http://wpabc.se/wp-content/uploads/2014/05/iStock_KlädstorlekXSmall.jpg”>
Bildadressen är nu instoppad mellan citationstecknen och klar att visas.

Så för att visa en bild i widgeten behöver du bara göra på det sättet.

Så här gör du för att skapa en bildlänk från bilden.

Inlägget är skrivet av Elisabeth Svensson.