The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 03-15-2015, 02:53 PM
simplysimcard's Avatar
simplysimcard is offline
Junior Member
 
Join Date: Mar 2015
Posts: 5
Default

Add tooltips


Hi there,
I am trying to add tooltips on my Ecwid store in several places,
to add extra information for the user.

For example, on the product page, I would like the user to hover on the "Read More", and a tooltip baloon will be opened with the information.

I have tried to add JQuery code on the html product page, nothing happened.
I am using Ecwid online store on a Wix website.

can you please instruct me with the correct JQuery (or any other method) code, and where should I put the code?

Thanks,
Kfir
  #2  
Old 03-22-2015, 01:13 PM
simplysimcard's Avatar
simplysimcard simplysimcard is offline
Junior Member
 
Join Date: Mar 2015
Posts: 5
Default

Hi, I am still waiting for your reply...
  #3  
Old 04-02-2015, 12:06 PM
enot's Avatar
enot enot is offline
 
Join Date: Oct 2014
Posts: 499
Default

Quote:
Originally Posted by simplysimcard View Post
Hi there,
I am trying to add tooltips on my Ecwid store in several places,
to add extra information for the user.

For example, on the product page, I would like the user to hover on the "Read More", and a tooltip baloon will be opened with the information.

I have tried to add JQuery code on the html product page, nothing happened.
I am using Ecwid online store on a Wix website.

can you please instruct me with the correct JQuery (or any other method) code, and where should I put the code?

Thanks,
Kfir
Hi!
Sorry for keeping you waiting.

You've got the right idea: JQuery in this case is the best and probably the easiest way to get it done, and the exact functionality you mentioned can be indeed achieved with custom JS code indeed.

And while as customer care team we do not offer custom programming services, I'd be glad to help out with advice that I believe would allow you to write one yourself. At least, that's the best we can offer from our side. So, here's what I can share, from the beginning:

In order to allow your script to interact with Ecwid's storefront I can suggest utilising our JavaScript API, info on which you can find here: http://help.ecwid.com/customer/portal/articles/1169548

Basically, as this would require creating new elements and placing them on (for example) product pages, the page type would be "product", and the best event would be probably "on page loaded", like this:

Code:
if (typeof(Ecwid) == 'object') {
Ecwid.OnPageLoaded.add( //SOMETHING// ) {
if ('PRODUCT' == page.type)
Applying some rule to particular product pages only would be possible too - for example, with the use of an array, like this (a particular product page can be determined with product ID, which can be found in the URL of the product page, or by exporting a product):

Code:
var prodIDs = [XXXXXXXX, ZZZZZZZZZ, YYYYYYYY];
...................................................................
...................................................................
for(var i=0; i<=2; i++) {
if (prodIDs[i]==page.productId)
{//do something!
xx, zz and yy are the IDs of a different products - please note, that any number of IDs can be added.
(2 in this case is array length-1, so it can be replaced with "prodIDs.lenght" or with a different number in case you'll have more than 3 product IDs in the array)
The rest of API-related stuff that you might need can be also found within the article that I mentioned above.

So, our JS API in this case should be used to make sure the script interacts with Ecwid in a way Ecwid would understand.

Writing the actual script may eventually require addressing our API too, but mostly it would be just common JS, part 1 of which would be adding an element to a particular Ecwid page, and part 2 - assigning an event on hovering over this element, that would display the tooltip.

Now, regarding the place to apply it: basically, such script should be added to the source of the page after Ecwid integration code. Wix doesn't allow it, and instead "html elements" can be used here to execute some custom script. Yet, due to its iFrame-based structure (basically, everything's in iFrames on Wix) just placing a script to another html element won't do the trick. It should be added to the same element where Ecwid integration code is.

If you're using our plugin for Wix, you can add the code to the "Advanced settings" under Ecwid app settings in your Wix website editor.

Hope this helps!
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 01:37 PM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.