Hoe verander ik afbeeldingen op websites met behulp van Inspect Element?

3 weergave

In de inspector vind je het element dat de afbeelding weergeeft. Dubbelklik op de huidige URL van de afbeelding in de broncode, vaak te vinden bij de src attribuut. Vervang deze URL direct door de URL van de nieuwe afbeelding. Dit simpele wijzigen toont de nieuwe afbeelding, echter alleen lokaal en tijdelijk; de website zelf blijft ongewijzigd voor andere bezoekers.

Opmerking 0 leuk

Websites “hacken” met Inspect Element: Een tijdelijke foto-wisseltruc

Benieuwd hoe je snel even een andere afbeelding op een website kunt zien, zonder de website zelf te veranderen? Met de “Inspect Element” functie van je browser kan dat! Deze handige tool laat je de onderliggende code van een webpagina bekijken en zelfs tijdelijk aanpassen. Hiermee kun je bijvoorbeeld even een andere afbeelding in een bepaalde plek bekijken, maar onthoud: dit is puur lokaal en tijdelijk. De website zelf wordt niet gewijzigd.

De truc berust op het bewerken van de HTML-code van de pagina. Laten we eens kijken hoe het werkt:

Stap 1: Open de “Inspect Element” tool.

Dit doe je door met je rechtermuisknop op de afbeelding te klikken die je wilt vervangen en te kiezen voor “Inspecteren” (of een vergelijkbare optie, afhankelijk van je browser). In Chrome, Firefox en Edge heet het bijvoorbeeld “Inspecteren” of “Onderzoeken”. In Safari is het “Element onderzoeken”.

Stap 2: Zoek de src attribuut.

De “Inspect Element” tool opent meestal een paneel onderaan of aan de zijkant van je scherm. Je ziet nu de broncode van de pagina. Zoek het HTML-element dat de afbeelding weergeeft. Dit element bevat meestal een img tag. Binnen deze tag vind je het src attribuut. Dit attribuut bevat de URL van de huidige afbeelding. Het ziet er bijvoorbeeld zo uit:

<img src="https://voorbeeld.com/oude_afbeelding.jpg" alt="Oude afbeelding">

Stap 3: Vervang de URL.

Dubbelklik op de URL in het src attribuut (bijvoorbeeld https://voorbeeld.com/oude_afbeelding.jpg). De tekst wordt nu selecteerbaar. Vervang deze URL met de URL van de nieuwe afbeelding die je wilt zien. Bijvoorbeeld:

<img src="https://voorbeeld.com/nieuwe_afbeelding.jpg" alt="Nieuwe afbeelding">

Druk op Enter. Onmiddellijk zou je de nieuwe afbeelding op de website moeten zien!

Belangrijke opmerking: Deze verandering is alleen zichtbaar voor jou en alleen zolang je browser openstaat. Sluit je browser, open een nieuw tabblad of ververs de pagina en de originele afbeelding is weer terug. Je hebt de website zelf niet gewijzigd; de wijziging is puur lokaal in je browser. Dit is dus geen manier om websites permanent te wijzigen. Het is een handige truc voor een snelle preview of om even te experimenteren met hoe een andere afbeelding eruit zou zien op die plek.