Media-Card-Web-Component

A custom web element to show / fetch details about movies, TV shows, books & songs on any website!

Example and usage

You can view a demo of this Web Component in use here.

Usage

 <media-card book="Animal Farm"></media-card>

include this script at in your HTML document.

<script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/Media-Card-Web-Component@latest/dist/media-card-wc.min.js" type="module"></script> 

Note: You can show as books as you want! You can also use a author attribute for a more accurate result.

Usage

 <media-card name="The Mask (1994)"></media-card>

Note: For movies & TV show a API Key is required from TheMovieDB, songs do NOT require a API key.

After getting your API key (if required) place it in your HTML document like so

<script>
 var TheMovieDB_APIKey = "YOUR API KEY HERE"
 </scrip>

include this script at the bottom of your HTML document.

<script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/Media-Card-Web-Component@latest/dist/media-card-wc.min.js" type="module"></script> 

Note: You can show as many movies as you want!

Usage

 <media-card name="The Twilight Zone (1959)" type="TV"></media-card>

Note: To display TV show(s) - you will require a API key from TheMovieDB.

After getting your API key place it in your HTML document like so

<script>
 var TheMovieDB_APIKey = "YOUR API KEY HERE"
 </scrip>

include this script at the bottom of your HTML document.

<script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/Media-Card-Web-Component@latest/dist/media-card-wc.min.js" type="module"></script> 

Note: You can show as many TV show's as you want

Usage

 <media-card name="The Beatles In My Life" type="song"></media-card>

Note: You do NOT need a API key to display songs.

include this script at the bottom of your HTML document.

<script src="https://cdn.jsdelivr.net/gh/MarketingPipeline/Media-Card-Web-Component@latest/dist/media-card-wc.min.js" type="module"></script> 

Note: You show as many song's as you want

Options

Contributing

Want to improve this project? Create a pull request with detailed changes / improvements! If approved you will be added to the list of contributors of this awesome project!

See also the list of contributors who participate in this project.

License

This project is licensed under the GPL-3.0 License - see the LICENSE.md file for details.