- Posts: 637
- Thank you received: 26
How can I change the ajax spinner
9 years 7 months ago #262033
by Lumiga
Kind regards,
Lumiga
How can I change the ajax spinner was created by Lumiga
-- HikaShop version -- : 3.0.0
-- Joomla version -- : 3.6.5
-- PHP version -- : 7.0
Hi Hikashop,
I would like to modify the ajax spinner to a slightly have a more subtle version.
It would be nice if you could make a selector so we could choose from the different styles.
Like the way you can with for example the Smart Slider, see video.
VIDEO select spinner style
But this is more a future request.
For now I like to know where I can change this spinner for the moment.
Hope to hear from you.
-- Joomla version -- : 3.6.5
-- PHP version -- : 7.0
Hi Hikashop,
I would like to modify the ajax spinner to a slightly have a more subtle version.
It would be nice if you could make a selector so we could choose from the different styles.
Like the way you can with for example the Smart Slider, see video.
VIDEO select spinner style
But this is more a future request.
For now I like to know where I can change this spinner for the moment.
Hope to hear from you.
Kind regards,
Lumiga
Please Log in or Create an account to join the conversation.
9 years 7 months ago - 9 years 7 months ago #262049
by kyratn
Replied by kyratn on topic How can I change the ajax spinner
Hi,
If you want to have different spinner you will have to replace spinner.gif and spinner_02.gif They are located here:
/media/com_hikashop/images/spinner.gif <- this is small spinner icon
/media/com_hikashop/images/spinner_02.gif <- this is default size icon
You can use such online tool to generate your icon. loading.io/
You will lose this changes after hikashop update.
Proper way would be add spinner icons somewhere to your template and use such css:
And another way would be to modify your block views and change div classes for spinner....
Hope that helps.
Thanks
If you want to have different spinner you will have to replace spinner.gif and spinner_02.gif They are located here:
/media/com_hikashop/images/spinner.gif <- this is small spinner icon
/media/com_hikashop/images/spinner_02.gif <- this is default size icon
You can use such online tool to generate your icon. loading.io/
You will lose this changes after hikashop update.
Proper way would be add spinner icons somewhere to your template and use such css:
Code:
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner {
background:url('ICON_LOCATION_FOLDER/spinner_02.gif') no-repeat center !important;
}
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner.small_spinner {
background:url(''ICON_LOCATION_FOLDER/spinner.gif') no-repeat center !important;
}
And another way would be to modify your block views and change div classes for spinner....
Hope that helps.
Thanks
Last edit: 9 years 7 months ago by kyratn.
The following user(s) said Thank You: Lumiga
Please Log in or Create an account to join the conversation.
9 years 7 months ago #262042
by Jerome
Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.
Replied by Jerome on topic How can I change the ajax spinner
Hi,
Spinner is just made with CSS rules
www.hikashop.com/support/documentation/1...the-display.html#css
Regards,
Spinner is just made with CSS rules
www.hikashop.com/support/documentation/1...the-display.html#css
Regards,
Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.
Please Log in or Create an account to join the conversation.
9 years 7 months ago #262314
by Lumiga
Kind regards,
Lumiga
Replied by Lumiga on topic How can I change the ajax spinner
Thanks! Kyratn, your Custom CSS solution works perfect!!!!!!!
I have changed the big spinner to the small spinner and now it looks better.
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner {
background:url('/media/com_hikashop/images/spinner.gif') no-repeat center !important;
}
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner.small_spinner {
background:url('/media/com_hikashop/images/spinner.gif') no-repeat center !important;
}
I have changed the big spinner to the small spinner and now it looks better.
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner {
background:url('/media/com_hikashop/images/spinner.gif') no-repeat center !important;
}
div.hikashop_checkout_loading div.hikashop_checkout_loading_spinner.small_spinner {
background:url('/media/com_hikashop/images/spinner.gif') no-repeat center !important;
}
Kind regards,
Lumiga
Please Log in or Create an account to join the conversation.
9 years 7 months ago #262316
by kyratn
Replied by kyratn on topic How can I change the ajax spinner
Hi,
Have you replaced spinner icons in this folder? 'public_html/media/com_hikashop/images/"
If yes, then your css code isn't necessary as it does same. Hikashop already has such css...
This css only would be needed if you would put your spinner icons somewhere inside your template.
Thanks
Have you replaced spinner icons in this folder? 'public_html/media/com_hikashop/images/"
If yes, then your css code isn't necessary as it does same. Hikashop already has such css...
This css only would be needed if you would put your spinner icons somewhere inside your template.
Thanks
Please Log in or Create an account to join the conversation.
Time to create page: 0.181 seconds