Is it possible to change the font on a characteristics dropdown ?

-- HikaShop version -- : 3.4.1
-- Joomla version -- : 3.8.10
-- PHP version -- : 5.6.3
-- Browser(s) name and version -- : Chrome 67.0.3396.79 (Official Build) (64-bit)
-- Error-message(debug-mod must be tuned on) -- : No error message

@forum, @support,

I am thinking this in not possible, but if I have a FONT Variant as a dropdown.
Is there anyway, I can change each line to represent the actual Font?

See attached font list.

Thanks in advance,
MSF

Hello,

Can you give us more information about what you want to achieve through some screenshots so that we can properly help you ? Thank you.

Best regards,
Mohamed Thelji.

Thanks for the reply.
I have attached the drop down of the font list, can those be changed to the corresponding font types ?

So if strikethrough was on that list could it show as [strike]stritkethrough[/strike]

Hello,

I see 2 solutions :
Each value have his own html class and you can add some custom css code in your frontend file css, this kind of code may do the trick : Note : See this tutorial .

OR, you add directly in each dropdown value your inline style css :
Before :
font-family name
After :
<span style="font-family: value 1">font-family name 1</span>

Hope these solutions will fit your needs.
Regards

Philippe,

Thank you a simple <span style="font-family:Brush Script MT Italic;">Brush Script MT Italic</span> in the Characteristics works and displays like a charm for the radio button.

The drop down looks like this, and the <span> is dropped by the front end.

<select id="hikashop_product_characteristic_60" name="hikashop_product_characteristic[60]" class="inputbox" size="1" onchange="return hikashopUpdateVariant(this);">
<option value="61" selected="selected">Brush Script MT Italic</option>
<option value="62">Calibri Regular</option>
<option value="63">Cooper Black</option>
<option value="64">Forte Regular</option>
<option value="65">Lato Bold</option>
<option value="68">Monotype Corsiva</option>
<option value="66">Montserrat Black</option>
<option value="67">Montserrat Bold</option>
<option value="69">Shadows Into Light</option>
</select>

Thank you.

MSF

Hi,

You would have to remove it from the file administrator/components/com_hikashop/types/characteristic.php
However, a better solution would be to edit the file "show_block_characteristic" via the menu Display>Views and change the line: to:

Hi,

Thanks for the code change. Didn't help with the dropdown, just removed the class.

In the characteristic for the first dropdown I have this: <span style="font-family:Brush Script MT Italic">Brush Script MT Italic</span>
and the same for the respective font characteristics.

But that gets stripped out.

<select id="hikashop_product_characteristic_60" name="hikashop_product_characteristic[60]" size="1" onchange="return hikashopUpdateVariant(this);">
<option value="61" selected="selected">Brush Script MT Italic</option>
<option value="62">Calibri Regular</option>
<option value="63">Cooper Black</option>
<option value="64">Forte Regular</option>
<option value="65">Lato Bold</option>
<option value="68">Monotype Corsiva</option>
<option value="66">Montserrat Black</option>
<option value="67">Montserrat Bold</option>
<option value="69">Shadows Into Light</option>
</select>

Any other Ideas on how this will work.. Its works perfect with a radio button, see attached.

Thanks,

MSF

Hi,

You should not add the CSS directly in the characteristic value.
You can do that will simple CSS code that you can add in the HikaShop CSS or your template CSS and no PHP modification.
For example:

Hello,

I tried this, put it in the custom1.css in the CSS Options.
It didn't get picked up, also tried in the custom.css of the template, same result.

Why does it work with radio buttons and not the dropdown ?

Regards,
MSF

Hi,

Selector is :
Please understand that we are going outside the limit of our support since it's related to customization and creation of CSS rules (which is not direct HikaShop stuff).

Regards,

Thank you, Thank you, Thank you,
Works like a dream : )

You guys rock.

MSF

Hi,

I would like to achieve the same effect in a custom field dropdown where one can select a font. I added a ccs line in my template:

.test_lettertypen option[value=1] {
font-family:Courier New;
}

where the single dropdown has the column_name "test_lettertypen" (see attachement).

Unfortunately, this does not work. Is there a simple solution?

Hi,

You can do that yes. However, the class test_lettertypen doesn't exists.
The class is hikashop_item_test_lettertypen_line if you look at the HTML of the area where the select is with the HTML inspector of the developer tools of your browser.

Hi Nicolas,

Yes, I found that before in Firebug, but that also didn't work when using:

.hikashop_item_test_lettertypen_line option[value=1] {
font-family:Courier New;
}

Hi,

Try like that then:
.hikashop_item_test_lettertypen_line option[value="1"] {
font-family:Courier New !important;
}
Please understand that this is purely CSS customization, and has nothing to do with HikaShop itself.

Hi,

Thanks, allready tried that. I understand, will figure it out myself.