podlove-subscribe-button

KO | EN

gitlite — search

#javascript #python #react #android #deep-learning #linux #nodejs #windows #cli #kubernetes #vue #pytorch #security #ios

podlove-subscribe-button

(★ 66)

Universal button to subscribe to buttons in the desired podcast client or player website

podlove-subscribe-button 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Podlove Subscribe Button
[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fpodlove%2Fpodlove-subscribe-button.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fpodlove%2Fpodlove-subscribe-button?ref=badge_shield)

## General

[Official project page](http://podlove.org/podlove-subscribe-button/)

[Help translating](https://podlove.oneskyapp.com/collaboration/project?id=14564)

If you are a client developer and want to add your client to the list, please read the page above carefully and open an issue on this repository when you have fulfilled the requirements.

## Usage

### Using the Podlove CDN

We are hosting an always up-to-date version of the Podlove Subscribe Button code on our CDN. This is the preferred way to include the button on your web site.

Currently, you can set these options:

data-json-data: name of the variable where the button can find information about the podcast (see Podcast data API section)
    data-language: language the texts on the button and popup should be in (currently supports 'de', 'en', 'eo', 'fi', 'fr', 'nl', 'zh' and 'ja')
    data-size: size and style of the button ('small', 'medium', 'big'). All of the sizes can be combined with 'auto' to adapt the button width to the available space like this: 'big auto'
    data-color: define the color of the button (Please see section **Override Button Color** for more information)
    data-buttonid: you can use this to open the popup from another element on the same page (see section **Use your own button element**
    data-hide: if set to `true` the button will not be shown (useful if you want to use your own element
    data-format: choose a button format, default is a rectangle, options are 'square' and 'cover' (**Note**: 'cover' has a max size of 300px)
    data-style: choose a button style, default is filled, options are 'outline' and 'frameless'

### Self hosted

Put

dist/*

into the same folder on a publicly available server. Then add a script tag to the place where you want the button to appear:

There are currently two options you can set:

data-json-data: name of the variable where the button can find information about the podcast (see Podcast data API section)
    data-language: language the texts on the button and popup should be in (currently supports 'de', 'en', 'eo', 'fi', 'fr', 'nl', 'zh' and 'ja')

### Podcast data API

To work the button needs information about the podcast, which needs to be provided in the following format:

If everything went right you should see a button that will open a popup with subscribe buttons when clicked.

### Override Button Color

The color of the button is configurable by setting the `data-color` parameter on the script tag. If the parameter is not given the default will be used. Allowed are all notations for colors that CSS can understand (keyword, rgb-hex, rgb, rgba, hsl, hsla). See [here for more](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value).

**Please Note:** It is not possible to style multiple buttons/popups on the same page differently. Unfortunately this is technically not possible at this moment. Please write us or create an issue, if you are interested in this feature.

### Use your own button element

For ultimate freedom you can use a completely different element on the page for opening the popup. To achieve this you have to set a unique ID for each button you have on the page like this:

Then define the element that should open the popup when clicked just like this:

<a href="#" class="podlove-subscribe-button-123abc">Subscribe</a>

If you want to hide the original button you can combine ```data-buttonid``` with ```data-hide``` which, you already guessed it, will hide the button:

### Add non-javascript fallback

If you want to provide a fallback when no javascript is present, we recommend to do it like this:

You can also provide more than one feed link if you have more.

### Automatic opening on page load

If you request the page where the button is embedded with the hash param `#openSubscribeButtonPopup` the popup will automatically open. There should only be one embed code present on the site though!

Example:

https://example.com/subscribe#openSubscribeButtonPopup

## Supported Apps / Services

### Android
  * [AntennaPod](https://play.google.com/store/apps/details?id=de.danoeh.antennapod)
  * [Player.fm](https://play.google.com/store/apps/details?id=fm.player)
  * [Podcast Addict](https://play.google.com/store/apps/details?id=com.bambuna.podcastaddict)
  * [Podkicker](https://play.google.com/store/apps/details?id=ait.podka)

### Cloud
  * [gpodder.net](https://gpodder.net/)
  * [Player.fm](https://player.fm/)
  * [Pocket Casts](https://play.pocketcasts.com/)

### iOS
  * [Castro](https://apps.apple.com/app/castro-2/id1080840241)
  * [Downcast](https://apps.apple.com/app/downcast/id393858566)
  * [iCatcher](https://apps.apple.com/app/icatcher!-podcast-app/id414419105)
  * [Instacast](https://apps.apple.com/app/instacast-4-podcast-client/id577056377)
  * [Overcast](https://apps.apple.com/app/overcast-podcast-player/id888422857)
  * [PocketCasts](https://apps.apple.com/app/pocket-casts/id414834813)
  * [Podcasts](https://apps.apple.com/app/podcasts/id525463029)
  * [Podcat](https://apps.apple.com/app/podcat/id845960230)
  * [RSSRadio](https://apps.apple.com/app/rssradio-podcast-player/id386600664)

### Linux
  * [Clementine](https://www.clementine-player.org/downloads)
  * [gPodder](http://gpodder.org/downloads)

### macOS
  * [Downcast](https://apps.apple.com/app/downcast/id668429425?mt=12&uo=4)
  * [Instacast](https://apps.apple.com/app/instacast/id733258666?mt=12&uo=4)
  * [iTunes](http://www.apple.com/itunes/)

### WindowsPhone
  * [BringCast](http://windowsphone.com/s?appId=e5abef38-d413-e011-9264-00237de2db9e)
  * [gramocast](http://windowsphone.com/s?appId=ebb52054-5071-4aa4-9537-00399d06a99e)
  * [Podcast Lounge](http://windowsphone.com/s?appId=83bc0329-8e02-410e-b6d2-da3c0c1d971d)
  * [Podcast Picker](http://windowsphone.com/s?appId=79b72069-b656-47d2-bab1-fa2d4061825e)
  * [Podcasts](undefined)

### Windows
  * [gPodder](http://gpodder.org/downloads)
  * [iTunes](http://www.apple.com/itunes/)

## Development

Install requirements

yarn install

Use gulp to build the project or start the server:

yarn run build

yarn run dev

## Contribution

If you want to help us translate the button to other languages, please [sign up here](https://podlove.oneskyapp.com/collaboration/project?id=14564) and let us know if you need any help!

If you find a bug please use [Github Issues](https://github.com/podlove/podlove-subscribe-button/issues) to report it. If you want to add a feature or fix a bug please fork the repository, make your changes in a feature branch and open a pull-request.

## Support
<a href="https://keycdn.com"><img src="https://logos.keycdn.com/keycdn-logo-black.svg" alt="KeyCDN" width="200px"></a>

## License

[MIT](https://github.com/podlove/podlove-subscribe-button/blob/master/LICENSE)

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fpodlove%2Fpodlove-subscribe-button.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fpodlove%2Fpodlove-subscribe-button?ref=badge_large)

podlove-subscribe-button

podlove-subscribe-button 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

podlove-subscribe-button

podlove-subscribe-button 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README