Hinzufügen eines Stilattributs zum Anzeigen von Feldern

Ich möchte in meiner Ansicht jedem Titelfeld ein Stilattribut hinzufügen. Ich habe ein Feld für eine Farbe erstellt. Ich habe versucht, das Ergebnis so umzuschreiben:

<h2 style="color: [field_color];">[title_1]</h2>

Das style-Attribut wird jedoch entfernt. Ich benutze Drupal 7.

Jede Hilfe dankbar.

Sie können eine Klasse für das Titelfeld festlegen, indem Sie die Stileinstellungen verwenden, wie im folgenden Bildschirm dargestellt. Sie können Benutzer-Token-Ersetzungen in den Stileinstellungen vornehmen, um die Klasse auf das Titelfeld festzulegen.

Wenn Sie kleines Javascript oder eine kleine Abfrage verwenden, lesen Sie das Feld für die Titelklasse und stellen Sie die Farbe mithilfe der CSS- Eigenschaft auf den Namen der Klasse ein .

Sie können eine tpl für dieses Feld erstellen (Beispiel: views-view-field-MY-VIEW-NAME-page.tpl.php). In dieser tpl können Sie das Token hinzufügen, das dies schreibt:

<h2 style="color: <?php print $field->last_tokens['[field_color]'] ?>;"><?php print $field->last_tokens['[title_1]'] ?></h2>

Ich musste auch den Wert eines Feldes als Inline-Farbe für ein bestimmtes Feld angeben. Nachdem ich im Internet nach einer einfach anpassbaren Lösung gesucht hatte, ging ich folgendermaßen vor:

1. Fügen Sie den Wert der Farbe wie im vorherigen Beitrag als CSS-Klassentoken hinzu.

2. Schreiben Sie die hook_preprocess_views_view_field () Funktion wie folgt aus :

    function hook_preprocess_views_view_fields(&$vars) {
     $view = $vars['view'];
   
     // Loop through the fields for this view.
     $previous_inline = FALSE;
     $vars['fields'] = array(); // ensure it's at least an empty array.
     foreach ($view->field as $id => $field) {
   
       // render this even if set to exclude so it can be used elsewhere.
       $field_output = $view->style_plugin->get_field($view->row_index, $id);
       $empty = $field->is_value_empty($field_output, $field->options['empty_zero']);
       if (empty($field->options['exclude']) && (!$empty || (empty($field->options['hide_empty']) && empty($vars['options']['hide_empty'])))) {
         $object = new stdClass();
         $object->handler = & $view->field[$id];
         $object->inline = !empty($vars['options']['inline'][$id]);
   
         $object->element_type = $object->handler->element_type(TRUE, !$vars['options']['default_field_elements'], $object->inline);
         if ($object->element_type) {
           $class = '';
           if ($object->handler->options['element_default_classes']) {
             $class = 'field-content';
           }
   
           if ($classes = $object->handler->element_classes($view->row_index)) {
             if ($class) {
               $class .= ' ';
             }
             $class .= $classes;
           }
   
           $class_array = explode(' ', $class);
           foreach ($class_array as $cid => $candidate) {
             // Find the color hex code.
             if (preg_match('/([a-f]|[A-F]|[0-9]){3}(([a-f]|[A-F]|[0-9]){3})?\b/', $candidate)) {
               $style = 'color:#' . $candidate . ';';
               unset($class_array[$cid]);
             }
           }
   
           $pre = '<' . $object->element_type;
           if ($class) {
             $pre .= ' class="' . implode(' ', $class_array) . '"';
           }
           if ($style) {
             $pre .= ' style="' . $style . '"';
           }
           $field_output = $pre . '>' . $field_output . '</' . $object->element_type . '>';
         }
   
         // Protect ourself somewhat for backward compatibility. This will prevent
         // old templates from producing invalid HTML when no element type is selected.
         if (empty($object->element_type)) {
           $object->element_type = 'span';
         }
   
         $object->content = $field_output;
         if (isset($view->field[$id]->field_alias) && isset($vars['row']->{$view->field[$id]->field_alias})) {
           $object->raw = $vars['row']->{$view->field[$id]->field_alias};
         }
         else {
           $object->raw = NULL; // make sure it exists to reduce NOTICE
         }
   
         if (!empty($vars['options']['separator']) && $previous_inline && $object->inline && $object->content) {
           $object->separator = filter_xss_admin($vars['options']['separator']);
         }
   
         $object->class = drupal_clean_css_identifier($id);
   
         $previous_inline = $object->inline;
         $object->inline_html = $object->handler->element_wrapper_type(TRUE, TRUE);
         if ($object->inline_html === '' && $vars['options']['default_field_elements']) {
           $object->inline_html = $object->inline ? 'span' : 'div';
         }
   
         // Set up the wrapper HTML.
         $object->wrapper_prefix = '';
         $object->wrapper_suffix = '';
   
         if ($object->inline_html) {
           $class = '';
           if ($object->handler->options['element_default_classes']) {
             $class = "views-field views-field-" . $object->class;
           }
   
           if ($classes = $object->handler->element_wrapper_classes($view->row_index)) {
             if ($class) {
               $class .= ' ';
             }
             $class .= $classes;
           }
   
           $object->wrapper_prefix = '<' . $object->inline_html;
           if ($class) {
             $object->wrapper_prefix .= ' class="' . $class . '"';
           }
           $object->wrapper_prefix .= '>';
           $object->wrapper_suffix = '</' . $object->inline_html . '>';
         }
   
         // Set up the label for the value and the HTML to make it easier
         // on the template.
         $object->label = check_plain($view->field[$id]->label());
         $object->label_html = '';
         if ($object->label) {
           $object->label_html .= $object->label;
           if ($object->handler->options['element_label_colon']) {
             $object->label_html .= ': ';
           }
   
           $object->element_label_type = $object->handler->element_label_type(TRUE, !$vars['options']['default_field_elements']);
           if ($object->element_label_type) {
             $class = '';
             if ($object->handler->options['element_default_classes']) {
               $class = 'views-label views-label-' . $object->class;
             }
   
             $element_label_class = $object->handler->element_label_classes($view->row_index);
             if ($element_label_class) {
               if ($class) {
                 $class .= ' ';
               }
   
               $class .= $element_label_class;
             }
   
             $pre = '<' . $object->element_label_type;
             if ($class) {
               $pre .= ' class="' . $class . '"';
             }
             $pre .= '>';
   
             $object->label_html = $pre . $object->label_html . '</' . $object->element_label_type . '>';
           }
         }
   
         $vars['fields'][$id] = $object;
       }
     }
   
   }

