Link Preview plug-in
De Link Preview Plugin toont een voorbeeld van de webpagina waarnaar de link linkt wanneer de gebruiker over de link zweeft en de link de klasse heeft grabzit-preview. Deze saves de gebruikerstijd bij het beslissen welke links ze willen.
Om te beginnen, plaatst u de regel onderaan de pagina net boven de afsluitende body-tag. Vervang vervolgens de "APPLICATION KEY" door uw werkelijke applicatiesleutel. Voeg vervolgens de preview-mogelijkheid toe aan een link grabzit-preview klasse naar de link. Dit wordt dan automatisch gelezen en er wordt een voorbeeld gegenereerd.
new GrabzItPreview("Sign in to view your Application Key");
U hoeft geen andere configuratie-opties in te stellen, maar u kunt alle algemene, afbeeldings- en geanimeerde GIF-parameters in het optieobject. In het onderstaande voorbeeld hebben we bijvoorbeeld de breedte en hoogte ingesteld op 200 x 200.
new GrabzItPreview("Sign in to view your Application Key", {"width": 200, "height": 200});
Als u een andere URL wilt opgeven dan die in het href-kenmerk. U kunt een opgeven met behulp van de grabzit-href kenmerk bijvoorbeeld.
<a href="http://example.com" grabzit-href="https://www.tesla.com" class="grabzit-preview">My Example</a>
Voel je vrij om JavaScript of CSS naar wens te wijzigen! We bieden echter speciale CSS-klassen die u kunt gebruiken om het voorbeeldvak te stylen, deze omvatten: grabzit-preview-container, grabzit-preview-caption, grabzit-preview-loader en grabzit-preview-screenshot.
GrabzIt Preview op een blog of CMS installeren
GrabzIt Preview is volledig compatibel met een blog of CMS, zoals WordPress, Drupal en Joomla. Net open blog-of-cms-install.txt gevonden in de download van de plug-in, dit omvat alle vereiste JavaScript en CSS in één blok. Dit kan vervolgens worden ingevoegd inteen widget die ruwe HTML accepteert, dergelijke widgets zijn aanwezig in de meeste blogs of Content Management Systemen. Vergeet niet deze onderaan de pagina te vinden na de inhoud.
Deze JavaScript-plug-in is volledig open source! Als u de broncode wilt bekijken of verbeteren, kunt u deze vinden op GitHub.