The itch.io JavaScript API gives you the ability to embed a game purchasebutton into an existing web page. All you need to do is create a button or linkon your page, include a JavaScript file, and run a small snippet of code toconnect them.
The pop-up is also suitable if you have 0 as a minimum price because it willgive the visitor the option to go directly to the downloads.
Let’s see it in action, first we'll add a button that will be our buy button:
<buttonid="buy_button">BuyMyGame!</button>Next, we'll add something like the following, updating theuser andgame to be your username and the slug from the game you wish to sell.
<scripttype="text/javascript"src="https://static.itch.io/api.js"></script><scripttype="text/javascript">Itch.attachBuyButton(document.getElementById("buy_button"),{// replace the following with the correct information about your gameuser:"{{user}}",game:"{{game}}"});</script>Now when someone clicks on the button a pop-up will appear giving the visitoran opportunity to purchase your game.
Try it out:
Methods inhttps://static.itch.io/api.js
Itch.attachBuyButton(element, options)Attaches a buy button to a DOM element on the page.
element is a DOM element. (If you're using jQuery make sure you pass in theDOM element and not the jQuery object)
options is an object that can contain the following fields:
user:Required The username of the game sellergame:Required The slug of the game, the slug is the name of the gamefrom the URL of the game. For example, if your game’s URL ishttp://leafo.itch.io/x-moon then the slug isx-moon.width: The width of the pop-up, defaults to 650height: The height of the pop-up, defaults to 400Itch.getGameData(options)Asynchronously get information about a game.
options is an object that can contain the following fields:
user:Required The username of the game sellergame:Required The slug of the game, see above for an exampleonComplete:Required A function to call when the game information is loaded. Receives one argument: a hash table of game informationsecret: If your game is in draft, you can pass the secret here to let the API access it. Note that anyone can get access to this secret by viewing the source of your page. We recommend only using this parameter for testing.In addition to some basic game metadata,gameData will return any informationabout the current price of the game and any rewards. You can use this inconjunction with the buy button API to show current price. The price willreflect any sales that might be active.
Example:
<scripttype="text/javascript"src="https://static.itch.io/api.js"></script><scripttype="text/javascript">Itch.getGameData({user:"leafo",game:"x-moon",onComplete:function(data){console.log(data)}})</script>A game with rewards might return something like this:
{"id":1,"title":"X-moon","price":"$20.00","rewards":[{"amount":1000,"price":"$20.00","title":"Limited Access round","id":90,"amount_remaining":0,"available":false}]}A game on sale might return something like this:
{"id":36,"title":"ExoSlime DX: Revenge of Slime","price":"$0.60","original_price":"$1.21","sale":{"id":18,"end_date":"2016-06-30 10:17:59-07","title":"My first sale","rate":50}}Follow itch.io onTwitter,Facebook orJoin our Discord for new games and site updates.