Metaverse - NFT Portfolio and Landing Page preview 1

Metaverse - NFT Portfolio and Landing Page

bookmark

Metaverse NFT Portfolio and Landing Page is a static HTML template designed for NFT projects, offering multiple page templates including Mint pages, Collection displays, Blog posts, and Contact forms. The template features 5 homepage car...

HTML

Project Overview

Metaverse NFT Portfolio and Landing Page is a static HTML template designed for NFT projects, offering multiple page templates including Mint pages, Collection displays, Blog posts, and Contact forms. The template features 5 homepage carousel styles, supports wallet connection modals and responsive layouts, making it suitable for cryptocurrency, NFT trading platforms, or metaverse-related websites.

Tech Stack

  • HTML5 / CSS3 / JavaScript (jQuery)
  • Google Fonts (Heebo / Nunito)
  • CSS variables for custom theme colors
  • Responsive layout

Project Structure

text
metaversehtml-10/
├── mainpack/
│   ├── doc/              # Template documentation directory
│   │   ├── index.html    # Documentation entry point
│   │   ├── css/          # Documentation styles
│   │   ├── js/           # Documentation scripts
│   │   └── img/          # Documentation images
│   └── html/             # Actual page files
│       ├── index.html    # Homepage (Sliced Slider)
│       ├── index-2.html  # Homepage (Full Slider)
│       ├── index-3.html  # Homepage (Cards Carousel)
│       ├── index-4.html  # Homepage (3D Carousel)
│       ├── index-5.html  # Homepage (ZigZag Carousel)
│       ├── nft-single.html  # Mint page
│       ├── collection.html  # NFT collection page
│       ├── blog.html         # Blog listing
│       ├── blog-single.html  # Blog detail
│       ├── contact.html      # Contact page
│       ├── css/              # Main stylesheets
│       ├── js/               # Interactive scripts
│       ├── img/              # Page images
│       └── svg/              # SVG icons

Core File Description

  • html/index.html — Default homepage entry, Sliced Slider style
  • html/nft-single.html — NFT Mint page
  • html/collection.html — NFT collection display page
  • html/css/style.css — Main stylesheet defining global colors, layout, and components
  • html/js/jquery.js — jQuery library (core dependency)
  • html/svg/ — Built-in SVG icon set for navigation, social links, etc.

Quick Start

  1. Deploy the mainpack/html directory contents to a server or local web root
  2. Open index.html via a local server (e.g., XAMPP) or directly in a browser
  3. Pages require a local server to run (SVG icon colors may appear abnormal when opening files directly)

Usage Suggestions

  • Modify --mc1 / --mc2 CSS variables to quickly change the theme color scheme
  • All homepage styles share the same CSS; switch between different HTML files to change carousel effects
  • Wallet modal and right-side navigation are pure frontend implementations; connecting to on-chain wallets requires integrating Web3.js / ethers.js
help_outline

FAQ