Skip to main content

How to add content beside a dropdown

More
13 years 10 months ago #72900 by tumbleweed
When the users view a particular product, there are 2 dropdown (select) boxes
that allow them to specify the color and size wanted:

Please Select Color

Please Select Size

I want to add a 'Help me determine the right size' link out to the right side
of the "Please Select Size" dropdown box so that when the link is clicked on
it will open up a small window of content, or maybe something like a tooltip.

Here is the code for that particular dropdown:
Code:
<select id="hikashop_product_characteristic_10" name="hikashop_product_characteristic[10]" class="inputbox" size="1" onchange="return hikashopUpdateVariant(this);"> <option value="38" selected="selected">Please Select Size</option> <option value="21">5</option> <option value="22">6</option> <option value="3">7</option> <option value="4">8</option> <option value="5">9</option> <option value="6">10</option> <option value="7">11</option> </select>

How can I add a link beside the dropdown box?
What file needs to be changed?

Thanks.

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

More
13 years 10 months ago #73036 by Xavier
Hi,

I think that the easiest way is to edit the view "product / show_block_characteristic" in HikaShop > Display > Views.
And replace the content by:
Code:
<?php JHTML::_('behavior.tooltip'); if (!empty ($this->element->characteristics)) { ?><div id="hikashop_product_characteristics" class="hikashop_product_characteristics"><?php echo $this->characteristic->displayFE($this->element, $this->params); if($this->element->characteristics[10]){ echo "<span style='position:relative;top:-18px; left: 100px;'>"; echo JHTML::tooltip('This is the tooltip text', 'Tooltip title', 'tooltip.png', '', 'http://www.joomla.org'); echo "</span>"; } ?></div><?php } ?>

In this code replace the value "10" by the id of your size characteristic, you can find it in HikaShop > Product > Characteristics.

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

More
13 years 10 months ago #73086 by tumbleweed
Hello Xavier,

Thanks for the help!

Here is the code for "product / show_block_characteristic" now:
Code:
<?php JHTML::_('behavior.tooltip'); if (!empty ($this->element->characteristics)) { ?><div id="hikashop_product_characteristics" class="hikashop_product_characteristics"><?php echo $this->characteristic->displayFE($this->element, $this->params); if ($this->element->characteristics[10]) { echo "<span style='position:relative; top:-18px; left:145px;'>"; echo JHTML::tooltip( 'This is the tooltip text', 'Tooltip title', 'tooltip.png', '', 'http://www.joomla.org' ); echo "</span>"; } ?></div><?php } ?>

The information icon is displayed where I want it, but when I hover over it, I never see
the tooltip. If I click the icon, I am taken to the URL as expected, but when I hover
over the icon, nothing happens.

I wonder why the tooltip is not displayed when I hover over the icon?

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

More
13 years 10 months ago #73231 by nicolas
Can you give a link to that page so that we can see the result ?

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

More
13 years 10 months ago - 13 years 10 months ago #73241 by tumbleweed
Sure, here's a link you can use...

[link removed since it no longer applies to topic]
Last edit: 13 years 10 months ago by tumbleweed. Reason: link no longer relevant

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

More
13 years 10 months ago #73315 by Xavier
Hi,

I think that the problem come from you template.
Try to change the template to see if the tooltip appear, or search in the base.css or custom.css files of your template if there is not a property which hide the tooltip.

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

More
13 years 10 months ago #73360 by tumbleweed
You are right...

When I changed to a different template, the tooltip displayed properly.

It is not working with my current template.

The template that I'm using has over a dozen CSS files.
I went through each one (searching for the word 'tip'),
but I never found any mention of tooltip or tip in any
of those .css files.

If any of those files were 'hiding' the tooltip, I would
have been able to find the word 'tip' in one of them, right?

Maybe I can just add some default CSS to handle the tooltip
somewhere. What do you think?

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

More
13 years 10 months ago #73379 by Xavier
Yes, you can try to add default CSS on the class .hasTip{}.

Or contact your template provider. I think you can too find a solution on google, because some people should have the same issue.
The following user(s) said Thank You: tumbleweed

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

Time to create page: 0.278 seconds
Powered by Kunena Forum