WP-instruktion

Instruktion för inläggning av MediaLikes donationsknapp i WordPress

MediaLike erbjuder två typer av donationsknappar och även en enkel donationslänk.
Länk och knappar är unika för varje mottagare av donationer och måste därför hämtas från MediaLike av respektive mottagare. Denne måste då vara inloggad som ”Mottagare”.
För att bli Mottagare måste man ansöka hos Net Media Systems MD AB som sedan skapar mottagaridentiteten när ett avtal har träffats.

Vi rekommenderar att man använder knapp men där sajten inte tillåter uppladdning av bilder eller utnyttjande av JavaScript finns möjligheten att bara använda en enkel länk. Detta gäller normalt endast YouTube och bör inte vara aktuellt för WordPress. Länken kan visas i original (https://www.medialike.se/donera/index.html?r=c128b8a5-4616-4dd4-8897-b19...), men med fördel kopplas till en specifik text som förklarar användningen. T.ex. Gillade du artikeln? Stöd oss med en donation på 1 kr. Observera att länken är unik för varje mottagare inom MediaLike och att ovanstående exempellänkar är kopplade till MediaLikes produktionssystem och fungerar för riktiga donationer till denna artikel.

Donationsknappen finns i två varianter:

Statisk knapp (bild)
som är kopplad till en länk (samma som ovan). Olika bildtexter kan väljas av mottagaren då bilden skapas, men det förslagna och förprogrammerade donationsbeloppet är alltid 1 kr. Bilden genereras av html-kod som den inloggade mottagaren kan hämta hos MediaLike.
Koden kopieras från MediaLike och klistras in på lämplig plats på den artikelsida som ska ha donationen. Hur inklistring ska göras för att bilden ska hamna på rätt plats beror på vilken editor som används för artikelsidan. Observera att länken är unik för varje mottagare inom MediaLike och nedanstående exempel är kopplade till MediaLikes produktionssystem och fungerar för riktiga donationer till denna artikel. Knappen kan se ut så här (Olika texter kan väljas men bakgrundsfärgen är en fast bestämd grön nyans):

Dynamisk knapp (Javascript)
som är baserad på JavaScript och med möjlighet att direkt välja ett av tre olika donationsbelopp.
Html-koden skapas även här av MediaLike och ska klistras in på artikelsidan enligt instruktion som visas när mottagaren skapar knappen. Knappen kan se ut som visas nedan.
Denna variant kräver att artikelsidan tillåter att JavaScript används, vilket inte alla versioner av WordPress gör, men Net Media Systems MD AB rekommenderar att den dynamiska knappen används där så är möjligt, t.ex. genom att uppgradera tilll Business Plan i WordPress.com. Anledningen är att den förutom fler direktval av alternativa donationsbelopp även ger mer komplett information om exakt vilken artikel som belönats av varje donator samt garanterar att donatorn efter donationen alltid automatiskt kommer tillbaka till artikeln och inte bara till sajtens hemsida.


Beskrivning av hur statisk knapp läggs in i en WordPress-artikel

MediaLike rekommenderar att knappen läggs in i den mall som används när artikeln skapas. Därmed behöver denna procedur bara göras en gång. Alternativt kan knappens block läggas i ”Reusable blocks” för att lätt kunna läggas in efter varje artikel.

1. Logga in som Mottagare i MediaLike (Inloggningsuppgifter erhålls av MediaLike när avtal om mottagarstatus ingås.)

2. Gå till ”Hämta donationsknapp”

3. Välj där ”Bild” under ”Typ av länk”

4. Välj ”Storlek”, ”Rubrik” och ”Text”.

5. Klicka på ”Visa html för donationsknappen”. Då visas dels en bild av knappen och dels den html-kod som ska kopieras och sedan klistras in på artikelsidan i WordPress eller i mallen på lämplig plats.

6. Öppna nu artikeln (eller mallen) i WordPress och klicka på ”Edit”

7. Klicka på ”Add block” och sedan på ”Custom HTML”

8. Klistra in html-koden från MediaLike på önskad plats och kontrollera resultatet med ”Preview”

9. Om det är OK, klicka då på ”Update” och sedan på ”View post”. Nu ska knappbilden visas.

10. Om knappbilden hamnar på fel ställe, justera med de verktyg som den använda editorn har. Då det finns många olika editorer beskrivs det inte här. Om det trots allt är svårt att placera donationsknappen på rätt plats, så finns nedanstående alternativa metod att lägga in knappen. Metoden utgår från att knappen är en statisk bild, som är lättare att placera exakt rätt, och sedan associera en länk till bilden. MediaLikes funktion blir identisk med ovanstående.

Alternativ metod att lägga in statisk donationsknapp i WordPress-artikel

11. Följ stegen 1 – 6 som ovan.

12. Klicka på ”Add block” och sedan på ”Image”

13. Gå tillbaka till MediaLike och peka på knappbilden samt högerklicka och välj ”Kopiera bildadress”

14. Välj ”Insert from URL” i WordPress ”Image”-ruta samt klistra in bildadressen och gör ”Enter”

15. Då visas knappbilden. Klicka på den och en blå ram visas runt bilden (och lite mer). Ovanför ramen finns några alternativa funktioner. Klicka på ”Insert link”. Då visas ett fält med texten ”Type URL or….”

16. Gå sedan tillbaka till MediaLike och klicka på ”Ändra”. Välj därefter ”Text” under ”Typ av länk” och klicka på ”Visa html för donationsknappen”. Kopiera då den html-kod som visas.

17. Klistra in html-koden i fältet ”Type URL or …” och gör ”Enter” (”Apply”) i WordPress.

18. Klicka på ”Update” och sedan på ”View post” och det är klart! Vid behov justeras knappens placering med de verktyg som den använda editorn erbjuder.