Hur använder jag mediawiki-tillägget för bildkarta?

Den här guiden visar dig det enklaste sättet att använda Image Map-tillägget för att använda en bild
Den här guiden visar dig det enklaste sättet att använda Image Map-tillägget för att använda en bild för att länka till en annan artikel i guiden.

Image Map-tillägget till MediaWiki-programvaran låter dig infoga bilder med klickbara länkar i artiklar på guiden och vissa andra Wiki-webbplatser. Med Image Map-tillägget kan du få en hel bild att fungera som en länk till en annan artikel eller så kan du välja flera områden inom den bilden för att länka till olika artiklar. Image Map-tillägget är ett kraftfullt och flexibelt verktyg, men eftersom det är kodat i HTML och definierar regioner via koordinater kan många användare ha svårt att använda det först. Den här guiden visar dig det enklaste sättet att använda Image Map-tillägget för att använda en bild för att länka till en annan artikel i guiden. Även om dessa instruktioner skrevs med guide i åtanke, bör stegen som visas här fungera på andra webbplatser som harImage Map-tillägg aktiverat också.

Steg

  1. 1
    Ladda upp din bild som guide om du inte redan har gjort det.
  2. 2
    Gå till sidan som visar bilden och beskrivningen t.ex.: Framing_hammer_956.jpg) och klicka sedan på länken till filen precis nedanför bilden för att ta dig till sidan som visar den fullständiga URL: n för att länka till bilden.
    • Din webbläsare ska nu bara visa bilden, men ingen beskrivande information.
    • Du bör se en URL som liknar den här: /a/af/Framing_hammer_956.jpg
    • Kopiera denna URL.
  3. 3
    Öppna ett nytt fönster eller en ny flik i din webbläsare och navigera till bildkartredigeraren.
    • Image MapEditor är ett verktyg som hjälper dig att välja lämplig region (er) i din bild för användning som länkar till andra sidor.
    • När du väl har valt din region (er) genererar Image Map-redigeraren också rätt kod för att definiera dessa regioner. Den här koden kan sedan klistras in i din artikel så att din bildkarta fungerar som avsett.
  4. 4
    Ange din URL i fältet märkt URL under "ladda från webbadress" och ange bildnamnet i fältet märkt "namn" (Obs: bildnamnet är texten efter den slutliga / i webbadressen du kopierade). Var noga med att inkludera filtillägget (t.ex..PNG,.JPG,.GIF) också.
    Kopiera tilläggskoden för imagemap från rutan direkt under rutan "globala inställningar"
    Rulla ned och kopiera tilläggskoden för imagemap från rutan direkt under rutan "globala inställningar".
  5. 5
    Klicka på "ladda" för att visa din bild i bildkartredigeraren. Bilden visas i en ruta märkt "Bild" under rutan "Ladda bild".
  6. 6
    Definiera regionen som ska användas som din länk.
    • Välj den områdestyp som bäst matchar formen på din bild (Detta exempel använder en rektangel, som är den vanligaste formen för att välja en hel bild).
    • Klicka på "Rektangel" i rutan "Nytt område".
    • Flytta muspekaren till bildens övre vänstra hörn och vänsterklicka sedan.
    • Flytta muspekaren till det nedre högra hörnet av din bild och högerklicka sedan. XY-koordinaterna för bildens hörn kommer nu att visas i rutorna som anger "Vänster / Överst" och "Höger / Nedre"
  7. 7
    Bläddra ner på sidan i bildkortsredigeraren tills du ser rutan "globala inställningar. " Om du vill behålla standardinställningarna behöver du inte göra något med den här rutan. Som standard kommer dessa inställningar att lägga en blå cirkel med ett " i " i det nedre vänstra hörnet på din bild som ger en länk till bildens informationssida (resten av bilden länkar till den sida du väljer).
    • Om du inte vill visa informationslänken väljer du "Ingen".
    • Om du vill välja en annan plats för informationslänken väljer du en av de andra platserna.
  8. 8
    Rulla ned och kopiera tilläggskoden för imagemap från rutan direkt under rutan "globala inställningar". Det här är koden du klistrar in i guiden för att skapa din bildlänk.
    • Koden börjar med texten <imagemap> </imagemap> och slutar med texten. Var noga med att kopiera dessa och allt däremellan.
    • Resten av koden definierar ditt område:
      • "rekt 1 1299 298" indikerar en rektangel som börjar vid pixel 11 (dvs uppe till höger) och går till pixel 299218.
      • "[[]]" Är parenteserna som omger sidan som bilden kommer att länka till. Detta följer standard wiki-markering.
  9. 9
    Öppna ett nytt fönster eller en ny flik i din webbläsare och redigera sidan där du vill placera länken till imagemap.
    Image Map-tillägget till MediaWiki-programvaran låter dig infoga bilder med klickbara länkar i artiklar
    Image Map-tillägget till MediaWiki-programvaran låter dig infoga bilder med klickbara länkar i artiklar på guiden och vissa andra Wiki-webbplatser.
  10. 10
    Klistra in din kod på rätt plats på sidan. Du bör se ungefär så här: <imagemap> Bild: Framing_hammer_956.jpg | rect 1 1299 218 [[]] desc none </imagemap>
  11. 11
    Lägg till länken till din sida mellan [[]]. För detta exempel lägger vi till en länk till "Hur man använder en hammare säkert "
  12. 12
    Kontrollera din kod för att se till att du har stängt imagemap-taggen ordentligt med hjälp av </imagemap>. Din kod ska nu se ut: <imagemap> Bild: Framing_hammer_956.jpg | rect 1 1299 218 [[Använd en hammare säkert]] desc none </imagemap>
  13. 13
    Spara din sida och testa din länk.
    • Om du följde instruktionerna för den här koden skulle du se:

Tips

  • Du kan använda ImageMap-tillägget och ImageMap-redigeraren för att definiera flera regioner i din bild som länkar till olika sidor.
  • Du kan lära dig mer om några avancerade applikationer av ImageMap-tillägget på Mediawiki.
    Bör stegen som visas här fungera på andra webbplatser som även har tillägget Image Map
    Även om dessa instruktioner skrevs med guide i åtanke, bör stegen som visas här fungera på andra webbplatser som även har tillägget Image Map.
  • Det är en bra idé att bekanta dig med nya verktyg genom att spela med dem i Sandbox innan du testar dem på hela artiklar.

Varningar

  • Använd endast bildmappning för att länka bilder till nya artiklar när det är nödvändigt eller mycket hjälpsamt för att ge ytterligare information till artikeln du redigerar (t.ex. när du klickar på bilden kan det ge mer information om ett relativt komplicerat steg i en guide).
FacebookTwitterInstagramPinterestLinkedInGoogle+YoutubeRedditDribbbleBehanceGithubCodePenWhatsappEmail