Wie Sie sehen können, habe ich diese Zeilen hinzugefügt:

$style = '';
$class_array = explode(' ', $class);
foreach ($class_array as $cid => $candidate) {
  // Find the color hex code.
  if (preg_match('/([a-f]|[A-F]|[0-9]){3}(([a-f]|[A-F]|[0-9]){3})?\b/', $candidate)) {
    $style = 'color:#' . $candidate . ';';
    unset($class_array[$cid]);
  }
}

Und ändern Sie die Zeile unter:

$pre = '<' . $object->element_type;
if ($class) {
  $pre .= ' class="' . implode(' ', $class_array) . '"';
}
if ($style) {
  $pre .= ' style="' . $style . '"';
}

Fügen Sie einen Namen in das Feld ein und öffnen Sie style.css in Ihrem Themenordner. Geben Sie ".my-css-name" gefolgt von den gewünschten CSS-Ergebnissen ein, wie zum Beispiel:

Mein-CSS-Name {Farbe: rot; Hintergrund: grün; }

Ich mache nur etwas Ähnliches und hier ist, was ich getan habe:

1- Erstellen Sie eine Ansicht mit Farb- und Titelfeldern.

2- Erstellen Sie eine benutzerdefinierte "views-view-fields.tpl" für diese Ansicht. (Eine benutzerdefinierte Vorlage nur für das Farbfeld zeigte mir einen Fehler)

3- In der field->contentZeile hinzufügen / ersetzen, was Sie brauchen ....<h2 style="color: #<?php print $field->content; ?>">

/// Von nun an habe ich es nicht getestet, aber es sollte gut funktionieren ///

4- Schließen Sie das Titelfeld aus und zeigen Sie es in der Kopfzeile / Gruppe an

5- Erstellen Sie eine benutzerdefinierte "views-view-unformatted.tpl" für diese Ansicht.

6- In dieser Ansicht fügen wir <?php print $title; ?></h2>nach <?php print $row; ?>. (Wir fügen den Titel hinzu und schließen das in der ersten Vorlage geöffnete H-Tag.)

LAST EDIT:

Sie können einfach PHP-Ansichten verwenden, um alles zu drucken, was Sie brauchen, und der Stil wird nicht gefiltert.

Ich hatte das gleiche Problem und löste es, indem ich eine Vorlage mit dem Namen erstellte

views-view-field--field_name_here.tpl.php

In meinem Fall lautete der Code, mit dem ich den benötigten HTML-Code erstellte, wie folgt:

<?php

$bg_color = $variables["row"]->field_field_button_background_color[0]["raw"]["rgb"];
$link_title = $variables["row"]->field_field_slideshow_item_cta_link[0]["raw"]["title"];
$link_url = $variables["row"]->field_field_slideshow_item_cta_link[0]["raw"]["url"];

echo '<a style="background-color:'.$bg_color.'" href="'.$link_url.'">'.$link_title.'</a>';

Aktivieren des Entwicklungsmoduls und Verwenden von

dpm($row);

in der Vorlagendatei war sehr hilfreich. Hätte das nicht herausfinden können ohne es.

Die einfachste Lösung, die ich finden konnte, bestand darin, den Wert als Datenattribut einzufügen. Dann nehme ich in meinem JavaScript den Wert aus dem Datenfeld und aktualisiere das CSS, um die Änderung widerzuspiegeln.