How to change the wishlist button color once the products added to the wishlist.I am getting an error while using a controller.



2)https://magento.stackexchange.com/a/266125/57334 (Controller)

  • magento.stackexchange.com/questions/255810 Commented Feb 11, 2021 at 6:19
  • namespace Heart\List\Controller\Index; error. my path : app\code\Heart\List\Controller\Index.php code : codeshare.io/G8EXJB
    – zus
    Commented Feb 11, 2021 at 8:24
  • what is the error ? Commented Feb 11, 2021 at 8:34
  • syntax error, unexpected 'List' (T_LIST), expecting identifier (T_STRING)
    – zus
    Commented Feb 11, 2021 at 8:55
  • after update the folder name List to Listcolor, the issue solved
    – zus
    Commented Feb 11, 2021 at 8:57

1 Answer 1


Using a custom controller to change Wishlist button(icon) color once the product added to Wishlist.


namespace Vendor\Module\Controller\Index;

class Wishlist extends \Magento\Framework\App\Action\Action {

    public function __construct(
        \Magento\Framework\App\Action\Context $context,
        \Magento\Wishlist\Helper\Data $wishlistHelper,
        \Magento\Framework\Controller\Result\JsonFactory $jsonFactory
        ) {
            $this->wishlistHelper = $wishlistHelper;
            $this->jsonFactory = $jsonFactory;

    public function execute() {
        $result = $this->jsonFactory->create();
        $data = $this->wishlistHelper->getWishlistItemCollection()->getData();

        return $result->setData(['status' => 200, 'items' => $data]);


<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
    <router id="standard">
        <route frontName="customwishlist" id="customwishlist">
            <module name="Devcrew_Wishlistcustom"/>

Add the following Script in theme's list.phtml or wishlist.phtml Depend upon Theme :

    require(['jquery'], function($){
    url: '<?php echo $this->getUrl('customwishlist/index/wishlist') ?>',
    method: 'get',
    dataType: 'json',
    success: function(data) {
    var wislistAddesCheckData = data;
    var itemLenth = wislistAddesCheckData.items.length;
    for(i=0;i<itemLenth; i++){
    var wislistAddedProductId = wislistAddesCheckData.items[i].product_id;
    $(".product-id-"+wislistAddedProductId).attr('src','<?php echo $img; ?>');

Add this class in wishlist Div or Image:

class="product-id-<?php echo $block->getProduct()->getId();?>"
  • Thank you, working perfectly.
    – zus
    Commented Feb 17, 2021 at 9:58
  • hi hafiz, i am working on a google business review, i got the response but every time i manually copy paste the Authorization key, how to handle this case, i tried lot i need some expert guidance, this is my first google API task, magento.stackexchange.com/q/339482/57334
    – zus
    Commented Jun 14, 2021 at 7:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.