Nitroglycerin Pickle Machine

    gatsby-theme-musician

    1.0.5 • Public • Published

    Gatsby Theme Musician

    A Gatsby theme for bands and music artists 🎸🎙

    Demo Site thumbnail

    Features

    • ⏱ Have a landing page up and running in minutes
    • 🔎 Optimized for SEO and social sharing
    • 📱 Mobile-friendly
    • ️⚡️ Fast and performant, with and without Javascript
    • 🤓 Write as little or as much code as you want
    • 🙌🏽 Better with others—endless combination with other Gatsby themes (blog, ecommerce, photo galleries...)
    • 📝 Write your content in plain text, Markdown, HTML elements, and React components thanks to MDX
    • 💅🏽 Customizable, versatile design tokens-based styling with Theme UI

    Read introductory post on DEV.to


    💡 If you have never used Gatsby before, head to their quick start guide or beginner-friendly tutorials.

    📦 Installation

    Option A: Use the starter to create a new site

    🚧 IN PROGRESS 🚧

    Option B: Manually add to your existing site

    npm install --save gatsby-theme-musician
    # or 
    yarn add gatsby-theme-musician

    Add the theme to the plugins array in your gatsby-config.js:

    // gatsby-config.js
    module.exports = {
      plugins: [
        {
          resolve: "gatsby-theme-musician",
        },
      ],
    }

    Start your site. (This step will copy the necessary theme files to your site.)

    gatsby develop

    🛠 Usage

    1) Theme options

    Key Default value Description
    basePath / Root url for landing page
    contentPath content Location of data files

    Example:

    // gatsby-config.js
    module.exports = {
      plugins: [
        {
          resolve: `gatsby-theme-musician`,
          options: {
            // Your site will run at http://localhost:8000/my-band
            basePath: `my-band`,
          },
        },
      ],
    }

    2) Theme configuration

    Configuration files are located in src/gatsby-theme-musician/config. They use the YAML format. These are where you edit theme-specific details such as artist data and site navigation.

    config
    ├── artist.yml # Artist data 
    ├── navigation.yml # Site navigation links 
    └── text_labels.yml # Site text labels 

    💡 See Theme Config documentation for more details.

    3) Content

    By default, content files are located in content unless you specify a different path in the theme options.

    content
    ├── artist-landing-page.mdx
    ├── images
    │   ├── favicon.png
    │   └── placeholder.png
    ├── releases.yml
    ├── sample-page.mdx
    └── shows.yml

    Optionally, you may add images in PNG or JPG format with the following file names.

    • artist-banner.png|jpg — displayed in top full-width banner
    • artist-logotype.png|jpg — displayed in header (in place of artist name)
    • artist-social.png|jpg — used in SEO and social thumbnail metadata

    💡 See Content documentation for more details.


    Have fun! 🤘🏽

    Install

    npm i gatsby-theme-musician

    DownloadsWeekly Downloads

    2

    Version

    1.0.5

    License

    MIT

    Unpacked Size

    124 kB

    Total Files

    56

    Last publish

    Collaborators

    • ekafyi