Shortcode

WooCommerce Lucky Wheel provides a shortcode to display the WooCommerce Lucky Wheel on any pages. A sample with all parameters:

[woocommerce_lucky_wheel bg_image='' center_image='' random_color='on' bg_color='#a77e44' text_color='#ffffff' pointer_color='#f70707' pointer_position='center' spin_button_color='#000000' spin_button_bg_color='#ffbe10' wheel_dot_color='#000000' wheel_border_color='#ffffff' wheel_center_color='#ffffff' spinning_time='5' wheel_speed='3' font_size='100' wheel_size='100' congratulations_effect='firework' class='' custom_field_name_enable='on' custom_field_name_enable_mobile='on' custom_field_name_required='off' custom_field_mobile_enable='off' custom_field_mobile_enable_mobile='off' custom_field_mobile_required='off']

• Shortcode: the shortcode  [woocommerce_lucky_wheel] will display the lucky wheel. The lucky wheel displayed by the shortcode is same as the lucky wheel pop-up will all elements. You can use this shortcode to create a lucky wheel page where you allow customers to subscribe email and spin the wheel for discount coupons.
• Shortcode params: you can add parameters to the short to change it without changing WooCommerce Lucky Wheel settings. Below is a list of WooCommerce Lucky Wheel shortcode para, to use these parameters you just need to add it into the shortcode. For example to change the background [woocommerce_lucky_wheel bg_image='image_url.png']
  • bg_image: allow to change the background image using a picture URL. For example: bg_image='123' or bg_image='img.com/photos.jpg'
  • bg_color: change the background color using color code. For example: bg_color='#ffffff'
  • text_color: change the text color of the lucky wheel. For example :text_color='#303030'
  • pointer_color: change the pointer color. For example:pointer_color='#303030'
  • spin_button_color: change the spin button text color. For example:spin_button_color='#303030'
  • spin_button_bg_color: change the spin button background-color. For example:spin_button_bg_color='#303030'
  • wheel_dot_color: change the small dot on the border of the lucky wheel color. For example:wheel_dot_color='#303030'
  • wheel_border_color: change lucky wheel border color. For example: wheel_border_color='#303030'
  • wheel_center_color: change the lucky wheel center color. For example: wheel_center_color='#303030'
  • pointer_position: change the pointer position. You can put in one of these value center, bottom, right, top, random. For example:pointer_position='top'
  • spinning_time: how long the wheel spins before stopping, measured in seconds. For example: set up the wheel to spin in 5 seconds spinning_time='5'
  • wheel_speed: change the spin speed of the wheel, defined as the number of rotations per second. For example:wheel_speed='2'
  • custom_field_name_enable: this shortcode allows you to enable the name field. Supported values are: ON/OFF. For example:custom_field_name_enable='on'
  • custom_field_name_enable_mobile: allows you to enable the name field on mobile. Supported values are: ON/OFF. For example:custom_field_name_enable_mobile='on'
  • custom_field_name_required: select if the name field is required. Supported values are: ON/OFF. For example:custom_field_name_required='on'
  • custom_field_mobile_enable: select if you want to enable the mobile phone number field. Supported values are: ON/OFF. For example:custom_field_mobile_enable='on'
  • custom_field_mobile_enable_mobile: select if you want to enable the mobile phone number field on mobile. Supported values are: ON/OFF. For example:custom_field_mobile_enable_mobile='on'
  • custom_field_mobile_required: select if the mobile phone number is required. Supported values are: ON/OFF. For example::custom_field_mobile_required='on'
  • font_size: change the font size of the Lucky Wheel text using a percentage value. For example::font_size='100'
  • wheel_size: control the overall size of the wheel using a percentage value.  For example: display the wheel with 90% size wheel_size='90'
  • congratulations_effect: select the congratulation effect when customers win a prize. Values supported are: Firework or Off. For example:congratulations_effect='firework'
  • center_image: allow to use an image instead of color on the wheel center. Values supported are the image’s ID or URL. For example: center_image='123' or center_image='img.com/photos.jpg'
  • random_color: automatically randomize the colors of wheel segments, center area, background, and pointer each time the page loads. Supported values are: on/off. E.g. random_color=’on’
  • class: Assign a custom CSS class to the shortcode for styling purposes. Read this WordPress article for more details. This allows you to apply custom styles using WordPress Custom CSS in the Customizer. Example: class='wp_lucky_wheel_shortcode_new_class'