Styling Single Word in Product Title

Description

• change style of single word in product title, works with product on store page, product detail page, summary block product, product block, related products, cart page
• view demo – password: abc
• buy me a coffee

#1. Install Code

#1.1. Use this code to Code Injection > Footer

<!-- 09.26c07v4 Styling Single Word in Product Title -->
<script>
window.ProductTitleWordStyleConfig = {
  spanClass: 'product-title-word',
  textColor: '',
  textSize: '',
  marker: '#',
  titleSelectors: [
    '.product-title',
    '.product-list-item-title',
    '.summary-title',
    '.cart-row-title',
    '.product-nav-breadcrumb-link'
  ]
};
</script>
<script src="https://code.beaverhero.com/product/0926c07v4stylingwordproductitle.js"></script>

#1.2. Next, edit product and wrap word between symbol # and #, like this

The Haven #Vessel#

#1.3. Next, to change style of word, for example, change color, use this code under main code

<style>
  .product-title-word {
  	color: #f1f;
  }
</style>

to change size, use code like this

<style>
  .product-title-word {
  	color: #f1f;
font-size: 10px;
  }
</style>