link-prevue is a flexible component for generating a link preview.
Must Read: An Open-source Angular UI Library For Previewing Web Links
How to make use of it:
Installation
npm install link-prevue
Usage
import LinkPrevue from 'link-prevue' new Vue({ el: '#app', components: { LinkPrevue } })
<div id="app"> <link-prevue url="https://vuejs.org/"></link-prevue> </div>
Props API
link-prevue has the following props for customizing the component
Must Read: A JavaScript Library to Display Link/URL Preview On Hover | Hyperlinks
Prop | Type | Required | Default Value | Description |
---|---|---|---|---|
url | String | yes | undefined | Site URL for generating a link preview |
onButtonClick | Function | no | undefined | Function for a custom button handler, params => prevue |
cardWidth | String | no | ‘400px’ | Card width, accept px and % |
showButton | Boolean | no | true | Render card button |
apiUrl | String | no | https://link-prevue-api-v2.herokuapp.com/preview/ | Custom API urlĀ check this |
See Also –
A Vanilla JS Library to Show Preview Images on Hover
Simple Deep Links For Any Specific Text On Your Website
Scroll Down To Show The Anchor Link To Go To The Top With The Animation
See Demo And Download
Official Website(nivaldomartinez): Click Here
This superior jQuery/javascript plugin is developed by nivaldomartinez. For extra advanced usage, please go to the official website.