DOS OPCIONES :
1- product-variants.tpl
<li class=”pull-xs-left input-container”>
Agregar:
<span> {$colors.$id_attribute.name} </span>
2-
Modification of custom.css
File is located in this directory: themes/classic/assets/css/custom.css (if you use different theme than “classic” theme – open your theme directory instead). At the end of this file paste code attached below:
1
2
3
4
5
6
|
.ColorLabel:after { display:inline-block; content:attr(data-after); margin-left:5px; font-weight:bold; } |
Modification of custom.js
File is located in this directory: themes/classic/assets/js/custom.js (the same as previously if you use different theme than “classic” – open your theme directory instead). At the end of this file paste code attached below:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
$(document).ready( function (){ $( ".input-color" ).parent().parent().parent().parent().find( '.control-label' ).addClass( 'ColorLabel' ); $( ".input-color:checked" ).each( function (){ $( this ).parent().parent().parent().parent().find( '.ColorLabel' ).attr( 'data-after' , $( this ).parent().find( '.sr-only' ).html()); }); prestashop.on( "updatedProduct" , function (){ $( ".input-color" ).parent().parent().parent().parent().find( '.control-label' ).addClass( 'ColorLabel' ); $( ".input-color:checked" ).each( function (){ $( this ).parent().parent().parent().parent().find( '.ColorLabel' ).attr( 'data-after' , $( this ).parent().find( '.sr-only' ).html()); }); }); }); |