Aggiungi l'attributo di stile per visualizzare i campi

Vorrei aggiungere un attributo di stile a ciascun campo del titolo nella mia vista. Ho creato un campo per un colore. Ho provato a riscrivere il risultato in questo modo:

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

Ma l'attributo di stile verrà rimosso. Sto usando Drupal 7.

Qualsiasi aiuto apprezzato.

Puoi impostare una classe sul campo del titolo usando Impostazioni stile come mostrato nella schermata seguente. Puoi sostituire i token utente nelle impostazioni dello stile per impostare la classe sul campo del titolo.

Utilizzando javascript piccolo o jquery leggi la classe del campo del titolo e imposta il colore come il nome della classe usando la proprietà CSS .

Puoi creare un tpl per questo campo (esempio: views-view-field-MY-VIEW-NAME-page.tpl.php), in questo tpl puoi aggiungere il token scrivendo questo:

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

Ho anche dovuto includere il valore di un campo come colore in linea per un determinato campo. Dopo aver esplorato il Web per trovare una soluzione facilmente personalizzabile, ho finito per farlo:

1. Aggiungi il valore del colore come token di classe CSS, proprio come l'immagine nel post precedente.

2. Riscrivi la funzione hook_preprocess_views_view_field () in questo modo:

    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;
       }
     }
   
   }

Come puoi vedere, ho aggiunto queste righe:

$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]);
  }
}

E cambia la riga sotto:

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

aggiungi un nome nel campo suggerito, quindi apri style.css nella cartella del tuo tema e digita ".my-css-name" seguito dai risultati css desiderati come:

.my-css-name {color: rosso; sfondo: verde; }

Sto solo facendo qualcosa di simile ed ecco cosa ho fatto:

1- Creare una vista con i campi di colore e titolo.

2- Creare un "views-view-fields.tpl" personalizzato per quella vista. (Un modello personalizzato solo per il campo colore, mi ha mostrato un errore)

3- Alla field->contentriga aggiungi / sostituisci quello che ti serve ....<h2 style="color: #<?php print $field->content; ?>">

/ / / / Da ora in poi, non l'ho provato, ma dovrebbe funzionare bene / / / /

4- Escludere il campo del titolo e mostrarlo nell'intestazione / gruppo

5- Creare un "views-view-unformatted.tpl" personalizzato per quella vista.

6- In questa vista aggiungiamo <?php print $title; ?></h2>dopo <?php print $row; ?>. (aggiungiamo il titolo e chiudiamo il tag H aperto nel primo modello)

ULTIMA MODIFICA:

Puoi semplicemente usare le viste PHP per stampare tutto ciò di cui hai bisogno e lo stile non verrà filtrato.

Ho avuto questo stesso problema e l'ho risolto creando un modello chiamato

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

Nel mio caso, il codice che ho usato per creare l'HTML di cui avevo bisogno era:

<?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>';

Abilitazione del modulo Devel e utilizzo

dpm($row);

nel file modello è stato MOLTO utile. Non avrei potuto capirlo senza di essa.

La soluzione più semplice che ho trovato è stata quella di inserire il valore come attributo di dati. Quindi nel mio JavaScript prendo il valore dal campo dati e aggiorno il CSS per riflettere la modifica.