How to Display Products by Custom Attribute in Magento 2?

In this tutorial, I am going to explain how to display products by custom attribute in Magento 2. Sometimes it becomes a challenge when someone asks for filtered products. But it’s not as difficult as it looks.

You may also be interested in:

1. Add and Customize Custom Tab on Product Page Magento 2

How to Create Custom Attribute in Magento 2?

Step 1: Create a new Attribute “sample” in Admin

Login to Magento Admin > Store > Attributes > Product

On the Product Attributes page, you can see by default Magento provides us with some predefined attributes.

I will create a new attribute.

Click on Add New Attribute

Now we need to fill out details in the New Product Attribute and then Save.

Let’s explain the fields:

Default Label: Label text attributes that recognize the attribute.

Catalog Input Type for Store Owner: Determines the kind of data and input control that is used to manage the product from the Admin store. For example, Text Field, Text Area, Yes/No, Date, Dropdown, etc.

Values required: To request that a value be entered in this field before the record can be saved, set Values Required to Yes.

For Advanced Attribute Properties:

Attribute Code: Identifier unique to internal use.

Scope: Limits the use of an attribute to a specific store view or website. Options: Store View / Website / Global.

Default value: Assigns a start value for the attribute ease of data entry.

Use in Filter Options: Determines if the attribute is used as a filter control at the top of columns in the grid. Options: Yes / No.

Mark: The filter control is only shown when Add to Column Options is turned on.

For more details, see the Commerce User Guide.

Step 2: Assign Product Attribute to Attribute Set in Magento?

Login to Admin > Stores > Attributes > Attribute Set

Attribute Sets page > Select set from the list > Drag and Drop Unassigned Attributes to Group

Note: By default, Magento gives us a set of attributes which is Default, but we can also add a new set of attributes.

Once you drag and drop it:

Here we have successfully created a Custom Attribute and assigned it to the Attribute Set. I hope you understand.

How to Create Static block for Sample Products?

Here are a few steps:

1. Login Admin > Content
2. Elements > Blocks
3. Add New Block
4. Fill in the mandatory field of the New Block page.
5. In edit section > click on Insert Widget > choose Widget Type from the dropdown (Catalog Product List)
6. Fill title of widget in Title field
7. In the conditions field, find your attribute (in my case, it’s Sample), choose it and set it to yes.
8. Click on Insert Widget > Save block

Call Static Block in CMS Page:

{{block class="Magento\Cms\Block\Block" block_id="your_block_identifier"}}

In my case, the identifier is sample_products

{{block class="Magento\Cms\Block\Block" block_id="sample_products"}}

Call Static Block in Template (.phtml) file:

<?php
echo $this->getLayout()
->createBlock('Magento\Cms\Block\Block')
->setBlockId('your_block_identifier')
->toHtml();
?>

Call Static Block in Layout (XML) File:

<referenceContainer name="content">
<block class="Magento\Cms\Block\Block" name="block_identifier">
<arguments>
<argument name="block_id" xsi:type="string">block_identifier</argument>
</arguments>
</block>
</referenceContainer>

Hope this article helped you to understand how to create a custom attribute and display products. If you have any queries, you can ask me directly over email at aryansrivastavadesssigner@gmail.com or contact me here.

If you want a live session, do direct ping me on LinkedIn I will arrange an online session on weekends.

If you like this article, you can buy me a cup of coffee Buy me a Coffee.