Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

embedia-vue

Package Overview
Dependencies
Maintainers
0
Versions
27
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

embedia-vue

A Vue component package to embed videos such as Facebook, Instagram, TikTok, YouTube/Shorts, Twitter/X, Vimeo, and Dailymotion.

  • 1.0.0-alpha.2
  • unpublished
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
83
increased by8200%
Maintainers
0
Weekly downloads
 
Created
Source

Logo

Embedia Vue

npm version Package Size Downloads License


Table of Contents

Description

Embedia Vue is an embed package for React, Vue, Angular, and Svelte which can embed from platforms like Facebook, Instagram, TikTok, YouTube/Shorts, Twitter/X, Vimeo and Dailymotion.

FrameworkSupported versions
Vue.js3 & above

Release-notes

Major Changes: v1.0.0-alpha.1

  • This library package offers a minimal syntax.
  • Lightweight size

Features

  • Easy to set-up and responsive.
  • Supports embedding one or more videos from platforms including Facebook, Instagram, TikTok, YouTube, YouTube Shorts, Twitter/X, Dailymotion, and Vimeo.

Installation

To install the Embedia Vue, you can use the following npm command:

npm install embedia-vue

Embed-video

AttributesTypeFacebookInstagramTikTokTwitter X
widthnumberoptional
heightnumberoptional
fullscreenbooleanoptional
controlsboolean
autoplayboolean
cssnamestringrequiredrequiredrequiredrequired
clipstringrequiredrequiredrequiredrequired


AttributesTypeYouTubeVimeoDailymotion
widthnumberoptionaloptionaloptional
heightnumberoptionaloptionaloptional
fullscreenbooleanoptionaloptionaloptional
controlsbooleanoptionaloptionaloptional
autoplaybooleanoptionaloptionaloptional
cssnamestringrequiredrequiredrequired
clipstringrequiredrequiredrequired

Width

You can copy and paste the following HD dimensions below:


ValueWidth and Height
854x480width: 854, height: 480
640x360width: 640, height: 360
426x240width: 426, height: 240
256x144width: 256, height: 144

Google Chrome

Reminder:

  • Don't forget to restart your server.

Paradigm

  <Embedia
    clip="https://www.youtube.com/watch?v=oEXFMGK7IC0"
    width=""
    height=""
    :autoplay="false"
    :fullscreen="false"
    :controls="true"
    cssname="rename-me-now"
  />

Vue

<template>
  <Embedia
    clip="https://www.youtube.com/watch?v=oEXFMGK7IC0"
    width="454"
    height="280"
    cssname="embed-clip"
  />
</template>

<script setup>
import { Embedia } from 'embedia-vue';
</script>

<style scoped>
.embed-clip {
  float: right; 
}
</style>

Responsiveness

To make responsive clip


In your default style.css (body only)


Change the display value from flex to block.


body {
  margin: 0;
  display: block;
  place-items: center;
  min-width: 320px;
  min-height: 100vh;
}

You can do anything here:

.embed-clip {
  float: left; 
  border: 2px solid green;
}

License

MIT

  • This library package is FREE. ❤️

Author

Demjhon Silver

Keywords

FAQs

Package last updated on 01 Sep 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc