Marketplace
Made in Webflow

Automatic Link Preview

5938 views
site profile thumbnail

Description

Let site visitors preview external links by hovering over the text. This plug-and-play feature allows you to get a link preview without leaving :) How it works: It extracts external links on load, grabs a screenshot then reveals the preview on hover. Since the card's position is calculated using custom code - it works with inline links and link blocks. Just change the external link, and the preview will be updated automatically. Replace the demo screenshot API I've used with your own on live builds. The project also includes a static version where you can manually upload a preview if you prefer—inspired by https://uiw.tf components. Fully built-in Webflow.
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.

We miss comments too!

Right now, Made in Webflow doesn't offer all of the same functionality that Showcase did, like the ability to leave comments. But don't worry: We're working to bring comments back as soon as possible!

As always, we'd love to hear your feedback! Click the link below to take a short survey about Made in Webflow.

previewlinkhovercardeffectinteractions

More by Dhruv Sachdev

See profile
View details
20 Line Hover Animations
1.2k
2.1k