Please help us to make AbanteCart Ideal Open Source Ecommerce Solution for everyone.

Support AbanteCart eCommerce

Author Topic: Color Picker  (Read 264 times)

Offline HADY

  • Sr. Member
  • ****
  • Posts: 315
  • Karma: +27/-5
    • View Profile
Color Picker
« on: November 28, 2022, 03:21:06 AM »
Hello guys,

I searched th forums but i couldn't find any related post which could solve my question.

I need to know how to add color picker to product to make it easier for client to make multiple order from same product in different colors and to be mentioned the color code in a separated box with the required quantities. 
Thank you In Advanced
Regards
HADY

Offline Basara

  • Administrator
  • Hero Member
  • *****
  • Posts: 5403
  • Karma: +269/-2
    • View Profile
Re: Color Picker
« Reply #1 on: November 28, 2022, 08:07:41 AM »
Hello.
1. Add an option with option type INPUT and initial value #ffffff
2. Create an HTML block with the next code and add it to the Footer Top section of the Product Page Layout

Code: [Select]
<script type="text/javascript">
$( window ).on( "load", function() {
$('input[type=text][value^="#"]').each(function() {
$(this).prop('type', 'color');
})});</script>

Offline HADY

  • Sr. Member
  • ****
  • Posts: 315
  • Karma: +27/-5
    • View Profile
Re: Color Picker
« Reply #2 on: November 28, 2022, 08:56:18 AM »
Hello.
1. Add an option with option type INPUT and initial value #ffffff
2. Create an HTML block with the next code and add it to the Footer Top section of the Product Page Layout

Code: [Select]
<script type="text/javascript">
$( window ).on( "load", function() {
$('input[type=text][value^="#"]').each(function() {
$(this).prop('type', 'color');
})});</script>



Hello Sir,

Thank you so much, that was so easy and very good section.
Thank you In Advanced
Regards
HADY

Offline HADY

  • Sr. Member
  • ****
  • Posts: 315
  • Karma: +27/-5
    • View Profile
Re: Color Picker
« Reply #3 on: November 28, 2022, 09:28:56 AM »
I have a question about the color picture, is it possible to make it to be appeared in the product picture section ??
Thank you In Advanced
Regards
HADY

 

Powered by SMFPacks Social Login Mod