Display Barcode Number on eCommerce Site

Client would like to include the barcode number for each item on the eCommerce site, so customers can easily access it.

Solution:

• Create an extension for shopping and myaccount domain
• Extend product detail full view file and display barcode in the pdp page
• Make change in the corresponding template

Javascript

_.extend(ProductDetailsFullView.prototype, {
				template: jj_barcode_product_tpl,
				getContext: _.wrap(ProductDetailsFullView.prototype.getContext, function (fn) {
				var context = fn.apply(this, _.toArray(arguments).slice(1));
					   
							//  console.log("this by dilse55",this.model)
							 context.upccode=this.model.attributes.item.attributes.upccode;
							//  console.log("context by dilse55",context)
							 return context
					 })
				});

Template
<div class="product-details-barcode">
<span class="product-line-barcode-label">BARCODE : </span>
<span class="product-line-barcode-value">{{upccode}}</span>
</div>

SASS
.product-line-barcode-label{
	margin-bottom: 5px;
	font-size: 0.93rem;
	color: #7e858b;

}
.product-line-barcode-value{
	font-weight: 600;
	color: #435363;
	font-size: 17px;
}

.product-details-barcode {
	@media (max-width: $screen-sm-min) {
		margin-bottom: 25px;
	}

}