Tutorial: Magento 2 Promotional Product Markers

This post is about toggling a promotional item such as free shipping in the website. Magento development services provider will share step-by-step tutorial with you regarding the subject.

His most important part of website is to provide calls to action to your visitors to convert them to customers.

Calls to Action are steering mechanisms. I will highlight how to toggle a promotional item like free shipping. You can use this code to render a statement on any template page.

Step to Follow

The first thing to do is to create a Yes/No dropdown attribute. Navigate in your backend to stores > attributes > product.

Click the Add New Feature button. Select input type from as yes/no. Enter your information, including "visible on catalog pages on the storefront." Save and note down your attribute code.

Now when you have a new feature go back to your admin and select "Attribute Set". Unless you have a wide variety of products with multiple attributes sets you can simply select the “default” attribute set.

Once inside this area you will see your newly created attribute on the right-hand side. Just click and drag the attribute into the main area. Save this and go to a product in the backend. Once in a product you will now see the option to set the attribute to Yes or No.

Your attribute is now set up in the backend. To make this visible to your customers we need to go into a template.

For this exercise, we will add the recently viewed items template named, “Viewed_Grid.phtml.” This is in your theme under Magento_Reports. In this template, we will place our code under the product name. Search “Name” by pressing ctrl + f and typing in the word, “Name.” Place the code below just under the Name code.

<?php if ($_item->getAttributeText('free_shipping_toggle')): ?> <?php else: ?> <?php endif; ?>

This is your IF statement. This checks to see if your attribute is toggled to “Yes” If it is it will run the code in the first half of the statement. If it’s not it will run the code after the “Else” section.

So now that we have this what do we want to do? For this exercise, we will have the code render a free shipping icon and statement. To make this user-friendly we will generate a static block.

Go back into the admin area and navigate to content > blocks. Create your block and enter your content. Name your block, “free-shipping-list-maker. “Take that name and enter it into this code snippet:

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

This calls your block into the template. Your code will now look like the snippet below:

<?php if ($_item->getAttributeText('free_shipping_toggle')): ?> <?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('free-shipping-list-marker')->toHtml();?> <?php else: ?> <?php endif; ?>

We are now complete up to the If portion. We need to have an “Else” if the attribute is toggled to “No.”

You can have it say whatever you like. You can even create another static block and put something else in there. For this, we are just going to use a placeholder. That will be.

<p>&nbsp;</p>

The final code is:

<?php if ($_item->getAttributeText('free_shipping_toggle')): ?> <?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('free-shipping-list-marker')->toHtml();?> <?php else: ?> <p>&nbsp;</p> <?php endif; ?>

You can copy and paste this as much as you would like. This code block is highly reusable.

You read the whole post, right? If you have any questions about the steps shared by magento development services providers, you can comment below. You can even feedback for this story and let our readers know how you find it.