Skip to main content

How can I change the ajax spinner

More
9 years 7 months ago #262033 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.

Kind regards,
Lumiga

Please Log in or Create an account to join the conversation.

More
9 years 7 months ago - 9 years 7 months ago #262049 by kyratn
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:
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.

More
9 years 7 months ago #262042 by Jerome
Hi,

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.

More
9 years 7 months ago #262314 by Lumiga
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;
}

Kind regards,
Lumiga

Please Log in or Create an account to join the conversation.

More
9 years 7 months ago #262316 by kyratn
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

Please Log in or Create an account to join the conversation.

More
9 years 7 months ago #262335 by Lumiga
I know, thanks! :)

Kind regards,
Lumiga

Please Log in or Create an account to join the conversation.

Time to create page: 0.221 seconds
Powered by Kunena Forum