Eine CSS-Klasse um Produktname auf Kasse-Seite

  • Resolved gerd.neumann

    (@gerdneumann)


    3 years, 8 months ago

    Hallo,

    unsere Produktnamen werden im Shop immer mit text-transform: uppercase gerendert. Also Gro?buchstaben via CSS.

    Das ist jetzt überall so eingestellt, nur auf der Checkout-Seite (Kasse) ist das nicht m?glich, weil der Produktname dort nicht gezielt via einer class addressierbar ist.

    Das HTML ist aktuell dort so:

    <div class="wc-gzd-product-name-right">
  Produktname
  <strong class="product-quantity">× 1</strong>
  <p class="wc-gzd-cart-info delivery-time-info">
    Lieferzeit: ca. 2-3 Werktage
  </p>
  <dl class="variation">
    <dt class="variation-Farbe">Farbe:</dt>
    <dd class="variation-Farbe"><p>Blau</p></dd>
  </dl>
</div>

    W?re es m?glich, dass der Produktname hier nochmal in ein span mit einer Klasse gepackt würde? Also so in etwa:

    
<div class="wc-gzd-product-name-right">
  <span class="wc-gzd-cart-product-name">Produktname</span>
  <strong class="product-quantity">× 1</strong>
 ...
</div>

    Dann k?nnten wir im CSS im Child-Theme einfach ein:

    
.wc-gzd-cart-product-name {
  text-transform: uppercase;
}

    machen wie an anderen Stellen auch bereits.

    Ggf. w?re das in einer zukünftigen Version von euch machbar?

    Danke und viele Grü?e,
    Gerd

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter gerd.neumann

    (@gerdneumann)

    PS Gleiches gilt auch für die Bestellübersicht in den E-Mails, wobei ich nicht wei?, ob das dann eher ein WooCommerce oder ein Germanized-“Issue” w?re…

    In den Mails sieht das HTML aktuell so aus:

    
<td style="...">
  Produktname
  <p class="wc-gzd-cart-info delivery-time-info" style="margin: 0 0 16px;">Lieferzeit: ca. 2-3 Werktage</p>
  <ul class="wc-item-meta" style=3D"font-size: small; margin: 1em 0 0; padding: 0; list-style: none;">
    ...
  </ul>
</td>

    Das Aussehen der Mails wird ja auch via CSS-Selektoren, die dann ge-inline-t werden, gerendert. Dazu müsste der Produktname aber addressierbar, d.h. selektierbar sein.

    PPS Alle Produktnamen jetzt hart GRO?ZUSCHREIBEN w?re eher keine Option, da alles ge?ndert werden müsste…

    Plugin Author vendidero

    (@vendidero)

    Hi,

    das l?sst sich in Germanized wohl nicht umsetzen – wir halten uns da an die Umsetzung, die in Woo bereits existiert (https://github.com/woocommerce/woocommerce/blob/trunk/templates/checkout/review-order.php#L38). Für solche Zwecke müsstest du das Template woocommerce-germanized/templates/checkout/review-order-product-table.php in deinem Child-Theme unter my-child/woocommerce-germanized/checkout/review-order-product-table.php überschreiben und dein individuelles Markup vornehmen.

    Auf das Markup in den Mails haben wir grunds?tzlich keinen Einfluss – auch hier w?re wohl ein Template-Override der Woo-Templates notwendig.

    Grü?e

    Thread Starter gerd.neumann

    (@gerdneumann)

    ok, danke :-/

    Hiermit lie?e sich wohl umsetzen:

    
// Display product name as uppercase, CSS is not possible
// Too dangerouse, because sometimes the $product_name can come as a link as sprintf( '<a href="%s">%s</a>' ...)
function fr_uppercase_product_name_in_cart( $product_name, $cart_item, $cart_item_key ) {
    return strtoupper( $product_name );
}
add_filter( 'woocommerce_cart_item_name' , 'fr_uppercase_product_name_in_cart', 10, 3 );

    Aber da $product_name manchmal auch als ein sprintf( '<a href="%s">%s</a>' ...) als Parameter kommt, ist mir das zu heikel.

    Scheint mir nicht ohne zu hohem Aufwand/Zukünftige Risiken bei Updates umsetzbar.

    Thread Starter gerd.neumann

    (@gerdneumann)

    Ich habe hierzu Upstream ein Ticket aufgemacht: https://github.com/woocommerce/woocommerce/issues/29386 Mal sehen.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Eine CSS-Klasse um Produktname auf Kasse-Seite’ is closed to new replies.