HTML in Product Titles

Hi,

The latest version of Woocommerce now supports HTML in titles. It works on the Product page but when hovering on the “next/prev” arrows at the top, the HTML tags show.

Can you please update this?

Thanks

Hello,

Please make the full backup of your site as well as the Theme settings export and check the issue on the Storefront theme to detect if our theme causes the problem. Storefront is a free theme developed by Woocommerce.

Best Regards

Hi,

Yes I tried it in Storefront, it does not seem to have that functionality so I think it is your theme. It does not show the HTML tags in the product title but does when hovering over the “prev/next” arrows. Please see the attached image.

Thanks

Attachments:

You must be logged in to view attached files.

Hello,

The product page is the Woocommerce template.

Please describe the actions step by step I will check and advise if it supports.

Best Regards

Hi,

You enter HTML in the product title on the back-end like so:
Beet Root Powder <span class=”sub-title”>plus BCAA’s and Black Pepper</span>

On the product page front-end the title shows as “Beet Root Powder plus BCAA’s and Black Pepper” without the HTML. But with your themes “next/prev” arrows at the top of the page to got to previous or next product, the HTML shows up when hovering as shown in the screenshot attached.

This does not have to do with Woocommerce as Storefront does not have these previous/next product arrows. This is part of the Basel Theme breadcrumbs I believe.

Thanks

Attachments:

You must be logged in to view attached files.

Hello,

Please make the full backup of your site as well as the Theme settings export and check the issue on the Storefront theme to detect if our theme causes the problem. Storefront is a free theme developed by Woocommerce.

Best Regards

You already asked me to do that and I did. The problem is with Basel theme.

As I said Storefront does not have the next/previous arrows for products

Hello,

I am inserting <span class=”sub-title”>plus BCAA’s and Black Pepper</span> and check-in Basel theme here is what I have: https://gyazo.com/a0884bcee5c6efc71e83e3eb205182fb

How do you do that? Please provide the steps with the screens.

Best Regards

Hi

Yes, perfect it works there in the title but if you hover over Next/Previous product arrows above it will show HTML tags. The arrows are boxed in red in image attached.

Thanks!

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the fundtion.php of the child theme:

function basel_products_nav() {
	$next = get_next_post();
	$prev = get_previous_post();
	$next = ( ! empty( $next ) ) ? wc_get_product( $next->ID ) : false;
	$prev = ( ! empty( $prev ) ) ? wc_get_product( $prev->ID ) : false;
	?>
		<div class="basel-products-nav">
			<?php if ( ! empty( $prev ) ): ?>
			<div class="product-btn product-prev">
				<a href="<?php echo esc_url( $prev->get_permalink() ); ?>"><?php _e('Previous product', 'basel'); ?><span></span></a>
				<div class="wrapper-short">
					<div class="product-short">
						<a href="<?php echo esc_url( $prev->get_permalink() ); ?>" class="product-thumb">
							<?php echo apply_filters( 'basel_products_nav_image', $prev->get_image() ); ?>
						</a>
						<a href="<?php echo esc_url( $prev->get_permalink() ); ?>" class="product-title">
							<?php echo $prev->get_title(); ?>
						</a>
						<span class="price">
							<?php echo wp_kses_post( $prev->get_price_html() ); ?>
						</span>
					</div>
				</div>
			</div>
			<?php endif ?>
			<?php if ( ! empty( $next ) ): ?>
			<div class="product-btn product-next">
				<a href="<?php echo esc_url( $next->get_permalink() ); ?>"><?php _e('Next product', 'basel'); ?><span></span></a>
				<div class="wrapper-short">
					<div class="product-short">
						<a href="<?php echo esc_url( $next->get_permalink() ); ?>" class="product-thumb">
							<?php echo apply_filters( 'basel_products_nav_image', $next->get_image() ); ?>
						</a>
						<a href="<?php echo esc_url( $next->get_permalink() ); ?>" class="product-title">
							<?php echo $next->get_title(); ?>
						</a>
						<span class="price">
							<?php echo wp_kses_post( $next->get_price_html() ); ?>
						</span>
					</div>
				</div>
			</div>
			<?php endif ?>
		</div>
	<?php
}

Best Regards

It works! Will this be updated in the next theme version?

Thanks

Hello,

Yes, we are going to fix it in the nearest future.

Best Regards

[Author]

Posts