Metaplex was announced on the 3rd June 2021 with the mission to “elevate creators and artists above the influence of traditional gatekeepers”. It released open source code that anyone can deploy, so that they could mint their own NFT’s about $0.50 USD, host decentralised shops and run their own auctions. Wallets then also supported displaying the NFT’s.
Now we have a vibrant economy of NFT marketplaces spread out across the Solana ecosystem and we keep getting bigger by the day! This post will help you setup your own store in ~10 minutes and then go on to list and sell your own NFT’s and customise the shop to your liking!
To Cut Straight to the “Chase”
The end product will look like the Metaplex store deployed at https://annamal.art
This is a little NFT store that was setup for a digital artist who is growing their skills and wanted to get setup online. Moving from a static WordPress website to an NFT store made sense for this artist, so we decided to help out.
Watch the Step by Step Video to Deploy Metaplex
Check out this video created by Chase over at the Metaplex YouTube channel, where he takes you through forking the metaplex repository from Github, setup your domain name, enable Github pages hosting, clone the repo locally, configure your app and deploy !
Forking the Metaplex Repo
Login to Github and visit the metaplex repo. Then hit the fork button to setup a repo at your own Github account.
Cloning the Repo
From your local development folder on your computer, within terminal/command prompt type “git clone https://github.com/yourusername/metaplex.git”.
Changing your Deployment Github Address
Changing your Store’s Wallet Address
If you don’t have a Solana wallet, then you need to get one.
We recommend you get setup on Phantom and create your wallet address there. It is best to install the browser plugin to make navigating and linking your wallet easy for future Metaplex transactions. You should also try to send $20+ worth of Solana to this wallet, to give you enough money to mint a bunch of NFT’s and list some auctions.
Setting up Free Github Pages hosting
Initially you have enable Github Pages hosting on your repo. Just visit your repo settings and select ‘pages’. Enter in your custom domain name and hit save.
Changing your DNS Record for your Domain
If you have a custom domain for your metaplex store, you will need to point your domain’s DNS records to Github pages hosting. To do this just add a CNAME record, with the Name equal to “yourdomain.com”, and the content as your “Github username”.github.io
To read more about using Github custom domains read their official documentation.
Configure your domain DNS CNAME file
As instructed in the video, you need to drop a new file called “CNAME” (no file extension) into the js > packages > web > public folder.
Now that you have configured your metaplex store you should be able to hit “Check Again” under custom domain section. This time around you should get a “Your site published at yourdomain.com” and “not a red” error message.
Time to Start Building Your Metaplex Store
In JS directory of your local repo run the “yarn” command from terminal/command prompt. This will go off and start downloading dependencies to your local machine.
For me this took 16.7 minutes!
The run the “yarn bootstrap” command to check dependencies are all good, which took 10 seconds for me.
You can actually run “yarn start” from your js folder to spin up a web server locally and browse.
Building for the real thing
Let’s run the “yarn build” command.
As you can see the build folder got created. This took 5 minutes.
Then run the “cd packages” and “cd web” commands to navigate to the web folder.
Once you are in the right directory, run the “yarn deploy” command. Boom done.
You should be able to navigate to your website domain in your browser to see your new metaplex store deployed! If this hasn’t happened, then please watch the video again. Otherwise you can visit the official Metaplex Discord or the Solhack Discord > NFT Channel for help!
Deployment Update! (August 2021)
Within the Github Repo there is now a Deploy.md guide! Which steps you through deploying on Github Pages, Github Pages with Custom Domain and Vercel !
We are actually looking to move to Vercel shortly as it doesn’t appear to have any issues with custom domain deployments, white page of death or 404 errors.
Let’s Start Adding NFT’s to our new Metaplex Store!
Once you finish deploying your code, you will have a very basic black website with some menu items at the top and a connect wallet button.
Based off your wallet address you put in the js > packages > web > .env file, you should now be the owner of the store. Hit the connect your wallet to link your wallet address. We recommend you setup your wallet, and install the browser plugin or Phantom.
Time to Mint your NFT’s !
Once you have connected your wallet, you will see the two buttons at the top right, being the “create” and the “sell” buttons. Create is for minting NFT’s. Sell is for setting up auctions.
In this tutorial we will be minting PNG images, however you can mint a whole bunch of other media formats too!
How “Not” to Mint
I run into this bug and pulled my hair out. Whatever you do, make sure your filenames DO NOT HAVE SPACES IN THEM.
Otherwise you will have blank NFT’s and waste some money.
I’m hoping to fix my beloved “Emerald and Mint” NFT one day. However, she is just a fallen NFT SOLdier, will come back for her one day. A big thanks to Flappy for helping me figure out this bug and how to get me on the right track. You can check out his NFT Store over at PigeonSol.
How to Correctly Mint NFT’s with Metaplex
So now I new about the “SPACE BUG”, I went and renamed all the files that not have spaces.
This time round it is smooth sailing, if your phantom wallet pops up saying to “Approve Transactions” go for it.
There is some terminology that is takes a bit of learning. If you have any questions on exactly what “Maximum Supply” is don’t be afraid to search the Metaplex Developer Guide for the specific term.
The creator can set the “Maximum Supply” of the master edition just like a regular mint on Solana, with the main difference being that each print is a numbered edition created from it.Metaplex Developer Guide
You can also set a % royalties for your NFT so that every future sale pays back a percentage to the original creator.
On average, at the time of writing, it cost about $0.50 USD to mint a new NFT. Sometimes it took 30 seconds to upload to Arweave decentralised storage, other times it completely failed and I have to recover my NFT (via the simple notification at the top of page). I’m sure these kinks will be ironed in the future as Metaplex becomes more prominent as a widely accepted open source NFT platform. From here you can see all your NFT’s under the “Artworks” tab or after you connect your wallet, under the “My Items” tab.
Selling an NFT
Probably the first thing to do is to load up the conversion price of $SOL in the background. I typically use CoinGecko as it is pretty reliable. Throughout the minting and selling process you are asked to specify in SOL how much you would like price floors and bid increments. Best to double-check when you enter these values so you don’t make the floor $10000 by accidentally putting the decimal in the wrong spot.
After making sure you have your wallet connected, click the “Sell” button at the top right. From here you are presented with 4 options for different ways to sell your NFT that you have already minted. I found the “Limited Edition” method has a lot of transactions to get it setup and it actually costs more than just selling your unique NFT “Sell an Existing Item”. The price in USD can range from $1.13 to $3. So make sure you have some SOL in your wallet to cover this.
For this example we are going to sell an existing item. I set the price floor is $1 USD and the incremental bid increase (tick) size to be $0.50 USD (this fluctuates depending on the price of SOL). You have to specify this in $SOL so again, use Coingecko for this to make sure you don’t finger fault it.
Great! Auction is now live 😉 When I was doing this it was costing approximately $1.14 USD to list a unique item for auction.
Your auction now magically appears on the front page of your metaplex store!
When you click and go to the auction you can see this NFT is unique and only has 1 minted copy.
Listed another unique NFT to add a bit of colour to the site! Looking good
Selling Limited Editions of your NFT’s
As mentioned, selling “limited editions” does cost a bit more, at the time of writing due to the multiple transaction approvals it was costing between $3 to $5 USD. Hit the sell button at the top right, then “Limited Edition”. Add your NFT and specify how many copies you will sell.
These will be sold at auction with the top 30 bidders getting a copy.
Set the price floor and tick size, same as before.
So for a cup a coffee you can list your NFT and auction it with limited editions on Solana. Pretty neat!
You can also view all the NFT’s in your Phantom wallet too!
Customising your Metaplex Marketplace
If you want to customise your shop, you have quite a few options. It is best to learn how to use github and deploy changes using the simple commands (as per the video).
So open up your favourite text editor in your cloned repository directory. I like to use Visual Studio Code. Then open up the following files (filename at the top).
Now you have to go back to the JS directory and run:
Git it a minute for Github Pages to deploy and hit refresh. If you have a browser cache you may want to clear that, holding shift and hitting refresh normally does the trick.
Looking better now! I like it 🙂
Free hosting and code base, with some bugs
Overall, it is pretty awesome to be able to host your own decentralised and free Metaplex site. It may cost you $20 or so to list all your NFT’s and auction them, so hopefully you can get sale prices to come in higher than that you don’t lose money. Either way, it is a great learning experience and you can tell your friends you now are a NFT minter! Like anything Metaplex is only a month old and has some bugs. I found the filename SPACE issue annoying, also sometimes my auctions wouldn’t complete and I would have to try again paying another $3. The Metaplex Github Issues page has 30 issues ongoing, so I’m sure there are some Solhackers pumping through these now 😀
The Metaplex Store is Alive!
Check it out over at https://annamal.art
Another happy customer, thanks to Solana and the metaplex ecosystem!
Any idea on why after connecting the phantom wallet, the buttons to Create and Sell don’t appear?
Would recommend you hit up Phantom Discord directly for this question.
Wonderful post! I am playing with the metaplex framework now.
“Customising your Metaplex Marketplace” section,
there is no js/pacakges/public/index.html and js/pacakges/web/index.html file. Which git branch is in the sample?
Jow would i go about posting 10000 at once? Struggling to find any help on this
To mint 10000 at once, you could try Candy Machine.
This was made after this original guide was created.
Check it out!
Thank you for this knowledge. Really appreciate it.
Best regards, ZK