How to add a CSS class to checkboximage

smilecollector
Topic Author
Offline
Elite Member

3 years 11 months ago - 3 years 11 months ago #78741 by smilecollector

[Use a custom field layout] How to add a CSS class to checkboximage was created by smilecollector

Hello
I have a "simple" question - I would like to add some classes to the images contained in a field checkboximage. Is there any chance/way to do so?

test.smilecollector.photos/fr/alanys

the idea behind is (of course) to apply css to hide some in a few case, to change the size or the opacity of some others...

Attachments:

Last edit: 3 years 11 months ago by ggppdk.

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

smilecollector
Topic Author
Offline
Elite Member

3 years 11 months ago - 3 years 11 months ago #78742 by smilecollector

Replied by smilecollector on topic How to add a CSS class to checkboximage

PS: if I can't, I have already a plan B (creating a multiselect with HTML <img class="blabla" src=...> but it will be much easier for me to make it this way instead of rebuilding a new field... (almost most of it is already fill in)

Last edit: 3 years 11 months ago by ggppdk.

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

ggppdk
Offline
Administrator

3 years 11 months ago - 3 years 11 months ago #78743 by ggppdk

Replied by ggppdk on topic How to add a CSS class to checkboximage

Hello

1. duplicate the layout file
plugins/flexicontent_fields/checkboximage/tmpl/value_default.php
as
plugins/flexicontent_fields/checkboximage/tmpl/value_mydefault.php

2. Select layout value_mydefault as viewing layout in field configuration

3. Customize new file

-- Flexicontent is Free but involves a big effort on our part.
Like the our support? (for a bug-free FC, despite having a long list of functions) Like the features? Like the ongoing development and future commitment to FLEXIcontent?
-- Add your voice to the FLEXIcontent JED listing with a 5-star...

Last edit: 3 years 11 months ago by ggppdk.

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

smilecollector
Topic Author
Offline
Elite Member

3 years 11 months ago - 3 years 11 months ago #78746 by smilecollector

Replied by smilecollector on topic How to add a CSS class to checkboximage

Hello
If I'm not wrong, I guess I need to amend line 113 - I want to add value for instance as a class

I have no knowledge in PHP and so I'm unsure about how to do...

I can see the class but I don't know how to add the value - I tried different formula with some apostrophes, comma... around $element->value but I even unsure about the constant to use...

whatever I'm trying, I have 2 results:

1. no change of the class:

Code:

<img src="/images/stories/courrone_muse_50.png" class="fc_ifield_val_img hasTooltip" title="" alt="muse_courrone_muse_50" data-original-title="<strong></strong><br />muse_courrone_muse_50">

2. an error 404

Last edit: 3 years 11 months ago by ggppdk.

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

ggppdk
Offline
Administrator

3 years 11 months ago - 3 years 11 months ago #78747 by ggppdk

Replied by ggppdk on topic How to add a CSS class to checkboximage

Hello

you can and should do this inside the layout file

Code:

$my_classes = array(
  'yes' => 'cssclass1',
  'dynamite' => 'cssclass2',
  'oxygen' => 'cssclass3',
  ......
  ......
  ......
);

echo $my_classes[$value];

Last edit: 3 years 11 months ago by ggppdk.

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

smilecollector
Topic Author
Offline
Elite Member

3 years 11 months ago #78752 by smilecollector

Replied by smilecollector on topic How to add a CSS class to checkboximage

Thanks - an other stupid question

what about this line? should I have to include it in the line 113?

Code:

echo $my_classes[$value];

and - where am I supposed to paste this huge stuff? I imagine a bit above
may I use "_"?

Code:

