Dodaj atrybut stylu, aby wyświetlić pola

12

Chciałbym dodać atrybut stylu do każdego pola tytułu w moim widoku. Stworzyłem jedno pole dla koloru. Próbowałem przepisać wynik w ten sposób:

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

Ale atrybut stylu zostanie usunięty. Używam Drupala 7.

Każda pomoc doceniona.

Ksn
źródło
Dlaczego jest usuwany? Czy zamiast tego próbowałeś użyć globalnego pola tekstowego?
Alex Gill
Dziękuję za Twoją odpowiedź! Co masz na myśli z globalnym polem tekstowym? Ustawienia w moim widoku: Format: Niesformatowana lista Pokaż: Pola
Ksn
Możesz dodać pole „globalny tekst”. To pole musi iść za innymi polami, które już dodałeś. Następnie możesz użyć tokenów w tym niestandardowym polu, aby stworzyć podobne do tego, co zrobiłeś powyżej. Następnie możesz ukryć pola wyświetlane w polu niestandardowym.
Alex Gill
1
Najlepszą opcją jest prawdopodobnie utworzenie niestandardowego pliku szablonu dla tego pola lub użycie klasy na podstawie tokenu wymienionego poniżej.
Alex Gill
1
Jeśli spojrzysz w sekcji „Zaawansowane” po prawej stronie, znajdziesz opcję „Informacje o motywie”, tutaj znajdziesz sugestie dotyczące szablonów.
Alex Gill

Odpowiedzi:

4

Możesz ustawić klasę w polu tytułowym za pomocą Ustawień stylu, jak pokazano poniżej na ekranie. Użytkownik może zastąpić tokeny w ustawieniach stylu, aby ustawić klasę na pole tytułu.

wprowadź opis zdjęcia tutaj

Używając małego javascript lub jquery, odczytaj klasę pola tytułu i ustaw ten sam kolor co nazwa klasy za pomocą właściwości CSS .

Anil Sagar
źródło
2
Być może twoje rozwiązanie działa, ale co mam rozwiązać bez javascript. Jest możliwe?
Ksn
2
Nie można bezpośrednio wstrzyknąć wartości pola do właściwości stylu ze względu na problemy z bezpieczeństwem. Zobacz problem tutaj drupal.org/node/853880
Anil Sagar
Następnie musisz napisać osobną klasę css dla każdego koloru, jednak jest to najgorszy przypadek, ponieważ musisz napisać 16 milionów klas :(. JavaScript lub jquery byłyby lepsze.
Mathankumar
2
Anil, wypróbowałem twoje rozwiązanie, ale Drupal usunął # z koloru, więc znalazłem inne rozwiązanie z jQuery. Dodałem dane atrybutu do pola: <h2 data-color = "[field_color]"> [title_1] </h2> Zbadałem inne rozwiązania z szablonami, ale nie mogłem znaleźć właściwej metody ich rozwiązania.
Ksn
1

Możesz utworzyć tpl dla tego pola (przykład: views-view-field-MY-VIEW-NAME-page.tpl.php), w tym tpl możesz dodać token piszący:

<h2 style="color: <?php print $field->last_tokens['[field_color]'] ?>;"><?php print $field->last_tokens['[title_1]'] ?></h2>
David Motilla
źródło
1

Musiałem także dołączyć wartość pola jako kolor wstawiany dla określonego pola. Po przejrzeniu sieci w celu znalezienia łatwego do dostosowania rozwiązania, skończyłem na tym, że:

  1. Dodaj wartość koloru jako token klasy CSS, tak jak obraz z poprzedniego postu.
  2. Przepisz funkcję hook_preprocess_views_view_field () w następujący sposób:

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

Jak widać, dodałem następujące linie:

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

I zmień wiersz pod:

$pre = '<' . $object->element_type;
if ($class) {
  $pre .= ' class="' . implode(' ', $class_array) . '"';
}
if ($style) {
  $pre .= ' style="' . $style . '"';
}
Pol Dellaiera
źródło
0

dodaj nazwę do pola anil sugerowanego, a następnie otwórz style.css w folderze motywu i wpisz „.my-css-name”, a następnie żądane wyniki css, takie jak:

.my-css-name {kolor: czerwony; tło: zielony; }

aaronStarK
źródło
0

Po prostu robię coś podobnego i oto co zrobiłem:

1- Utwórz widok z polami koloru i tytułu.

2- Utwórz niestandardowy „views-view-fields.tpl” dla tego widoku. (Szablon niestandardowy tylko dla pola koloru, pokazał mi błąd)

3- Na field->contentlinii dodaj / zamień to, czego potrzebujesz ....<h2 style="color: #<?php print $field->content; ?>">

/ / / / Od tej pory nie testowałem tego, ale powinno działać dobrze / / / /

4- Wyklucz pole tytułu i pokaż je w nagłówku / grupie

5- Utwórz niestandardowy „views-view-unformatted.tpl” dla tego widoku.

6- W tym widoku dodajemy <?php print $title; ?></h2>po <?php print $row; ?>. (dodajemy tytuł i zamykamy tag H otwarty w pierwszym szablonie)


OSTATNIA EDYCJA:

Możesz po prostu użyć widoku PHP do wydrukowania wszystkiego, czego potrzebujesz, a styl nie będzie filtrowany.

Federico Arena
źródło
0

Miałem ten sam problem i rozwiązałem go, tworząc szablon o nazwie

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

W moim przypadku kod, którego użyłem do utworzenia potrzebnego kodu HTML, to:

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

Włączanie modułu Devel i korzystanie z niego

dpm($row);

w pliku szablonu był bardzo pomocny. Bez tego nie mógłbym tego rozgryźć.

evanmcd
źródło
0

Najłatwiejszym rozwiązaniem było wstawienie wartości jako atrybutu danych. Następnie w moim JavaScript pobieram wartość z pola danych i aktualizuję CSS, aby odzwierciedlić zmianę.

Hawkee
źródło