react-store-badges

react-store-badges is a React.js component displaying badges for App Store and Google Play Store. react-store-badge serves locale(localization) setting for each country.

react-store-badge uses SVG files, (optimized by svgo) so no worries about image going wrong.

Getting started

  npm install --save react-store-badges

Usage

  import React, {Component} from 'react'

  import ReactStoreBadges from 'react-store-badges'

  class App extends Component {
    render() {
      return <div>
        <ReactStoreBadges
          platform={'ios'}
          url={'YOUR_APP_STORE_URL'}
          locale={'en-us'}
        />

        <ReactStoreBadges
          platform={'android'}
          url={'YOUR_PLAY_STORE_URL'}
          locale={'ko-kr'}
        />
      </div>
    }
  }

props

| Name | Type | Default | Description | | :----------- | :-------------------------------: | :--------: | :------------------------------ | | url | string | required | url of App Store and Play Store | | platform | 'ios'|'android' | required | url of App Store and Play Store | | defaultLocale | string | 'en-us' | default locale code | | locale | string | 'en-us' | locale name | | width | number | 135 | width for badge size | | height | number | 40 | height for badge size | | target | '_self'|'_blank'|'_parent'|'_top' | '_self' | target for url to be opened |

Localization

Supported locales

Apple locales list

Google locales list

Localization tip

• iOS uses full code of their locale. (ex. en-us) and google uses short code of their locale(ex. en). So if you want your badge in only one store, you can customize it anyway.

Badge Guidelines

please note that you have to follow the guidelines below

Apple Badge Guidelines

Google Badge Guidelines