
**UPDATE DECEMBER 2021:** This plugin has been updated. [Learn about v3 of this plugin here](https://www.unlock-protocol.com/blog/unlock-protocol-wordpress-plugin).

The world of publishing is [moving away from ads](https://medium.com/unlock-protocol/the-end-of-the-ad-supported-web-d4d093fb462f) as the single way to monetize content. In the last 18 months, most of the largest and most influential publications in the US and Europe have been moving to what they call "direct consumer revenue." This is a great thing because it changes incentives from trying steal their users' attention (click bait, fake news, endless slideshows... etc) to creating value for their members.

Unfortunately though, unless you're a very large publisher with your own engineering team to build and maintain your own paywall, it's nearly impossible to move to that model.

At Unlock, we believe that everyone one the web should be treated equally with the same capabilities. What is the point of democratizing publishing if only the biggest corporations can actually be paid for their work?

Today, we're introducing a [WordPress plugin for Unlock](https://wordpress.org/plugins/unlock-protocol/) which lets you add a lock to your Wordpress.org site in minutes!

# Demo

First thing first: you can try it today on our [demo wordpress.org website](https://wordpress-demo.unlock-protocol.com/). This blog only has a single story, and some of the content on this page has been put behind a [lock](https://etherscan.io/address/0xCE62D71c768aeD7EA034c72a1bc4CF58830D9894): you will see a different version of it based on whether you are already a member or if you're not one.

![become member](/images/blog/wordpress-plugin/become-member-wordpress.png)
_If you're not a member you're invited to become one by clicking on a button_

# Installing on your own Wordpress

## Getting started

If you'd like to add a lock to your site, start by [deploying your first lock](https://unlock-protocol.com/blog/create-first-lock/).

While the lock is deploying you should install this plugin. From the administration of your Wordpress.org website, in the `Plugins` section, click on the `Add New` button and search for `Unlock Protocol` in the search bar.

![search plugin](/images/blog/wordpress-plugin/search-plugin.png)

Once installed, check the plugin's settings to add the address of the lock that you have deployed.

![plugin settings](/images/blog/wordpress-plugin/plugin-settings.png)

## Writing locked stories

The plugin provides you with "Blocks" which can be used in the [Gutenberg Editor](https://wordpress.org/gutenberg/) (WordPress 5.0 and later), for both posts and pages. We provide 3 different blocks:

- The _locked_ block: a block whose content (rich text) is visible to non-members.
- The _unlocked_ block: a block whose content (rich text) is visible only to members.
- The _checkout button_ block: a block with a button to let you add a button for people to become members. This button will not be visible for members.

Once your story includes the content you need, you can preview its content like any other WordPress post or page. We recommend the use of a web3 wallet (such as [MetaMask](https://metamask.io/)) which supports multiple accounts so that you can easily toggle between accounts which are already members and accounts which are not members yet!

PS: like [all of our code](https://github.com/unlock-protocol/unlock/), this plugin is fully open source, you can find it on Github: [Unlock Wordpress Plugin](https://github.com/unlock-protocol/unlock-wordpress-plugin)

If you're using the WordPress plugin, we'd love to get your feedback and learn from you about ways it could be better! We're also working on several new additions for which we'd love to find early adopters, please get in touch!


WordPress is the most popular Content Management System. Adding a lock to your site lets you monetize the words you write without asking anyone's permission!

Adding a lock to your WordPress.org website has never been easier!

WordPress Plugin

UPDATE DECEMBER 2021: This plugin has been updated. <a href="https://www.unlock-protocol.com/blog/unlock-protocol-wordpress-plugin">Learn about v3 of this plugin here</a>.
The world of publishing is <a href="https://medium.com/unlock-protocol/the-end-of-the-ad-supported-web-d4d093fb462f">moving away from ads</a> as the single way to monetize content. In the last 18 months, most of the largest and most influential publications in the US and Europe have been moving to what they call "direct consumer revenue." This is a great thing because it changes incentives from trying steal their users' attention (click bait, fake news, endless slideshows... etc) to creating value for their members.
Unfortunately though, unless you're a very large publisher with your own engineering team to build and maintain your own paywall, it's nearly impossible to move to that model.
At Unlock, we believe that everyone one the web should be treated equally with the same capabilities. What is the point of democratizing publishing if only the biggest corporations can actually be paid for their work?
Today, we're introducing a <a href="https://wordpress.org/plugins/unlock-protocol/">WordPress plugin for Unlock</a> which lets you add a lock to your Wordpress.org site in minutes!
<h1>Demo</h1>
First thing first: you can try it today on our <a href="https://wordpress-demo.unlock-protocol.com/">demo wordpress.org website</a>. This blog only has a single story, and some of the content on this page has been put behind a <a href="https://etherscan.io/address/0xCE62D71c768aeD7EA034c72a1bc4CF58830D9894">lock</a>: you will see a different version of it based on whether you are already a member or if you're not one.
<img src="/images/blog/wordpress-plugin/become-member-wordpress.png" alt="become member">
If you're not a member you're invited to become one by clicking on a button
<h1>Installing on your own Wordpress</h1>
<h2>Getting started</h2>
If you'd like to add a lock to your site, start by <a href="https://unlock-protocol.com/blog/create-first-lock/">deploying your first lock</a>.
While the lock is deploying you should install this plugin. From the administration of your Wordpress.org website, in the <code>Plugins</code> section, click on the <code>Add New</code> button and search for <code>Unlock Protocol</code> in the search bar.
<img src="/images/blog/wordpress-plugin/search-plugin.png" alt="search plugin">
Once installed, check the plugin's settings to add the address of the lock that you have deployed.
<img src="/images/blog/wordpress-plugin/plugin-settings.png" alt="plugin settings">
<h2>Writing locked stories</h2>
The plugin provides you with "Blocks" which can be used in the <a href="https://wordpress.org/gutenberg/">Gutenberg Editor</a> (WordPress 5.0 and later), for both posts and pages. We provide 3 different blocks:
<ul>
<li>The locked block: a block whose content (rich text) is visible to non-members.</li>
<li>The unlocked block: a block whose content (rich text) is visible only to members.</li>
<li>The checkout button block: a block with a button to let you add a button for people to become members. This button will not be visible for members.</li>
</ul>
Once your story includes the content you need, you can preview its content like any other WordPress post or page. We recommend the use of a web3 wallet (such as <a href="https://metamask.io/">MetaMask</a>) which supports multiple accounts so that you can easily toggle between accounts which are already members and accounts which are not members yet!
PS: like <a href="https://github.com/unlock-protocol/unlock/">all of our code</a>, this plugin is fully open source, you can find it on Github: <a href="https://github.com/unlock-protocol/unlock-wordpress-plugin">Unlock Wordpress Plugin</a>
If you're using the WordPress plugin, we'd love to get your feedback and learn from you about ways it could be better! We're also working on several new additions for which we'd love to find early adopters, please get in touch!


Last month, we introduced [Unlock for tickets](/blog/introducing-tickets): a unique ethereum based ticketing application.
It lets anyone sell tickets to their events as keys to an Unlock lock. Attendees receive a unique Non Fungible Token and [the application](https://tickets.unlock-protocol.com/) even lets the organizers verify if the tickets are valid at check-in. Like any other lock, keys can be priced [using an ERC20 token](/blog/erc20-locks) like DAI for organizers whose costs are in US Dollars, or a specific utility token for organizers who want to leverage their own coins!

Today, we're excited to announce a broad sponsorship effort for anyone who uses tickets to organize an Ethereum or Bitcoin related event for any event until December 31st 2019.

Our sponsorship package is simple:

- Use a lock to sell tickets, using Ether or DAI,
- We will match ticket sales up to 3 DAI per key sold, for up to 1,000 tickets sold.

We will also help you by _promoting your event_, guide you through the set-up of your event page as well as _design a custom NFT image_ that all of your participants will receive in their web3 wallet (check this one from the [Berlin Open Source Salon](https://tickets.unlock-protocol.com/event/0x98c0cbf0e9525f1a6975a51c9d5e8e063c034d6d), or the [NFT Dev Meetup](https://tickets.unlock-protocol.com/event/0x5865Ff2CBd045Ef1cfE19739df19E83B32b783b4)).

If you're running an ethereum meetup, a DeFi group, a hackathon, reach out to us via email hello@unlock-protocol.com and tell us more about the event you're organizing: we'd love to help!


Today, we're excited to announce a broad sponsorship effort for anyone who uses tickets to organize an Ethereum or Bitcoin related event for any event until December 31st 2019.

Use our tickets application and receive up to $3,000 in sponsorships!

Event Sponsorship!

Last month, we introduced <a href="/blog/introducing-tickets">Unlock for tickets</a>: a unique ethereum based ticketing application.
It lets anyone sell tickets to their events as keys to an Unlock lock. Attendees receive a unique Non Fungible Token and <a href="https://tickets.unlock-protocol.com/">the application</a> even lets the organizers verify if the tickets are valid at check-in. Like any other lock, keys can be priced <a href="/blog/erc20-locks">using an ERC20 token</a> like DAI for organizers whose costs are in US Dollars, or a specific utility token for organizers who want to leverage their own coins!
Today, we're excited to announce a broad sponsorship effort for anyone who uses tickets to organize an Ethereum or Bitcoin related event for any event until December 31st 2019.
Our sponsorship package is simple:
<ul>
<li>Use a lock to sell tickets, using Ether or DAI,</li>
<li>We will match ticket sales up to 3 DAI per key sold, for up to 1,000 tickets sold.</li>
</ul>
We will also help you by promoting your event, guide you through the set-up of your event page as well as design a custom NFT image that all of your participants will receive in their web3 wallet (check this one from the <a href="https://tickets.unlock-protocol.com/event/0x98c0cbf0e9525f1a6975a51c9d5e8e063c034d6d">Berlin Open Source Salon</a>, or the <a href="https://tickets.unlock-protocol.com/event/0x5865Ff2CBd045Ef1cfE19739df19E83B32b783b4">NFT Dev Meetup</a>).
If you're running an ethereum meetup, a DeFi group, a hackathon, reach out to us via email hello@unlock-protocol.com and tell us more about the event you're organizing: we'd love to help!

Today, we're excited to unveil our work on donations. In the last few years, it has become clear that the tech industry needs to have a deep reflection about Open Source: who works on it, how they are being paid, who supports them... Companies like [OpenCollective](https://opencollective.com/) have laid the groundwork by providing tools for open source developers to raise funds and organize their work. Earlier this year, Github [introduced sponsorship support](https://github.blog/2019-05-23-announcing-github-sponsors-a-new-way-to-contribute-to-open-source/) for repositories; letting maintainers show options to support them.

![sponsor unlock](/images/blog/unlock-donations/sponsor-unlock.png)
_Become a member to Unlock from Github, and Unlock comments in this blog!_

As you may know, Unlock is a **protocol for memberships**. A sponsor is a member of a unique club: the club of people which help someone do their work "for free" for the rest of the world. Today, with a [simple tool](https://donate.unlock-protocol.com/about.html), creators can easily use their locks to raise funds for their work and create their own membership.

# More than money

Of course, supporting Open Source works _starts_ with financial support, but it does not stop there. With Unlock, members receive their very own Non Fungible Token (a key!) which publicly shows their support (and reminds them of it in their own crypto wallets!). You can find the list of keys I own on [this OpenSea page](https://opensea.io/accounts/0xe5cd62ac8d2ca2a62a04958f07dd239c1ffe1a9e).

One of the benefits of using Ethereum here rather than a private database is that these tokens can be utilized in additional context, such as being displayed anywhere like [our blue checkmark](https://unlock-protocol.com/blog/blue-checkmark-nft/)!

Like any non fungible tokens, a supporter may also change their mind, and could either burn their token or transfer it to someone else.

Additionally, the membership itself can be reutilized to eventually grant access to additional features. As Taylor from MyCrypto puts it in their [Unlock donation page](https://donate.unlock-protocol.com/?thank-you=VGhhbmsgeW91IGZvciBjaG9vc2luZyB0byBiZSBhIE15Q3J5cHRvIHN1cHBvcnRlciEg4p2k77iPCgpBdCB0aGlzIHRpbWUsIHlvdXIgc3VwcG9ydCBpcyBhIHNpbXBsZSBkb25hdGlvbiB0aGF0IGhlbHBzIHVzIGNvbnRpbnVlIHdvcmtpbmcgdG8gYnJpbmcgeW91IHByb2R1Y3RzLgoKSW4gdGhlIGZ1dHVyZSB3ZSdsbCBiZSBmdXJ0aGVyIGRldmVsb3BpbmcgdGhpcyBmdW5jdGlvbmFsaXR5IHdpdGggdGhlIFVubG9jayBQcm90b2NvbCB0ZWFtIHRvIHJld2FyZCBzdXBwb3J0ZXJzIHdpdGggdGhpbmdzIGxpa2UgY3VzdG9tIHRoZW1lcywgc3dhZywgYW5kIG1vcmUuCgotVGF5bG9yICYgVGVhbSBNeUNyeXB0bw==&config=eyJwZXJzaXN0ZW50Q2hlY2tvdXQiOnRydWUsImljb24iOiJodHRwczovL2Fzc2V0cy51bmxvY2stcHJvdG9jb2wuY29tL3RtcC9teS1jcnlwdG8ucG5nIiwiY2FsbFRvQWN0aW9uIjp7ImRlZmF1bHQiOiJTdXBwb3J0IHRoZSBNeUNyeXB0byB0ZWFtIGFuZCB1bmxvY2sgeW91ciBtZW1iZXJzaGlwIHRvZGF5IVxuXG5Zb3UgY2FuIG1ha2UgYSBkb25hdGlvbiBieSBwdXJjaGFzaW5nIGEga2V5IHVzaW5nIHlvdXIgRXRoZXJldW0gd2FsbGV0LiBUaGUga2V5IGlzIGEgbm9uIGZ1bmdpYmxlIHRva2VuIHdoaWNoIHJlcHJlc2VudHMgeW91ciBtZW1iZXJzaGlwLiAifSwibG9ja3MiOnsiMHgxNGU4MTE5NmU2MGIxMjg1MjdkYjAzZDQwYmRiYTAwNzEwNzc3ODA1Ijp7Im5hbWUiOiJNeUNyeXB0byBNZW1iZXJzIn19fQ==&):

> Thank you for choosing to be a MyCrypto supporter! ❤️

> At this time, your support is a simple donation that helps us continue working to bring you products.

> In the future we'll be further developing this functionality with the Unlock Protocol team to reward supporters with things like custom themes, swag, and more.

> -Taylor & Team MyCrypto

# Getting started

Join [MyCrypto](https://github.com/MyCryptoHQ/mycrypto), [WalletConnect](WalletConnect) and [Eth Gas Reporter](https://github.com/cgewecke/eth-gas-reporter) and receive donations on Github with Unlock! Let's get started.

- The first step is to [deploy your first lock](https://unlock-protocol.com/blog/create-first-lock/). We'd recommend starting with a low price (1 DAI) and short duration (30 days), as well as maybe a limited number of members (100!). These early adopters will probably be your biggest fans! You can also, now or later, add another more expensive lock for other members.

- Then, hop onto our helper page to generate the right configuration for the donation page. You can pick an URL, set up your own call to action, as well as a thank you note that members will be able to see. Add the lock address from the previous step, as well as its name. Once generated you will see a JSON blob that you need to save as file named <code>.unlock-protocol.config.js</code> at the root of your Github repository.

- Once it is saved, you need to head over to your project's settings pages. In the "Features" tab there should be a "Sponsorship" section. Make sure it is enabled. ![enable sponsorship](/images/blog/unlock-donations/enable-sponsorship.png)

- After enabling sponsorships, click on the "Set up sponsor button". This will let you edit a file named `.github/FUNDING.yml` which can also be found in your repository. Replace the last line with Make sure to change `<ORG>/<REPO>` with the actual values for your own repository (you can also certainly use a user repository instead of an organization). `custom: https://donate.unlock-protocol.com/?r=<ORG>/<REPO>`

We'd love to know if you added a sponsorship button through Unlock. Please, let us know in the comments below, maybe we'll become members too!

A sponsor or a donor is a member of a unique club; the club of people and organizations which help someone do their work "for free" for the rest of the world. Unlock can easily be used to create sponsorships!

Easily add a sponsorship button to your Github repository, using Unlock!

Unlock Donations

Today, we're excited to unveil our work on donations. In the last few years, it has become clear that the tech industry needs to have a deep reflection about Open Source: who works on it, how they are being paid, who supports them... Companies like <a href="https://opencollective.com/">OpenCollective</a> have laid the groundwork by providing tools for open source developers to raise funds and organize their work. Earlier this year, Github <a href="https://github.blog/2019-05-23-announcing-github-sponsors-a-new-way-to-contribute-to-open-source/">introduced sponsorship support</a> for repositories; letting maintainers show options to support them.
<img src="/images/blog/unlock-donations/sponsor-unlock.png" alt="sponsor unlock">
Become a member to Unlock from Github, and Unlock comments in this blog!
As you may know, Unlock is a protocol for memberships. A sponsor is a member of a unique club: the club of people which help someone do their work "for free" for the rest of the world. Today, with a <a href="https://donate.unlock-protocol.com/about.html">simple tool</a>, creators can easily use their locks to raise funds for their work and create their own membership.
<h1>More than money</h1>
Of course, supporting Open Source works starts with financial support, but it does not stop there. With Unlock, members receive their very own Non Fungible Token (a key!) which publicly shows their support (and reminds them of it in their own crypto wallets!). You can find the list of keys I own on <a href="https://opensea.io/accounts/0xe5cd62ac8d2ca2a62a04958f07dd239c1ffe1a9e">this OpenSea page</a>.
One of the benefits of using Ethereum here rather than a private database is that these tokens can be utilized in additional context, such as being displayed anywhere like <a href="https://unlock-protocol.com/blog/blue-checkmark-nft/">our blue checkmark</a>!
Like any non fungible tokens, a supporter may also change their mind, and could either burn their token or transfer it to someone else.
Additionally, the membership itself can be reutilized to eventually grant access to additional features. As Taylor from MyCrypto puts it in their <a href="https://donate.unlock-protocol.com/?thank-you=VGhhbmsgeW91IGZvciBjaG9vc2luZyB0byBiZSBhIE15Q3J5cHRvIHN1cHBvcnRlciEg4p2k77iPCgpBdCB0aGlzIHRpbWUsIHlvdXIgc3VwcG9ydCBpcyBhIHNpbXBsZSBkb25hdGlvbiB0aGF0IGhlbHBzIHVzIGNvbnRpbnVlIHdvcmtpbmcgdG8gYnJpbmcgeW91IHByb2R1Y3RzLgoKSW4gdGhlIGZ1dHVyZSB3ZSdsbCBiZSBmdXJ0aGVyIGRldmVsb3BpbmcgdGhpcyBmdW5jdGlvbmFsaXR5IHdpdGggdGhlIFVubG9jayBQcm90b2NvbCB0ZWFtIHRvIHJld2FyZCBzdXBwb3J0ZXJzIHdpdGggdGhpbmdzIGxpa2UgY3VzdG9tIHRoZW1lcywgc3dhZywgYW5kIG1vcmUuCgotVGF5bG9yICYgVGVhbSBNeUNyeXB0bw==&#x26;config=eyJwZXJzaXN0ZW50Q2hlY2tvdXQiOnRydWUsImljb24iOiJodHRwczovL2Fzc2V0cy51bmxvY2stcHJvdG9jb2wuY29tL3RtcC9teS1jcnlwdG8ucG5nIiwiY2FsbFRvQWN0aW9uIjp7ImRlZmF1bHQiOiJTdXBwb3J0IHRoZSBNeUNyeXB0byB0ZWFtIGFuZCB1bmxvY2sgeW91ciBtZW1iZXJzaGlwIHRvZGF5IVxuXG5Zb3UgY2FuIG1ha2UgYSBkb25hdGlvbiBieSBwdXJjaGFzaW5nIGEga2V5IHVzaW5nIHlvdXIgRXRoZXJldW0gd2FsbGV0LiBUaGUga2V5IGlzIGEgbm9uIGZ1bmdpYmxlIHRva2VuIHdoaWNoIHJlcHJlc2VudHMgeW91ciBtZW1iZXJzaGlwLiAifSwibG9ja3MiOnsiMHgxNGU4MTE5NmU2MGIxMjg1MjdkYjAzZDQwYmRiYTAwNzEwNzc3ODA1Ijp7Im5hbWUiOiJNeUNyeXB0byBNZW1iZXJzIn19fQ==&#x26;">Unlock donation page</a>:
<blockquote>
Thank you for choosing to be a MyCrypto supporter! ❤️
</blockquote>
<blockquote>
At this time, your support is a simple donation that helps us continue working to bring you products.
</blockquote>
<blockquote>
In the future we'll be further developing this functionality with the Unlock Protocol team to reward supporters with things like custom themes, swag, and more.
</blockquote>
<blockquote>
-Taylor &#x26; Team MyCrypto
</blockquote>
<h1>Getting started</h1>
Join <a href="https://github.com/MyCryptoHQ/mycrypto">MyCrypto</a>, <a href="WalletConnect">WalletConnect</a> and <a href="https://github.com/cgewecke/eth-gas-reporter">Eth Gas Reporter</a> and receive donations on Github with Unlock! Let's get started.
<ul>
<li>
The first step is to <a href="https://unlock-protocol.com/blog/create-first-lock/">deploy your first lock</a>. We'd recommend starting with a low price (1 DAI) and short duration (30 days), as well as maybe a limited number of members (100!). These early adopters will probably be your biggest fans! You can also, now or later, add another more expensive lock for other members.
</li>
<li>
Then, hop onto our helper page to generate the right configuration for the donation page. You can pick an URL, set up your own call to action, as well as a thank you note that members will be able to see. Add the lock address from the previous step, as well as its name. Once generated you will see a JSON blob that you need to save as file named <code>.unlock-protocol.config.js</code> at the root of your Github repository.
</li>
<li>
Once it is saved, you need to head over to your project's settings pages. In the "Features" tab there should be a "Sponsorship" section. Make sure it is enabled. <img src="/images/blog/unlock-donations/enable-sponsorship.png" alt="enable sponsorship">
</li>
<li>
After enabling sponsorships, click on the "Set up sponsor button". This will let you edit a file named <code>.github/FUNDING.yml</code> which can also be found in your repository. Replace the last line with Make sure to change <code>&#x3C;ORG>/&#x3C;REPO></code> with the actual values for your own repository (you can also certainly use a user repository instead of an organization). <code>custom: https://donate.unlock-protocol.com/?r=&#x3C;ORG>/&#x3C;REPO></code>
</li>
</ul>
We'd love to know if you added a sponsorship button through Unlock. Please, let us know in the comments below, maybe we'll become members too!


Twitter's blue checkmark has generated a lot of attention over the years. This week, Ethereum's Vitalik Buterin rightfully [noted](https://twitter.com/VitalikButerin/status/1164490401765572611) that the blue checkmark was a status symbol. Last week-end, [Dani Grant](https://twitter.com/thedanigrant) released a [fun Chrome extension](dani.town/nfts) which will show a Twitter users' NFT on their twitter profile.

Yesterday, we deployed a lock which lets anyone purchase a Blue Checkmark. [Get yours now](https://unlock-blue-checkmark.glitch.me/). It's cheap: 0.01 ether and we'll donate the proceeds to SHE256. Also, Dani was kind enough to merge a [pull request](https://github.com/danigrant/nft-twitter-ext/commit/d81615e05f902ec67db09d638a0e1b8eac160fd0) on her extension so that if someone owns the NFT blue checkmark, it will actually show on their Twitter profile ;)

![Dani, Verified](/images/blog/blue-checkmark-nft/dani-verified.png)

At Unlock, we believe that Non Fungible Tokens can be badges to show "membership", and yes, the Twitter Checkmark is an identifier for, as Vitalik calls it _the blue checkmark class_.

It turns out that Twitter's system is very much broken right now. Nobody knows what it really means to have a checkmark but we can't argue that in the days of deep fakes, having some kind of "labels" on the social web is a very useful pattern to identify people (or bots!) based on their affiliations for example.

Our Blue Checkmark Lock is obviously a joke and a fun experiment, but it shows the power of NFT which exist "outside" of the space for which they're created. Using Non Fungible Tokens, rather than records on Twitter's databases means that other applications could re-use these labels and maybe expand them. For example, wouldn't it be useful for Github to show some of the tags from StackOverflow? I'd love [my RSS creds](https://stackoverflow.com/help/badges/4540/rss?userid=73987) to be visible on my Github profile!

What other kinds of memberships would you want to see represented as Non Fungible Tokens?


Locks are the core of the Unlock protocol. They are smart contracts deployed on the Ethereum chain which lets your community become members by purchasing keys to your lock.

A fun experiment to show how Non Fungible Tokens can be used to represent badges!

A blue check-mark NFT

Twitter's blue checkmark has generated a lot of attention over the years. This week, Ethereum's Vitalik Buterin rightfully <a href="https://twitter.com/VitalikButerin/status/1164490401765572611">noted</a> that the blue checkmark was a status symbol. Last week-end, <a href="https://twitter.com/thedanigrant">Dani Grant</a> released a <a href="dani.town/nfts">fun Chrome extension</a> which will show a Twitter users' NFT on their twitter profile.
Yesterday, we deployed a lock which lets anyone purchase a Blue Checkmark. <a href="https://unlock-blue-checkmark.glitch.me/">Get yours now</a>. It's cheap: 0.01 ether and we'll donate the proceeds to SHE256. Also, Dani was kind enough to merge a <a href="https://github.com/danigrant/nft-twitter-ext/commit/d81615e05f902ec67db09d638a0e1b8eac160fd0">pull request</a> on her extension so that if someone owns the NFT blue checkmark, it will actually show on their Twitter profile ;)
<img src="/images/blog/blue-checkmark-nft/dani-verified.png" alt="Dani, Verified">
At Unlock, we believe that Non Fungible Tokens can be badges to show "membership", and yes, the Twitter Checkmark is an identifier for, as Vitalik calls it the blue checkmark class.
It turns out that Twitter's system is very much broken right now. Nobody knows what it really means to have a checkmark but we can't argue that in the days of deep fakes, having some kind of "labels" on the social web is a very useful pattern to identify people (or bots!) based on their affiliations for example.
Our Blue Checkmark Lock is obviously a joke and a fun experiment, but it shows the power of NFT which exist "outside" of the space for which they're created. Using Non Fungible Tokens, rather than records on Twitter's databases means that other applications could re-use these labels and maybe expand them. For example, wouldn't it be useful for Github to show some of the tags from StackOverflow? I'd love <a href="https://stackoverflow.com/help/badges/4540/rss?userid=73987">my RSS creds</a> to be visible on my Github profile!
What other kinds of memberships would you want to see represented as Non Fungible Tokens?

Unlock is a protocol for memberships. Members of a given community often have access to perks, content or features which are just for them. For example, members (and only them!) of our blog can read and leave comments.

# Scout

Today, we're very excited and proud to announce that our friends at [Scout](https://scout.cool/) have added locks to their dashboards.

Scout provides analytics for Ethereum smart contracts. It provides unique (and real time) insights into economics and governance of on chain protocols.

For example, it provides a very useful dashboard to inspect the [state of the Aragon network](https://scout.cool/aragon/mainnet), or the state of the [Set Protocol](https://scout.cool/setprotocol/mainnet).

Of course, they also added a [dashboard for Unlock](https://scout.cool/unlockprotocol/mainnet), where you can view the total number of locks deployed, the balances of Ether or DAI across all locks, and even all the latest key purchases.

![Scout dashboard for Unlock](/images/blog/unlocking-scout/unlock-scout-dashboard.png)

However, we only wanted to grant access to members of our community, so, unless you already have a valid key to our lock, here is what you'll see:

![Scout is locked](/images/blog/unlocking-scout/scout-locked.png)
Click that button: it's free

We're very excited to see other web3 applications use Unlock to limit access to their content or features only to owners of keys for a given lock.
One of the really interesting features is that you do not need a user account on our blog, nor one on Scout: your Ethereum address is your identity and if you own a key, you are member of the lock!

Kuan, founder at Scout adds:

> "Unlock protocol is the easiest off the shelf solution that can enable our customers to control access of their dashboards. And it is blockchain native!"

If you're considering adding a Scout dashboard to your smart contract give the scout team your lock address!

Our friends at Scout use React for their front-end application (like we do!) and they used [our React tutorial](/blog/integratating-unlock-react), but we provide more details on how to integrate any front end application on [this wiki page](https://github.com/unlock-protocol/unlock/wiki/Integrating-Unlock-on-your-site): add a lock to your content today! Our team is here to help you...

Our friends at Scout have integrated Unlock on the Unlock dashboard. Here's how it works

Unlocking Scout

Unlock is a protocol for memberships. Members of a given community often have access to perks, content or features which are just for them. For example, members (and only them!) of our blog can read and leave comments.
<h1>Scout</h1>
Today, we're very excited and proud to announce that our friends at <a href="https://scout.cool/">Scout</a> have added locks to their dashboards.
Scout provides analytics for Ethereum smart contracts. It provides unique (and real time) insights into economics and governance of on chain protocols.
For example, it provides a very useful dashboard to inspect the <a href="https://scout.cool/aragon/mainnet">state of the Aragon network</a>, or the state of the <a href="https://scout.cool/setprotocol/mainnet">Set Protocol</a>.
Of course, they also added a <a href="https://scout.cool/unlockprotocol/mainnet">dashboard for Unlock</a>, where you can view the total number of locks deployed, the balances of Ether or DAI across all locks, and even all the latest key purchases.
<img src="/images/blog/unlocking-scout/unlock-scout-dashboard.png" alt="Scout dashboard for Unlock">
However, we only wanted to grant access to members of our community, so, unless you already have a valid key to our lock, here is what you'll see:
<img src="/images/blog/unlocking-scout/scout-locked.png" alt="Scout is locked">
Click that button: it's free
We're very excited to see other web3 applications use Unlock to limit access to their content or features only to owners of keys for a given lock.
One of the really interesting features is that you do not need a user account on our blog, nor one on Scout: your Ethereum address is your identity and if you own a key, you are member of the lock!
Kuan, founder at Scout adds:
<blockquote>
"Unlock protocol is the easiest off the shelf solution that can enable our customers to control access of their dashboards. And it is blockchain native!"
</blockquote>
If you're considering adding a Scout dashboard to your smart contract give the scout team your lock address!
Our friends at Scout use React for their front-end application (like we do!) and they used <a href="/blog/integratating-unlock-react">our React tutorial</a>, but we provide more details on how to integrate any front end application on <a href="https://github.com/unlock-protocol/unlock/wiki/Integrating-Unlock-on-your-site">this wiki page</a>: add a lock to your content today! Our team is here to help you...


![introducing tickets](/images/blog/introducing-tickets/introducing-tickets.jpg)

The Unlock Protocol isn't just a way to pay to access services on the internet.

We’re building a protocol that can be used to unlock access to _anything_ - and while that means [content, software
licenses and more](https://unlock-protocol.com/blog/ways-to-unlock-the-web/), we also want to help people sell access
things in the real world.

In the future, the Unlock Protocol may be used to sell tickets for transportation, as a way to seamlessly manage room
access in hotels and holiday rentals, and as a way to prove you've paid for a membership. Today, we're starting with
events.

You can buy a ticket to the [Berlin Open Source Salon](https://berlin.opensourcesalon.com/) with DAI using Unlock.
[Visit the Unlock event page](https://tickets.unlock-protocol.com/event/0x98c0cbF0e9525f1a6975A51c9D5E8e063c034D6D),
purchase a ticket, and then show your special QR code at the door. Your ticket will be validated on the blockchain.

![Berlin Open Source Salon ticket page](/images/blog/introducing-tickets/boss-tickets.png)

## How tickets work with Unlock

Every Unlock transaction - whether for content, an event, software licenses, or anything else - works by selling a _key_
to a _lock_ using Ethereum. Tickets are no different.

![Unlock ticket creation screen](/images/blog/introducing-tickets/create-an-event.png)

Once a lock has been created, creators have access to a number of ways to use it: different applications that sit on top of
the Unlock Protocol. The ticketed event application allows you to save a date, title, description, and location for the
event. These aren't stored on the blockchain itself: instead, they create a database record that references the lock's
Ethereum address.

An attendee with an Ethereum wallet like Metamask can buy a key with one click. The event page then shows a QR code, which
contains the user's public key and a signed version of the lock address. This can be verified at the door with a
commodity QR code reader, which are now built into the camera apps in every major mobile operating system.

## Multi-use locks

On the Unlock Protocol, you're not limited to using one application per lock. This means that a ticketed event and a
content paywall can run on the same lock: if you purchase access to the paywall, you'll be able to get access to the
event, or if you purchase access to the event, you'll automatically be able to view protected content.

This means you can very easily string together a series of connected assets to sell as a bundle. Perhaps you want to
give premium customers for your publication access to a series of workshops. Or you want to provide access to a custom
social network for attendees of your event. As we add more applications, and third parties build on top of our open
protocol to add even more, the possibilities will become endless.

## Learn more

We're building Unlock in the open. You can always say hello in our [Discord](https://discord.gg/Ah6ZEJyTDp), join
us on our [Github project](https://github.com/unlock-protocol/unlock/) or reach out at
[hello@unlock-protocol.com](mailto:hello@unlock-protocol.com). We would love to hear from you.


Now you can buy tickets to real-world events using Ethereum and the Unlock Protocol.

Now you can buy tickets to real-world events using Ethereum

Introducing Tickets

<img src="/images/blog/introducing-tickets/introducing-tickets.jpg" alt="introducing tickets">
The Unlock Protocol isn't just a way to pay to access services on the internet.
We’re building a protocol that can be used to unlock access to anything - and while that means <a href="https://unlock-protocol.com/blog/ways-to-unlock-the-web/">content, software
licenses and more</a>, we also want to help people sell access
things in the real world.
In the future, the Unlock Protocol may be used to sell tickets for transportation, as a way to seamlessly manage room
access in hotels and holiday rentals, and as a way to prove you've paid for a membership. Today, we're starting with
events.
You can buy a ticket to the <a href="https://berlin.opensourcesalon.com/">Berlin Open Source Salon</a> with DAI using Unlock.
<a href="https://tickets.unlock-protocol.com/event/0x98c0cbF0e9525f1a6975A51c9D5E8e063c034D6D">Visit the Unlock event page</a>,
purchase a ticket, and then show your special QR code at the door. Your ticket will be validated on the blockchain.
<img src="/images/blog/introducing-tickets/boss-tickets.png" alt="Berlin Open Source Salon ticket page">
<h2>How tickets work with Unlock</h2>
Every Unlock transaction - whether for content, an event, software licenses, or anything else - works by selling a key
to a lock using Ethereum. Tickets are no different.
<img src="/images/blog/introducing-tickets/create-an-event.png" alt="Unlock ticket creation screen">
Once a lock has been created, creators have access to a number of ways to use it: different applications that sit on top of
the Unlock Protocol. The ticketed event application allows you to save a date, title, description, and location for the
event. These aren't stored on the blockchain itself: instead, they create a database record that references the lock's
Ethereum address.
An attendee with an Ethereum wallet like Metamask can buy a key with one click. The event page then shows a QR code, which
contains the user's public key and a signed version of the lock address. This can be verified at the door with a
commodity QR code reader, which are now built into the camera apps in every major mobile operating system.
<h2>Multi-use locks</h2>
On the Unlock Protocol, you're not limited to using one application per lock. This means that a ticketed event and a
content paywall can run on the same lock: if you purchase access to the paywall, you'll be able to get access to the
event, or if you purchase access to the event, you'll automatically be able to view protected content.
This means you can very easily string together a series of connected assets to sell as a bundle. Perhaps you want to
give premium customers for your publication access to a series of workshops. Or you want to provide access to a custom
social network for attendees of your event. As we add more applications, and third parties build on top of our open
protocol to add even more, the possibilities will become endless.
<h2>Learn more</h2>
We're building Unlock in the open. You can always say hello in our <a href="https://discord.gg/Ah6ZEJyTDp">Discord</a>, join
us on our <a href="https://github.com/unlock-protocol/unlock/">Github project</a> or reach out at
<a href="mailto:hello@unlock-protocol.com">hello@unlock-protocol.com</a>. We would love to hear from you.


Unlock is a [protocol for memberships](/blog/protocol-for-membership). It helps creators monetize by selling access keys to their community - fans, supporters, or even simple users - by helping them deploy a lock and sell access keys to this lock (they can chose their currency, price, the duration of the keys and the number of keys they want to sell).

We decided to create a lock for members of our community. It's a good way for us to show what's possible with a lock. Since our goal was not to make money, we decided to charge _0 eth_ for the keys.

When integrating the lock on this blog, we decided to reflect the membership status in 3 different things:

1. The lower bar at the bottom of every page. ⬇️ Since I am a member, mine shows this:

![member bar](/images/blog/unlock-blog/member-bar.png)

2. On each post, **members** can view and leave [comments](#comments).

3. We've locked some exclusive content. For example, this Google Slideshow from a presentation made at Betaworks about [Non Fungible Tokens](/blog/non-fungible-tokens-betaworks).

# Bundling

The lock we use on this blog is in no way limited to this site. We could (and will, stay tuned...) re-use the lock on different sites or applications. As a matter of fact, you could even add _our_ lock to _your_ site or application, if you wanted to only grant access to people who are part of our community. That approach is how creators can deploy "bundles": a single lock is used on several different websites or applications!

# Several locks

Another important detail is that we could very well add multiple locks to this site. If we did so, a single key to any of the locks would unlock the whole page.

Maybe we'd have a lock for our most loyal fans (with a limit on the number of keys), and maybe we'd have another one for everyone else, using another currency or one which we would "share" with several other applications to be part of their bundle. The possibilities are endless.

# A Non Fungible Token

Of course, this website implements what we call [optimistic unlocking](/blog/hello-optimistic-unlocking/). Basically, our blog will treat you as a member as soon as you've sent the transaction, without waiting for it to have completed mining. But, once the transaction actually goes through, you will receive you unique access key. It is a non fungible token and you can [view them all on this page](https://opensea.io/assets/unlock-blog-members).

Like all other non fungible tokens, you can trade your keys! For example, I am auctionning my key to this very blog for 0.1Eth: get it for free here, [or buy it from me](https://opensea.io/assets/0xCE62D71c768aeD7EA034c72a1bc4CF58830D9894/2/sell#!)!


We've put a lock on our own blog! Members can leave comments, read exclusive content and will receive a Non Fungible Token.

Unlock this blog

Unlock is a <a href="/blog/protocol-for-membership">protocol for memberships</a>. It helps creators monetize by selling access keys to their community - fans, supporters, or even simple users - by helping them deploy a lock and sell access keys to this lock (they can chose their currency, price, the duration of the keys and the number of keys they want to sell).
We decided to create a lock for members of our community. It's a good way for us to show what's possible with a lock. Since our goal was not to make money, we decided to charge 0 eth for the keys.
When integrating the lock on this blog, we decided to reflect the membership status in 3 different things:
<ol>
<li>The lower bar at the bottom of every page. ⬇️ Since I am a member, mine shows this:</li>
</ol>
<img src="/images/blog/unlock-blog/member-bar.png" alt="member bar">
<ol start="2">
<li>
On each post, members can view and leave <a href="#comments">comments</a>.
</li>
<li>
We've locked some exclusive content. For example, this Google Slideshow from a presentation made at Betaworks about <a href="/blog/non-fungible-tokens-betaworks">Non Fungible Tokens</a>.
</li>
</ol>
<h1>Bundling</h1>
The lock we use on this blog is in no way limited to this site. We could (and will, stay tuned...) re-use the lock on different sites or applications. As a matter of fact, you could even add our lock to your site or application, if you wanted to only grant access to people who are part of our community. That approach is how creators can deploy "bundles": a single lock is used on several different websites or applications!
<h1>Several locks</h1>
Another important detail is that we could very well add multiple locks to this site. If we did so, a single key to any of the locks would unlock the whole page.
Maybe we'd have a lock for our most loyal fans (with a limit on the number of keys), and maybe we'd have another one for everyone else, using another currency or one which we would "share" with several other applications to be part of their bundle. The possibilities are endless.
<h1>A Non Fungible Token</h1>
Of course, this website implements what we call <a href="/blog/hello-optimistic-unlocking/">optimistic unlocking</a>. Basically, our blog will treat you as a member as soon as you've sent the transaction, without waiting for it to have completed mining. But, once the transaction actually goes through, you will receive you unique access key. It is a non fungible token and you can <a href="https://opensea.io/assets/unlock-blog-members">view them all on this page</a>.
Like all other non fungible tokens, you can trade your keys! For example, I am auctionning my key to this very blog for 0.1Eth: get it for free here, <a href="https://opensea.io/assets/0xCE62D71c768aeD7EA034c72a1bc4CF58830D9894/2/sell#!">or buy it from me</a>!

![new lock](/images/blog/first-lock/new-lock.jpg)

A lock is a way to represent a _membership_. Each member has a key to the lock which they can purchase from the lock directly.

## So, you want to create your first lock?

First, you need an Ethereum wallet. On desktop, the most popular is [Metamask](https://metamask.io/), but things should work similarly with any Ethereum wallet. For now, we recommend using a desktop computer rather than mobile device because the UI is much cleaner there.

Go to the _Creator Dashbboard_ on [https://unlock-protocol.com](https://unlock-protocol.com). This creator dashboard will help you manage your locks (create them, update them, or view some data about them...).

For now, it should be empty and look like this:

![empty dashboard](/images/blog/first-lock/empty-dashboard.png)

On the top left, you can see which network you're connected to. Ethereum has a single "Main Network" and several test networks such as Goerli. Make sure you're on the Main Network. You can also view which address your wallet is currently using.

On the top right, a button lets you create a lock. Once you click on it, a form appears and lets you prepare your first lock.

![create lock form](/images/blog/first-lock/create-lock-form.png)

When creating a lock, each field can be edited.

### The name

First, the name. The lock's name is stored on-chain and is used by other applications which may want to show information about your lock and its keys, such as [Etherscan](https://etherscan.io/), [OpenSea](https://opensea.io/) and more. Use something descriptive but fairly short as every character counts toward the fees you'll pay to deploy this lock.

### The Duration

Each key has a duration. At the end of the duration the membership is considered "expired" and should not grant access to the key holder. In this case, members can renew to make their key valid again.

The duration is expressed in seconds in the smart contract, but given the inherent latency of the blockchain we believe that durations shorter than 1 day are not practical. Most creators will pick durations of months to years.

Picking the right duration is useful because a key holder can "cancel" their key by sending it back to the lock to get a refund. The elapsed duration is used to assess the amount to be refunded.

### The number of keys

As the lock owner you can choose how many people can purchase keys. This is important because many membership are "exclusive". For example, an artist may want to only allocate a small number of keys to their truest fans (in that case, they would have several locks, each represented a _level_ of membership).

It is possible to set an unlimited number of members.

Note that expired keys still count toward the maximum number of keys, but as we've seen, keys can be extended (by sending another payment to the lock) and they can be transfered as well...

### Key Price

The price of each key is made of 2 things: the currency and the amount of that currency. By default, our UI uses Ether, the native Ethereum currency, but the UI also leaves the option to use [DAI](https://makerdao.com/en/dai), a stable coin, whose value is always 1$. (Our smart contract actually supports any [ERC20](https://www.investopedia.com/news/what-erc20-and-what-does-it-mean-ethereum/). Please get in touch if you need to deploy a lock which uses something else than DAI!)

Once you've chosen your currency, you can set the price you want, from 0 to billions!

### Submitting

Make sure all values you've chosen are correct. Most of them cannot be changed once the lock has been deployed.

After submitting, your wallet will ask for a confirmation. Deploying a lock is fairly "expensive" in gas (at least 4M), because it a a full contract deployed under your address. Unless deploying the lock is urgent, you should probably set a low gas price.

It is important that you wait for the lock to be deployed, because its address (starting with `0x`) will only be final then, and that address will be used by your members to send payments and you don't want them to send a payment to the wrong address!

### No Ether? No problem

Locks themselves can be transfered. This means that we can create the locks for you and transfer them to you. If we do this, you do not even need Ether to pay for the fees. We will create the lock based on your needs and send it to your address so you can start using it ASAP!

## Next!

That's it! Your lock has now been created. The next step is to integrate it on your website to let people become members. See the wiki page on [how to integrate unlock](https://github.com/unlock-protocol/unlock/wiki/Integrating-Unlock-on-your-site), and a few posts on how to integrate this in your CMS, such as [Known](/blog/integrating-unlock-with-known/), or inside a front end web framework, such as [React](/blog/integratating-unlock-react/).

If you need help for your own stack, please, reach out, we're here to help!

A lock is a smart contract which holds the list of members of your community.

Creating your first lock

<img src="/images/blog/first-lock/new-lock.jpg" alt="new lock">
A lock is a way to represent a membership. Each member has a key to the lock which they can purchase from the lock directly.
<h2>So, you want to create your first lock?</h2>
First, you need an Ethereum wallet. On desktop, the most popular is <a href="https://metamask.io/">Metamask</a>, but things should work similarly with any Ethereum wallet. For now, we recommend using a desktop computer rather than mobile device because the UI is much cleaner there.
Go to the Creator Dashbboard on <a href="https://unlock-protocol.com">https://unlock-protocol.com</a>. This creator dashboard will help you manage your locks (create them, update them, or view some data about them...).
For now, it should be empty and look like this:
<img src="/images/blog/first-lock/empty-dashboard.png" alt="empty dashboard">
On the top left, you can see which network you're connected to. Ethereum has a single "Main Network" and several test networks such as Goerli. Make sure you're on the Main Network. You can also view which address your wallet is currently using.
On the top right, a button lets you create a lock. Once you click on it, a form appears and lets you prepare your first lock.
<img src="/images/blog/first-lock/create-lock-form.png" alt="create lock form">
When creating a lock, each field can be edited.
<h3>The name</h3>
First, the name. The lock's name is stored on-chain and is used by other applications which may want to show information about your lock and its keys, such as <a href="https://etherscan.io/">Etherscan</a>, <a href="https://opensea.io/">OpenSea</a> and more. Use something descriptive but fairly short as every character counts toward the fees you'll pay to deploy this lock.
<h3>The Duration</h3>
Each key has a duration. At the end of the duration the membership is considered "expired" and should not grant access to the key holder. In this case, members can renew to make their key valid again.
The duration is expressed in seconds in the smart contract, but given the inherent latency of the blockchain we believe that durations shorter than 1 day are not practical. Most creators will pick durations of months to years.
Picking the right duration is useful because a key holder can "cancel" their key by sending it back to the lock to get a refund. The elapsed duration is used to assess the amount to be refunded.
<h3>The number of keys</h3>
As the lock owner you can choose how many people can purchase keys. This is important because many membership are "exclusive". For example, an artist may want to only allocate a small number of keys to their truest fans (in that case, they would have several locks, each represented a level of membership).
It is possible to set an unlimited number of members.
Note that expired keys still count toward the maximum number of keys, but as we've seen, keys can be extended (by sending another payment to the lock) and they can be transfered as well...
<h3>Key Price</h3>
The price of each key is made of 2 things: the currency and the amount of that currency. By default, our UI uses Ether, the native Ethereum currency, but the UI also leaves the option to use <a href="https://makerdao.com/en/dai">DAI</a>, a stable coin, whose value is always 1$. (Our smart contract actually supports any <a href="https://www.investopedia.com/news/what-erc20-and-what-does-it-mean-ethereum/">ERC20</a>. Please get in touch if you need to deploy a lock which uses something else than DAI!)
Once you've chosen your currency, you can set the price you want, from 0 to billions!
<h3>Submitting</h3>
Make sure all values you've chosen are correct. Most of them cannot be changed once the lock has been deployed.
After submitting, your wallet will ask for a confirmation. Deploying a lock is fairly "expensive" in gas (at least 4M), because it a a full contract deployed under your address. Unless deploying the lock is urgent, you should probably set a low gas price.
It is important that you wait for the lock to be deployed, because its address (starting with <code>0x</code>) will only be final then, and that address will be used by your members to send payments and you don't want them to send a payment to the wrong address!
<h3>No Ether? No problem</h3>
Locks themselves can be transfered. This means that we can create the locks for you and transfer them to you. If we do this, you do not even need Ether to pay for the fees. We will create the lock based on your needs and send it to your address so you can start using it ASAP!
<h2>Next!</h2>
That's it! Your lock has now been created. The next step is to integrate it on your website to let people become members. See the wiki page on <a href="https://github.com/unlock-protocol/unlock/wiki/Integrating-Unlock-on-your-site">how to integrate unlock</a>, and a few posts on how to integrate this in your CMS, such as <a href="/blog/integrating-unlock-with-known/">Known</a>, or inside a front end web framework, such as <a href="/blog/integratating-unlock-react/">React</a>.
If you need help for your own stack, please, reach out, we're here to help!

React is one of the main JavaScript front end frameworks. Unlock's JavaScript API provides an easy way for any creator to restrict access to content or features.

Here is a tutorial on how to integrate Unlock in your react application. We will create an React application (using [create-react-app](https://github.com/facebook/create-react-app)) which will show the user whether they own a key (unlocked!), or if they need to purchase one (locked). The [code for the application is on Github](https://github.com/unlock-protocol/react-example); you can try it yourself directly on the [corresponding github page](https://unlock-protocol.github.io/react-example/).

We will assume you have already created a react application and that application should behave differently based on whether the user is a member or not.

1. Include the Unlock snippet

We do that by changing the `index.html` (main HTML template) of our application. The following snippet is added the the `<head>` section:

```
<script> (function (d, s) {
 var js = d.createElement(s),
 sc = d.getElementsByTagName(s)[0];
 js.src = "https://paywall.unlock-protocol.com/unlock.latest.min.js";
 sc.parentNode.insertBefore(js, sc);
 }(document, "script"));
</script>
```

Note: this loading technique is non blocking, which means this does not have any performance impact on rendering.

2. Add the configuration

The snippet inserted above needs to know which lock are used on this page. For this example, we will use a single lock, the one that is already being used on that blog.

```
<script>
 var unlockProtocolConfig = {
 locks: {
 '0xb77030a7e47a5eb942a4748000125e70be598632': {
 name: 'The Unlock Members lock',
 network: 137,
 },
 },
 icon: 'https://unlock-protocol.com/images/svg/unlock-word-mark.svg'
 }
</script>
```

3. Writing the component which listens to Unlock

React components can have their own local state (which can be passed down to their children components). Here, our state will likely include a `locked` key. The value associated with that key can be any of the 3 following:

- `locked`
- `unlocked`
- `pending`

The `pending` state allows us to not show to the use a "flash" when toggling between the 2 other state. When the page loads, we do not know right away whether the state should be locked or unlocked. Fortunately though, the unlock JavaScript API is very fast (we cache a lot of data) to make sure that, in the vast majority of cases, the user will actually not witness the `pending` state.

```
constructor(props) {
 super(props)
 this.state = {
 locked: "pending" // there are 3 state: pending, locked and unlocked
 }
}
```

React's component have lifecycle methods which let developers integrate with JavaScript API calls. Unlock uses the `window.addEventListener` API to trigger an `unlockProtocol` in order to indicate the state of the lock for the current visitor, so our component needs to implement the following method when it is mounted:

```
componentDidMount() {
 window.addEventListener("unlockProtocol", this.unlockHandler)
}
```

Note: `this.unlockHandler` will be implemented below.

Similarly, when the component is to be removed, we want to perform some cleanup to avoid wasting the browser's resources.

```
componentWillUnmount() {
 window.removeEventListener("unlockProtocol", this.unlockHandler)
}
```

We need to add our `unlockHandler` in the constructor:

```
constructor(props) {
 super(props)
 this.unlockHandler = this.unlockHandler.bind(this)
 this.state = {
 locked: "pending" // there are 3 state: pending, locked and unlocked
 }
}
```

And we also implement it by using React's `setState` method. Unlock will emit either `locked` or `unlocked`.

```
unlockHandler(e) {
 this.setState(state => {
 return {
 ...state,
 locked: e.detail
 }
 })
}
```

When the state is `locked`, we want to let the user purchase a key. For this, we use the modal provided by the Unlock JavaScript API, but you could very well implement that logic yourself (it would require tinkering with the web3 providers though...)

```
checkout() {
 window.unlockProtocol && window.unlockProtocol.loadCheckoutModal()
}
```

Now that we have the state and ways to invoke a key purchase, we can easily render based on it. This is probably where your app's logic will likely diverge the most, but here is what we did for our demo application:

- if the content is locked, we show a 🔒, anc clicking on it will open the checkout model.
- if the content is unlocked, we show a 🗝!

```
render() {
 const { locked } = this.state
 return (
 <div className="App">
 <header className="App-header">
 {locked === "locked" && (
 <div onClick={this.checkout} style={{ cursor: "pointer" }}>
 Unlock me!{" "}
 
 🔒
 
 </div>
 )}
 {locked === "unlocked" && (
 <div>
 Unlocked!{" "}
 
 🗝
 
 </div>
 )}
 </header>
 </div>
 )
}
```

## Conclusion

Unlock's JavaScript API is very simple and will get out of the way to let you implement behaviors that your application requires.

If the status of the lock is re-used in several components, it might be a good idea to isolate that logic in a single one and pass the state as props to sub-components!

Integrating Unlock with React is straighforward! Here's a quick tutorial on how to get there!

Our Javascript API is very easy to integrate with React!

Integrating Unlock with React

React is one of the main JavaScript front end frameworks. Unlock's JavaScript API provides an easy way for any creator to restrict access to content or features.
Here is a tutorial on how to integrate Unlock in your react application. We will create an React application (using <a href="https://github.com/facebook/create-react-app">create-react-app</a>) which will show the user whether they own a key (unlocked!), or if they need to purchase one (locked). The <a href="https://github.com/unlock-protocol/react-example">code for the application is on Github</a>; you can try it yourself directly on the <a href="https://unlock-protocol.github.io/react-example/">corresponding github page</a>.
We will assume you have already created a react application and that application should behave differently based on whether the user is a member or not.
<ol>
<li>Include the Unlock snippet</li>
</ol>
We do that by changing the <code>index.html</code> (main HTML template) of our application. The following snippet is added the the <code>&#x3C;head></code> section:
<pre><code>&#x3C;script> (function (d, s) {
 var js = d.createElement(s),
 sc = d.getElementsByTagName(s)[0];
 js.src = "https://paywall.unlock-protocol.com/unlock.latest.min.js";
 sc.parentNode.insertBefore(js, sc);
 }(document, "script"));
&#x3C;/script>
</code></pre>
Note: this loading technique is non blocking, which means this does not have any performance impact on rendering.
<ol start="2">
<li>Add the configuration</li>
</ol>
The snippet inserted above needs to know which lock are used on this page. For this example, we will use a single lock, the one that is already being used on that blog.
<pre><code>&#x3C;script>
 var unlockProtocolConfig = {
 locks: {
 '0xb77030a7e47a5eb942a4748000125e70be598632': {
 name: 'The Unlock Members lock',
 network: 137,
 },
 },
 icon: 'https://unlock-protocol.com/images/svg/unlock-word-mark.svg'
 }
&#x3C;/script>
</code></pre>
<ol start="3">
<li>Writing the component which listens to Unlock</li>
</ol>
React components can have their own local state (which can be passed down to their children components). Here, our state will likely include a <code>locked</code> key. The value associated with that key can be any of the 3 following:
<ul>
<li><code>locked</code></li>
<li><code>unlocked</code></li>
<li><code>pending</code></li>
</ul>
The <code>pending</code> state allows us to not show to the use a "flash" when toggling between the 2 other state. When the page loads, we do not know right away whether the state should be locked or unlocked. Fortunately though, the unlock JavaScript API is very fast (we cache a lot of data) to make sure that, in the vast majority of cases, the user will actually not witness the <code>pending</code> state.
<pre><code>constructor(props) {
 super(props)
 this.state = {
 locked: "pending" // there are 3 state: pending, locked and unlocked
 }
}
</code></pre>
React's component have lifecycle methods which let developers integrate with JavaScript API calls. Unlock uses the <code>window.addEventListener</code> API to trigger an <code>unlockProtocol</code> in order to indicate the state of the lock for the current visitor, so our component needs to implement the following method when it is mounted:
<pre><code>componentDidMount() {
 window.addEventListener("unlockProtocol", this.unlockHandler)
}
</code></pre>
Note: <code>this.unlockHandler</code> will be implemented below.
Similarly, when the component is to be removed, we want to perform some cleanup to avoid wasting the browser's resources.
<pre><code>componentWillUnmount() {
 window.removeEventListener("unlockProtocol", this.unlockHandler)
}
</code></pre>
We need to add our <code>unlockHandler</code> in the constructor:
<pre><code>constructor(props) {
 super(props)
 this.unlockHandler = this.unlockHandler.bind(this)
 this.state = {
 locked: "pending" // there are 3 state: pending, locked and unlocked
 }
}
</code></pre>
And we also implement it by using React's <code>setState</code> method. Unlock will emit either <code>locked</code> or <code>unlocked</code>.
<pre><code>unlockHandler(e) {
 this.setState(state => {
 return {
 ...state,
 locked: e.detail
 }
 })
}
</code></pre>
When the state is <code>locked</code>, we want to let the user purchase a key. For this, we use the modal provided by the Unlock JavaScript API, but you could very well implement that logic yourself (it would require tinkering with the web3 providers though...)
<pre><code>checkout() {
 window.unlockProtocol &#x26;&#x26; window.unlockProtocol.loadCheckoutModal()
}
</code></pre>
Now that we have the state and ways to invoke a key purchase, we can easily render based on it. This is probably where your app's logic will likely diverge the most, but here is what we did for our demo application:
<ul>
<li>if the content is locked, we show a 🔒, anc clicking on it will open the checkout model.</li>
<li>if the content is unlocked, we show a 🗝!</li>
</ul>
<pre><code>render() {
 const { locked } = this.state
 return (
 &#x3C;div className="App">
 &#x3C;header className="App-header">
 {locked === "locked" &#x26;&#x26; (
 &#x3C;div onClick={this.checkout} style={{ cursor: "pointer" }}>
 Unlock me!{" "}
 &#x3C;span aria-label="locked" role="img">
 🔒
 &#x3C;/span>
 &#x3C;/div>
 )}
 {locked === "unlocked" &#x26;&#x26; (
 &#x3C;div>
 Unlocked!{" "}
 &#x3C;span aria-label="unlocked" role="img">
 🗝
 &#x3C;/span>
 &#x3C;/div>
 )}
 &#x3C;/header>
 &#x3C;/div>
 )
}
</code></pre>
<h2>Conclusion</h2>
Unlock's JavaScript API is very simple and will get out of the way to let you implement behaviors that your application requires.
If the status of the lock is re-used in several components, it might be a good idea to isolate that logic in a single one and pass the state as props to sub-components!

The wallet. It’s your interface into the blockchain. It lets you transact with the blockchain and in Ethereum’s case also with its smart contracts. You could think of it as an account but its more of an identifier with the crucial difference that you are in possession of it. It’s not stored on a server but lives with you, on your computer, your phone or hardware wallet.

# Control & Transparency

The fact that you’re in full control and the sole owner of your wallet and therefore the means with which you transact with the blockchain are a powerful aspect.

Think about it: your bank account is managed by your bank, the data associated with it (your personal data, but also the data that represents your money) lives on servers that the bank controls, even your credit card is owned by the bank and governed by a cardholder agreement. It’s your money though! And it doesn’t end there. When you’re sending money your transaction is facilitated by the sending and receiving bank, plus the processor (Visa, Mastercard, etc.) and whoever else is in the middle of that transaction (Western Union, Transferwise, Square, Stripe). And then you wonder, where is my money that’s mentioned in my bank account actually physically? The reason this matters is that you are dependent on the bank, their rules, fees and whims. If you take this to an extreme and imagine the bank going bankrupt, because they took on too much risk, you have no control and your money might be gone. On a less extreme level they might not let you do business with them because you fall into a legal gray zone – think Wikileaks or many blockchain projects.


	<img src="/images/blog/digital-cash/digitalcash.jpg" width="400px" alt="BLockchain has many features that make it digital cash.">


# Digital Cash

Blockchain transactions behave more like cash. We have a mutual understanding of the value of our physical money and you own and control the cash that’s in your real world wallet. You hand over the cash without anyone in middle and the transaction is done. This is very similar to the blockchain with a few additional advantages: your blockchain wallet can live in several places and you can transact without having to be in the same physical space. On top of that the Ethereum blockchain (and other blockchain projects) let you create smart contracts that allow you to codify and automate parts of the transaction.

I liked this analogie by [Steven Chien](https://twitter.com/stevenmeets): he calls the internet the “Information Superhighway” – which allowed for the large scale (and cost efficient) distribution of information and the blockchain the “Value Superhighway” – that allow for a large scale and cost efficient but also more equitable distribution of value. It’s a good read, check it out on [Hackernoon](https://hackernoon.com/blockchain-the-value-superhighway-into-your-wallet-9330cec5bf8f).


	<img src="/images/blog/digital-cash/keychain.jpg" width="400px" alt="Towards an access ecosystem.">


# Access

So that’s cool, we have a wallet, we control what’s in it, how we transact and there are no intermediaries. Its also relatively fast all things considered: blockchain transactions sometimes take a while to confirm but in terms of overall settlement its faster than a bank transfer or a credit card transaction (they can take anywhere from 3 to 30 days to complete).

Because there's a ledger of every transaction, apps can easily determine who’s paid for access and unlock it for you. In that sense your wallet is also a keychain.


	<img src="/images/blog/digital-cash/creditcard.jpg" width="400px" alt="One wallet, access to many different things.">


# Beyond Cash

Taking that idea a step further you could start swapping, trading or even bundling keys where one key gives you access to multiple sites or pieces of content that all share the same lock (I wrote about this in our [Multi Use Locks](https://unlock-protocol.com/blog/multi-use-locks/) post if you’re curious about that). The most interesting part is yet to come: ledger plus smart contracts allows users to receive tokens for specific actions – so if you refer a creators content or you’ve paid for access 10 times you could get a kickback.

This feature set is really powerful: imagine if you could get into your WeWork office with your credit card (because you’ve paid for your desk with it) but it also gives you access to the new york times online, gets you bonus points at your local coffee shop and at the end of the day opens up and pays for your car2go or zipcar.

You have thoughts or comments? Reach out I’d love to chat. [@UnlockProtocol](https://twitter.com/UnlockProtocol) or [hello@unlock-protocol.com](mailto:hello@unlock-protocol.com).

A quick exploration into blockchain wallets, their applications and why they're so powerful.

Wallets and their superpowers for users.

Digital Cash. Big Deal.

The wallet. It’s your interface into the blockchain. It lets you transact with the blockchain and in Ethereum’s case also with its smart contracts. You could think of it as an account but its more of an identifier with the crucial difference that you are in possession of it. It’s not stored on a server but lives with you, on your computer, your phone or hardware wallet.
<h1>Control &#x26; Transparency</h1>
The fact that you’re in full control and the sole owner of your wallet and therefore the means with which you transact with the blockchain are a powerful aspect.
Think about it: your bank account is managed by your bank, the data associated with it (your personal data, but also the data that represents your money) lives on servers that the bank controls, even your credit card is owned by the bank and governed by a cardholder agreement. It’s your money though! And it doesn’t end there. When you’re sending money your transaction is facilitated by the sending and receiving bank, plus the processor (Visa, Mastercard, etc.) and whoever else is in the middle of that transaction (Western Union, Transferwise, Square, Stripe). And then you wonder, where is my money that’s mentioned in my bank account actually physically? The reason this matters is that you are dependent on the bank, their rules, fees and whims. If you take this to an extreme and imagine the bank going bankrupt, because they took on too much risk, you have no control and your money might be gone. On a less extreme level they might not let you do business with them because you fall into a legal gray zone – think Wikileaks or many blockchain projects.

	<img src="/images/blog/digital-cash/digitalcash.jpg" width="400px" alt="BLockchain has many features that make it digital cash.">

<h1>Digital Cash</h1>
Blockchain transactions behave more like cash. We have a mutual understanding of the value of our physical money and you own and control the cash that’s in your real world wallet. You hand over the cash without anyone in middle and the transaction is done. This is very similar to the blockchain with a few additional advantages: your blockchain wallet can live in several places and you can transact without having to be in the same physical space. On top of that the Ethereum blockchain (and other blockchain projects) let you create smart contracts that allow you to codify and automate parts of the transaction.
I liked this analogie by <a href="https://twitter.com/stevenmeets">Steven Chien</a>: he calls the internet the “Information Superhighway” – which allowed for the large scale (and cost efficient) distribution of information and the blockchain the “Value Superhighway” – that allow for a large scale and cost efficient but also more equitable distribution of value. It’s a good read, check it out on <a href="https://hackernoon.com/blockchain-the-value-superhighway-into-your-wallet-9330cec5bf8f">Hackernoon</a>.

	<img src="/images/blog/digital-cash/keychain.jpg" width="400px" alt="Towards an access ecosystem.">

<h1>Access</h1>
So that’s cool, we have a wallet, we control what’s in it, how we transact and there are no intermediaries. Its also relatively fast all things considered: blockchain transactions sometimes take a while to confirm but in terms of overall settlement its faster than a bank transfer or a credit card transaction (they can take anywhere from 3 to 30 days to complete).
Because there's a ledger of every transaction, apps can easily determine who’s paid for access and unlock it for you. In that sense your wallet is also a keychain.

	<img src="/images/blog/digital-cash/creditcard.jpg" width="400px" alt="One wallet, access to many different things.">

<h1>Beyond Cash</h1>
Taking that idea a step further you could start swapping, trading or even bundling keys where one key gives you access to multiple sites or pieces of content that all share the same lock (I wrote about this in our <a href="https://unlock-protocol.com/blog/multi-use-locks/">Multi Use Locks</a> post if you’re curious about that). The most interesting part is yet to come: ledger plus smart contracts allows users to receive tokens for specific actions – so if you refer a creators content or you’ve paid for access 10 times you could get a kickback.
This feature set is really powerful: imagine if you could get into your WeWork office with your credit card (because you’ve paid for your desk with it) but it also gives you access to the new york times online, gets you bonus points at your local coffee shop and at the end of the day opens up and pays for your car2go or zipcar.
You have thoughts or comments? Reach out I’d love to chat. <a href="https://twitter.com/UnlockProtocol">@UnlockProtocol</a> or <a href="mailto:hello@unlock-protocol.com">hello@unlock-protocol.com</a>.