web-dev-qa-db-fra.com

Comment ajouter une classe CSS aux champs dans Drupal 7?

Je veux ajouter une classe CSS à la sortie HTML de chaque champ de ma collection de champs.

Veuillez me recommander un module ou une méthode pour y parvenir. J'ai essayé les modules Fences et Field Formatter Class mais ils n'ont pas fonctionné.

7entitiestheming
6
sneha.kamble

De la manière suivante, vous pouvez ajouter une classe à un champ de formulaire:

$form['crust_size'] = array(
  '#title' => t('Crust Size'),
  '#type' => 'select',
  '#description' => 'Select the desired pizza crust size.',
  '#options' => array(t('10"'), t('12"'), t('16"')),
  '#attributes' => array('class' => array('my-class')),

);
2
Sumoanand

Vous devriez essayer le module Field Formatter Class .

Ce module permet aux administrateurs de site d'ajouter des classes à l'encapsuleur HTML externe pour tout affichage de champ.

Les classes peuvent être spécifiées dans Gérer les paramètres d'affichage des types de contenu, des utilisateurs et d'autres entités.

[~ # ~] ou [~ # ~]

Le module Field Formatter CSS Class .

Le module de classe CSS du formateur de champs vous permet de définir n'importe quel champ texte/liste/option à afficher en tant que classe CSS sur le nœud. Cela permet à l'auteur du nœud de sélectionner un style CSS prédéfini par nœud.

2
AjitS

Vous pouvez utiliser hook_preprocess_field () dans lequel vous pouvez définir des classes supplémentaires pour vos champs.

Vérifiez-les pour vous faire une idée:
http://atendesigngroup.com/blog/adding-css-classes-fields-drupal
https://Gist.github.com/1184302

2
Sithu

Oui, vous pouvez y parvenir via Afficher le module de la suite après avoir installé le module. Voici bon tutoriel pour cela.

  1. Allez pour gérer l'affichage de votre type de contenu sous le formulaire de gestion de l'affichage, il y a une option de mise en page fournie par la suite d'affichage.
  2. Sélectionnez le souhait de mise en page et enregistrez-le.
  3. Maintenant, vous pouvez voir un petit paramètre dans le côté droit de chaque champ, comme indiqué dans la capture d'écran ci-dessous.
  4. Dans le modèle de champ, sélectionnez expert si vous souhaitez modifier la classe et la balise html enroulée autour du champ
  5. Si vous voulez simplement ajouter une classe aux champs, voici un tutoriel pour cela

Snapshot of manage display

0
Pravin Ajaaz

Je suggère d'utiliser le module Display Suite , cela permettra une pleine capacité de contrôler les classes et le balisage sur les champs dans vos modes d'affichage. Il permet également une meilleure flexibilité pour les mises en page

0
chadpeppers