https://github.com/demjhonsilver/embedia-vue
Embedia Vue is an embed package for Vue which can embed from platforms like Facebook, Instagram, TikTok, YouTube/Shorts, Twitter/X, Vimeo and Dailymotion.
https://github.com/demjhonsilver/embedia-vue
dailymotion embed facebook instagram tiktok twitter video vimeo vue vuejs x youtube
Last synced: 2 days ago
JSON representation
Embedia Vue is an embed package for Vue which can embed from platforms like Facebook, Instagram, TikTok, YouTube/Shorts, Twitter/X, Vimeo and Dailymotion.
- Host: GitHub
- URL: https://github.com/demjhonsilver/embedia-vue
- Owner: demjhonsilver
- License: mit
- Created: 2025-01-12T08:21:02.000Z (9 months ago)
- Default Branch: main
- Last Pushed: 2025-01-12T09:00:35.000Z (9 months ago)
- Last Synced: 2025-06-27T12:12:34.251Z (4 months ago)
- Topics: dailymotion, embed, facebook, instagram, tiktok, twitter, video, vimeo, vue, vuejs, x, youtube
- Language: JavaScript
- Homepage: https://demjhonsilver.github.io/embedia-vue-docs
- Size: 15.3 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE.md
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# Embedia Vue
[](https://www.npmjs.com/package/embedia-vue)
[](https://github.com/demjhonsilver/embedia-vue/blob/main/LICENSE.md)
---------------------
## Table of Contents
- [Description](#description)
- [Release Notes](#release-notes)
- [Features](#features)
- [Installation](#installation)
- [Embed Video](#embed-video)
- [Paradigm](#paradigm)
- [Vue](#vue)
- [Responsiveness](#responsiveness)
- [License](#license)
- [Author](#author)
## Description
Embedia Vue is an embed package for Vue which can embed from platforms like Facebook, Instagram, TikTok, YouTube/Shorts, Twitter/X, Vimeo and Dailymotion.
Framework | Supported versions
------ | -------- |
 | 3 & above
-----
## Release-notes
Major Changes:
v1.0.0
- This library package offers a minimal syntax.
- Lightweight size
Minor Changes:
v1.2.0
- The embedded video for X and Instagram will be minimal.
- The embedded video for Vimeo has fixed the auto loop issue.
v1.1.0
- The embedded video for supports X.com.
Patch Changes:
v1.2.6
- Fixed the issue with embedding Instagram videos due to the different link formats.
v1.2.5
- Fixed the issue with embedding Vimeo videos regarding autoplay.
-------
## Features
- Easy to set-up and responsive.
- Supports embedding one or more videos from platforms including Facebook, Instagram, TikTok, YouTube, YouTube Shorts, X, Dailymotion, and Vimeo.
___________
[Click here: Demo](https://demjhonsilver.github.io/embedia-vue-docs)
-------------
## Installation
To install the Embedia Vue, you can use the following npm command:
```bash
npm install embedia-vue
```
--------
## Embed-video
Attributes |  |  |  |  |
------ | -------- | ----------|---------- |------------
Required? `width` | yes | | |
Required? `height` | yes | | |
Required? `fullscreen` | optional | | |
Required? `controls` | | | |
Required? `autoplay` | | | |
Required? `cssname` | optional | optional | optional | optional
Required? `clip` | yes | yes | yes | yes
---------
-------------------
Attributes |  |  |  |
------ | -------- | ----------|---------- |
Required? `width` | yes | yes | yes
Required? `height` | yes | yes | yes
Required? `fullscreen` | optional | optional |
Required? `controls` | optional | optional |
Required? `autoplay` | optional | optional |optional
Required? `cssname` | optional | optional | optional
Required? `clip` | yes | yes | yes
---------
## Width
You can copy and paste the following HD dimensions below:
---------------
---------------
Value | Width and Height
------- | ------------
854x480 | width: 854, height: 480
640x360 | width: 640, height: 360
426x240 | width: 426, height: 240
256x144 | width: 256, height: 144
------------
------------
## Paradigm
```js
```
You can use any importing syntax script format:
```js
import { EmbediaVue } from 'embedia-vue';
```
or
```js
import { EmbediaVue } from 'embedia-vue';
export default {
components: {
EmbediaVue
}
};
```
For global usage (main.js)
```js
import { createApp } from 'vue';
import './style.css';
import App from './App.vue';
import router from './router';
import { EmbediaVue } from 'embedia-vue'; // Import global
createApp(App)
.component('EmbediaVue', EmbediaVue)
.use(router)
.mount('#app');
```
If you choose global, you can use the code below:
```js
```
-----------------------------------------------
______________________________________________
## Vue
```js
import { EmbediaVue } from 'embedia-vue';
.embed-clip {
border: 2px solid green;
}
```
## Responsiveness
______
In your built-in default style.css ( body only )
-------
Change the display value from flex to block.
```css
body {
margin: 0;
display: block; // this code makes responsive
place-items: center;
min-width: 320px;
min-height: 100vh;
}
```
## License
MIT
- This library package is FREE. ❤️
----------------------------------------------------
## Author
Demjhon Silver