0

I took the code from inside: vendor/magento/module-checkout/view/frontend/templates/cart/noItems.phtml

and i'm overiding it here: app/design/frontendvendor/namespace/module/Magento_Checkout/templates/cart/noItems.phtml

enter image description here

I usually don't work on a lot of frontend css stuff so i feel like this is a super dumb question. Here's what i've done below and it's not reflecting on the frontend.

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/**  @var $block \Magento\Checkout\Block\Cart */
?>
<div class="cart-empty">
    <?= $block->getChildHtml('checkout_cart_empty_widget') ?>
    <p><?= $block->escapeHtml(__('You have no items in your shopping cart.')) ?></p>
    <p><?= $block->escapeHtml(
        __(
            'Click <a href="%1" style="color:red;">here</a> to continue shopping.',
            $block->escapeUrl($block->getContinueShoppingUrl())
        ),
        ['a']
    ) ?>
    </p>
    <?= $block->getChildHtml('shopping.cart.table.after') ?>
</div>
<script type="text/x-magento-init">
{
    "*": {
        "Magento_Checkout/js/empty-cart": {}
    }
}
</script>

All I'm trying to do is make "here" more noticeable by turning it red or bold so i did some inline styling.. it doesn't matter but i've failed. Probably something to do with less i'd imagine???

3 Answers 3

1

escapeHtml will not allow style tag. So, if you want to forcefully add that style attribute inside a tag. You can do like this below way :

Old Content :

<p><?= $block->escapeHtml(
        __(
            'Click <a href="%1" style="color:red;">here</a> to continue shopping.',
            $block->escapeUrl($block->getContinueShoppingUrl())
        ),
        ['a']
    ) ?>

Replace Content :

<p><?= 
    __(
        'Click <a href="%1" style="color:red;">here</a> to continue shopping.',
        $block->escapeUrl($block->getContinueShoppingUrl())
    )
?>

After that clean cache and check it.

2
  • 1
    Thanks for the info, I did not know that the escapeHtml would not allow style attributes.
    – Head
    Oct 5, 2022 at 14:55
  • Happy Coding !! Oct 6, 2022 at 7:13
1

As you only need to highlight here text on the empty Shipping cart page, override .phtml file is not good idea because this file will be updated in the future by magento codebase and you are able to highlight here text by CSS: There are 2 options:

  1. If you would like to implement on the theme, create < your theme dir>/Magento_Checkout/web/css/source/_extend.less file.

  2. If you would like to implement on the module, create < your module dir>/view/frontend/web/css/source/_extend.less file.

Add this code:

& when (@media-common = true) {
.checkout-cart-index {
    .cart-empty {
        a {
           color: red;
        }
    }
}

Btw, your override file path is incorrect, so you can't see your override in frontstore. app/design/frontendvendor/namespace/module/Magento_Checkout/templates/cart/noItems.phtml

it should be: app/design/frontendvendor/namespace/Magento_Checkout/templates/cart/noItems.phtml

0

It should work, first check is that file correctly override change some content and cache flush and check (if your working on developer mode), if not change the content then check override path correctly it should be

app\design\frontend\<VENDOR_NAME>\<THEME_NAME>\Magento_Checkout\templates\cart\noItems.phtml
1
  • Everything looks correct to me, I have no idea why it's not working.
    – Head
    Oct 5, 2022 at 4:40

Your Answer

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

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