npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@sklinet/strapi-plugin-block-gallery

v1.0.2

Published

Creates gallery of Blocks, so you can see what they look like.

Downloads

7

Readme

👋 Intro

✨ Key features

  • Automation: Plugin automatically creates content-type "Blocks", and fills it with Strapi components that are created in folders which contain "block" in their name.
  • Images: You can add images to each block from your content-manager, and see them in plugins homepage. You will also be able to see the image in larger size inside modal window.
  • External URLs: You can also add external links to blocks if your images aren't stored in media library !

🔧 Installation

Inside your Strapi app, add the package:

With npm:

npm install @sklinet/strapi-plugin-block-gallery

With yarn:

yarn add @sklinet/strapi-plugin-block-gallery

In config/plugins.js file add:

"block-gallery":{
    enabled:true
};

If you do not yet have this file, then create and add:

module.exports = () => ({
    "block-gallery":{
      enabled:true
    };
})

In order to see any components inside Block Gallery, you will have to store your components inside folders, which contains "block" in its name.

Plugin will fetch all components from these folders, and automatically create records into "Blocks" content-type with its name and displayName on first visit of its homepage.

Block name and displayName is value from yourProject/src/components/folderWithBlocks/block-name.json inside info object.

⚠️Please make sure, that all your components have correctly set info object in their schema, otherwise you'll see your block name as collectionName from the .json file.⚠️

Correctly set info object:

// yourProject/src/components/folderWithBlocks/block-name.json
{
  "collectionName": "components_block_test_blocks",
  "info": {
    "name": "TestBlock", // <- Set your name to previously set displayName
    "displayName": "Block: Test", // <- Set your displayName to any name you want to be displayed
    "icon": "align-justify"
  },
  "options": {},
  "attributes": {
    "sectionId": {
      "type": "string"
    }
  }
}

Then run build:

npm run build

or

yarn build

After starting your project, navigate into plugins homepage (from left panel), and your blocks will be generated.

In order to add images or external links, update your records inside content-manager Blocks content-type.

⚠️ Requirements

Strapi v4.x.x+

Node 14 - 16

Tested on v4.4.1