social-elements / gplus-elements

Web Component wrapper for Google Plus' buttons using Polymer

Home Page:http://social-elements.github.io/gplus-elements

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

<gplus-elements>

Web Component wrapper for Google Plus' buttons using Polymer.

Demo

GPlus Element

Check it live.

Install

Install the component using Bower:

$ bower install gplus-elements --save

Or download as ZIP.

Usage

  1. Import Web Components' polyfill:

    <script src="bower_components/webcomponentsjs/webcomponents.js"></script>
  2. Import Custom Element:

    <link rel="import" href="bower_components/gplus-elements/dist/gplus-one.html">
    <link rel="import" href="bower_components/gplus-elements/dist/gplus-follow.html">
  3. Start using it!

    <gplus-one></gplus-one>
    <gplus-follow></gplus-follow>

<gplus-one>

Attribute Options Default Description
annotation bubble,inline,none bubble Sets the annotation to display next to the button
height 15,20,24 20 The pixel height of the button to render
href string http://webcomponents.org The URL to +1
size small, medium, standard, tall standard Sets the +1 button size to render
width int 300 The width of the button

<gplus-follow>

Attribute Options Default Description
annotation bubble, vertical-bubble, none bubble Sets the annotation to display next to the button
height 15,20,24 20 The pixel height of the button to render
href string https://plus.google.com/+WebcomponentsOrg URL to the Google+ page or user profile
rel author or publisher Describes the relationship of the entity defined at the href location to the page the badge is embedded.
width int 300 The width of the button

See Google Plus' official documentation.

Development

In order to run it locally you'll need to fetch some dependencies and a basic server setup.

  • Install Bower & Grunt:

    $ [sudo] npm install -g bower grunt-cli
  • Install local dependencies:

    $ bower install && npm install
  • To test your project, start the development server and open http://localhost:8000.

    $ grunt server
  • To build the distribution files before releasing a new version.

    $ grunt build
  • To provide a live demo, send everything to gh-pages branch.

    $ grunt deploy

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -m 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

History

For detailed changelog, check Releases.

License

MIT License © Zeno Rocha

About

Web Component wrapper for Google Plus' buttons using Polymer

http://social-elements.github.io/gplus-elements


Languages

Language:HTML 87.9%Language:JavaScript 12.1%