How to Create Prominent Badges for Collections in Electro

The Electro theme makes it easy to create customizable prominent badges for your collections. This guide will teach you how to set up and configure prominent collection badges using the Electro theme’s metaobject and metafield functionality.

About Prominent Badge In Electro ThemeClick to copy 2222

Prominent badges in the Electro theme allow you to highlight collections and draw attention to specific products. The badges are displayed prominently on collection cards.

The Electro theme enables full customization of collection badges through the use of metaobjects and metafields in Shopify. You can customize the color, text, and visibility of the badges.

How To Create Prominent Badges For Collections In ElectroClick to copy 2222

To create a prominent badge, you will need to create a metaobject and a metafield. A metaobject is a custom data type that you can use to store information about your products and collections. A metafield is a custom field that can be attached to products and collections to store additional information.

To create a metaobject for a prominent badge, follow these steps:

Step 1: Creating Metaobject For Your Collection BadgesClick to copy 2222

The first step in creating Electro theme prominent badges is to define a metaobject that will store the badge details:

  1. Go to Content > Metaobjects in your Shopify admin.

  1. Click Add definition to create a new metaobject.

  1. Name the metaobject “Badge“.

  1. Add two fields:
  • A Color field named “Color” for the badge background

  • A Single line text field named “Content” for the badge text

  1. Click Save.

This creates the template that will be used for your badge metaobject entries.

Step 2: Customizing Prominent BadgesClick to copy 2222

  1. Go to Content > Metaobjects

  1. Click Add entry and select the “Badge” metaobject.

  1. In the Color field, set the desired background color for the badge.

  1. In Content, add the desired text.

  1. Click Save.

Step 3: Adding The Metafield To CollectionsClick to copy 2222

Now you need to attach the metaobject to collections:

  1. Go to Settings > Custom data > Metafields > Collections.

  1. Click Add definition to create a new metafield.

  1. Set the Name and Key to “badge“, Namespace to “collection“, and Type to “Metaobject“.

  1. In Reference, select the “Badge” metaobject you just created.

  1. Click Save.

This metafield allows you to assign badge entries to specific collections.

Step 4: Setting Badges For A CollectionClick to copy 2222

To set a badge for a collection in the Electro theme:

  1. Edit the collection and scroll down to Metafields.
  1. Click the “Badge“.

  1. Choose the entry you have set up for the Metaobject in step 2.

  1. Click Save to apply the badge for the collection.

Step 5: Enabling Badges For The Collection CardClick to copy 2222

Finally, enable the badges:

  1. Go to Online Store > Themes > Theme Settings

  1. Scroll down to the Collection card.

  1. Check the “Enable prominent badges” option.

The badges will now display on your collection cards!

Following these steps allows full control over your Electro theme prominent collection badges. Stand out with custom-designed badges for your key product collections!

Frequently Asked QuestionsClick to copy 2222

How can I use the Prominent Badge for Collection in Electro? Create Metaobject and Metafield
Can I change the color for the Badge? Yes
Is it possible to add other text besides “New” to the Badge? Yes

Navigate this category