web-dev-qa-db-ja.com

Drupal 7のフィールドにCSSクラスを追加する方法は?

フィールドコレクションの各フィールドのHTML出力にCSSクラスを追加したいと思います。

これを達成するためにいくつかのモジュールまたは方法を私に勧めてください。 Fences および Field Formatter Class モジュールを試しましたが、機能しませんでした。

6
sneha.kamble

次の方法で、フォームフィールドにクラスを追加できます。

$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

Field Formatter Class モジュールを試してみてください。

このモジュールを使用すると、サイト管理者はフィールド表示用の外部HTMLラッパーにクラスを追加できます。

クラスは、コンテンツタイプ、ユーザー、およびその他のエンティティの[表示の管理]設定で指定できます。

[〜#〜]または[〜#〜]

Field Formatter CSS Class モジュール。

フィールドフォーマッタCSSクラスモジュールを使用すると、テキスト/リスト/オプションフィールドをノードのCSSクラスとしてレンダリングするように設定できます。これにより、ノードの作成者はノードごとに事前定義されたCSSスタイルを選択できます。

2
AjitS

フィールドに追加のクラスを定義できるhook_preprocess_field()を使用できます。

いくつかのアイデアを得るためにこれらをチェックしてください:
http://atendesigngroup.com/blog/adding-css-classes-fields-drupal
https://Gist.github.com/1184302

2
Sithu

はい、モジュールのインストール後に Display suite module でこれを実現できます。ここが良い チュートリアル です。

  1. 表示管理フォームの下にあるコンテンツタイプの表示を管理します。displaysuiteが提供するレイアウトオプションがあります。
  2. レイアウトの希望を選択して保存します。
  3. 以下のスクリーンショットに示すように、各フィールドの右側に小さな設定が表示されます。
  4. フィールドを囲むクラスとhtmlタグを変更する場合は、フィールドテンプレートの選択でエキスパートを選択します
  5. クラスをフィールドに追加したい場合は、ここに tutorial を指定します

Snapshot of manage display

0
Pravin Ajaaz

Display Suite モジュールの使用をお勧めします。これにより、ビューモードでフィールドのクラスとマークアップを完全に制御できるようになります。また、レイアウトの柔軟性が向上します

0
chadpeppers