EB NFT Gallery block can help you showcase your NFT items & collections on your Gutenberg-built website without any hassle. Whether you want to display your NFT items, collections, or wallets, you can do it easily in a stunning gallery view with this Gutenberg block.
Follow this step-by-step guide to display your NFT items & collections using the Essential Blocks NFT Gallery in Gutenberg.
How To Activate EB NFT Gallery Block? #
Make sure you have installed and activated Essential Blocks for Gutenberg on your WordPress site. Essential Blocks comes with a modular control that can give you the freedom to enable or disable any block you want.
To activate the NFT Gallery block in Gutenberg, navigate to Essential Blocks → ‘Blocks’. Then, toggle to enable the block as shown below. After that, click on the ‘Save’ button.
How To Configure NFT Gallery In Gutenberg? #
First, navigate to WordPress dashboard Page → ‘Add New’ and create a new or select the page if you already have a created one where you want to add your NFT Gallery.
Next, hit the ‘+’ button and find the ‘NFT Gallery’ block. Click on the block to insert it into your web page.
Alternatively, you can click on the ‘+’ icon, search ‘NFT Gallery’ block in the search bar and you will find the block there. Simply drag and drop the block as shown.
Now, click on the ‘Settings’ icon. A side panel will appear on the right side of your page. From here you can configure and personalize the contents and appearance of the EB NFT Gallery block.
Navigate to the Block→ General→ General option. From this option, you can add your OpenSea API Key for showcasing the NFT items & collections to your website. To collect your OpenSea API key, please check out this documentation.
With Essential Blocks NFT Gallery, you can display both Items and your collections.
From the ‘Type’ option, select whether to display your items or collections. If you choose the ‘Items’ option, then you can filter them via ‘Collection Slug’ and ‘Wallet Id’ from the ‘Filter By’ option.
Now, go to your OpenSea profile and collect your collection slug to filter your NFT Gallery by the ‘Collection Slug’ option. Simply paste your collection slug on the ‘Collection Slug’ option. Adjust the limit of your NFT items and choose the view from the ‘Limit’ option.
If you choose the ‘Wallet Id’ option from the ‘Filter by’ option, you have to insert your OpenSea ‘Wallet Id’ on the ‘Wallet Address’ option.
Now, go to your OpenSea profile and collect your wallet id to filter your NFT Gallery by the ‘Wallet Id’ option. Simply paste your wallet id on the ‘Wallet Address’ option. Adjust the limit of your NFT items and choose the view from the ‘Limit’ option.
From the ‘Layout’ option, you can choose a layout type and choose how you want to showcase your NFT tokens on your website. You will find multiple presets of grid & list view that you can select for displaying your NFT gallery.
You can also control how many items you want to show on a single row from the ‘Items Per Row’ option. In your NFT Gallery, you can toggle to enable or disable your NFT image, title, current owner, creator, price, last sale, and call to action button.
From the ‘Style’ tab you will find the options to customize your NFT Gallery appearance. Adjust the column gap and row gap to give a stunning appearance on your website.
From the ‘Item Box Styles’ you can adjust the box designs and add background style for your NFT items and NFT collections. You can also add a border & shadow from there as well.
From the ‘Image’ option, you can also adjust the height and width of your NFT images and adjust the margin and border radius from there.
In addition, you will find the option to customize the title, creator/ owner, and price for your NFT gallery there. Make changes as you want to adjust this block with your web page.
From the ‘Button’ option, you can customize the call to action button and make it compelling for your visitors without any hassle. Choose any color from there and make customization as you want.
From the ‘Advanced’ tab you can customize this block and make more changes. Go to the ‘Advanced’ tab and adjust the ‘Margin’ and ‘Padding’ for your NFT Gallery.
Besides, there you will find the options for adding a background to your NFT Gallery and customizing the border. Make the changes as you wish to attract your visitors with your NFT items and collections.
From the ‘Responsive Control’ option, you can hide your NFT gallery from any specific device. Now, go to the ‘Animation’ option and add motion effects to the NFT gallery just the way you want. You can also adjust the animation speed and delay from there.
Final Outcome #
After making all the changes hit the ‘Publish/ Update’ button to showcase your NFT Gallery block on your website. Check out how the ‘EB NFT Gallery’ will appear on your WordPress website.
This is how you can add the EB NFT Gallery block in Gutenberg easily.
Getting stuck? Feel free to contact our support for further assistance.