$my_classes = array(
 'muse' => 'class_statut class_muse class_egerie class_special',
 'muse_badge' => 'class_statut class_muse_badge class_egerie class_special',
 'n1' => 'class_statut class_n1 class_special',
 'fox' => 'class_statut class_fox class_special',
 'coeur' => 'class_statut class_coeur class_special',
 'yes' => 'class_statut class_yes class_special',
 'dynamite' => 'class_statut class_dynamite class_special class_crazy',
 'oxygen' => 'class_statut class_oxygen class_special class_crazy',
 'o2' => 'class_statut class_o2 class_special class_crazy',
 'boost' => 'class_statut class_boost class_special class_crazy',
 'booster' => 'class_statut class_booster class_special class_crazy',
 'genie' => 'class_statut class_genie class_special class_crazy',
 'star' => 'class_statut class_star class_special',
 'pionnier' => 'class_statut class_pionnier class_special',
 'concours' => 'class_statut class_concours class_miss',
 'miss' => 'class_statut class_miss class_miss',
 'mannequin' => 'class_statut class_mannequin class_mode',
 'steampunk' => 'class_statut class_steampunk class_mode',
 'cosplay' => 'class_statut class_cosplay class_mode',
 'bouton' => 'class_statut class_bouton class_mode',
 'vintage' => 'class_statut class_vintage class_mode',
 'lady_in_red2' => 'class_statut class_lady_in_red2 class_special class_rouge',
 'lady_in_red' => 'class_statut class_lady_in_red class_special class_rouge',
 'bp' => 'class_statut class_bp class_muah',
 'cosmetics' => 'class_statut class_cosmetics class_muah',
 'lips' => 'class_statut class_lips class_muah',
 'hair' => 'class_statut class_hair class_muah',
 'dance' => 'class_statut class_dance class_dance',
 'hiphop' => 'class_statut class_hiphop class_dance',
 'tutu' => 'class_statut class_tutu class_dance',
 'sport' => 'class_statut class_sport class_sport',
 'twirling' => 'class_statut class_twirling class_sport class_baton',
 'twirling2' => 'class_statut class_twirling2 class_sport class_baton',
 'majorettes' => 'class_statut class_majorettes class_sport class_baton',
 'basket' => 'class_statut class_basket class_sport class_ball',
 'escrime' => 'class_statut class_escrime class_sport',
 'run' => 'class_statut class_run class_sport',
 'foot' => 'class_statut class_foot class_sport class_ball',
 'roller' => 'class_statut class_roller class_sport',
 'boxe' => 'class_statut class_boxe class_sport class_boxe class_combat',
 'boxing' => 'class_statut class_boxing class_sport class_boxe class_combat',
 'martial_art' => 'class_statut class_martial_art class_sport class_combat',
 'bmx' => 'class_statut class_bmx class_sport class_2roues',
 'moto' => 'class_statut class_moto class_sport class_2roues',
 'cross' => 'class_statut class_cross class_sport class_2roues',
 'tennis' => 'class_statut class_tennis class_sport',
 'blogger' => 'class_statut class_blogger class_art',
 'theatre' => 'class_statut class_theatre class_art',
 'cirque' => 'class_statut class_cirque class_art',
 'music_chant' => 'class_statut class_music_chant class_art class_music',
 'music_music' => 'class_statut class_music_music class_art class_music',
 'cello' => 'class_statut class_cello class_art class_music',
 'cello-blur' => 'class_statut class_cello-blur class_art class_music',
 'classic-flute' => 'class_statut class_classic-flute class_art class_music',
 'dble_bass' => 'class_statut class_dble_bass class_art class_music',
 'electric_guitar' => 'class_statut class_electric_guitar class_art class_music',
 'flute' => 'class_statut class_flute class_art class_music',
 'guitar' => 'class_statut class_guitar class_art class_music',
 'piano' => 'class_statut class_piano class_art class_music',
 'accordion' => 'class_statut class_accordion class_art class_music',
 'saxo' => 'class_statut class_saxo class_art class_music',
 'travers' => 'class_statut class_travers class_art class_music',
 'trumpet' => 'class_statut class_trumpet class_art class_music',
 'violin' => 'class_statut class_violin class_art class_music',
 'ukulele' => 'class_statut class_ukulele class_art class_music',
 'homme' => 'class_statut class_homme',
);

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