1

I have product title with this standard: "Brand name - item title" and I need to transform this string like this:

Brand name
item title

So I need 2 things to handle: replace the first dash in the string with "br" and apply bold to the text before the first dash.

I have reached only the first part of the goal with this code:

<a class="product-item-link primabold-category" href="<?php echo $_product-> getProductUrl() ?>">
 <?php echo str_replace(' - ', '<br />', $_helper->productAttribute($_product, $_product->getName() , 'name')); ?></a>

and this CSS:

.primabold-category::first-line { font-weight: 900; font-size: 14px; letter-spacing: 0px;}

But the result is not as expected because it "bold" only the first line, even if the text before the dash is on two lines..

Here a real title example:

POLO RALPH LAUREN - Camicia donna in Oxford azzurro

expected result:

POLO RALPH LAUREN
Camicia donna in Oxford azzurro

As you can see from the picture, when I'm on mobile view, "lauren" is on the second line and it's not bold :(

--> I have found a javascript that suits the expected result:

<a class="ProductList-title primabold-category" style="font-weight: 100;">Polo ralph lauren - T-shirt oudspeaker</a> <script> function changeBrandName() { var prodList = document.querySelectorAll("a.primabold-category"); for (var i = 0; i < prodList.length; i++) { var text = prodList[i].innerText; var index = text.indexOf('-'); var lower = text.substring(0, index); var higher = text.substring(index + 1); prodList[i].innerHTML = lower.bold() + '<br />' + higher; } } changeBrandName(); </script>

BUT javascript is not fired anytime the layered navigation load new lines of products, so I think that using PHP would be the perfect solution, if possibile.

Silver
  • 11
  • 4
  • 1
    So output a `` tag before the title, and replace `-` inside of it with `
    ` …? (And remove the CSS again, `::first-line` won’t work properly for your purposes, if you can not force the first part to be on one single line in the first place.)
    – 04FS Sep 28 '20 at 12:32
  • @04FS as long as there is no `-` in the rest of the text. – Nigel Ren Sep 28 '20 at 12:34
  • @NigelRen yes, good point. If this needs to be restricted to replacing only the first occurence of `-`, which `str_replace` can’t do natively, https://stackoverflow.com/questions/1252693/ has approaches to handle that. – 04FS Sep 28 '20 at 12:36

1 Answers1

0

use this code instead:

$brand= $_helper->productAttribute($_product, $_product->getName() , 'name');

$explodedBrand=explode(' - ',$brand,2);

if(count($explodedBrand) > 1){
    $brand = '<span class="bold">'.$explodedBrand[0].'</span>'.'<br>'.$explodedBrand[1];
}

echo $brand;

remember to define bold class in your CSS file.

Babak Asadzadeh
  • 1,207
  • 1
  • 11
  • 21