¿Cómo agrego clases adicionales a un campo de fecha en las vistas?

Estoy usando Drupal 7 . Creé una vista, que está usando un campo de fecha. Me gustaría crear clases adicionales para el campo de fecha para esa vista específica.

Por ejemplo,

<div class="field-content">
 <span class="date">10</span>
 <span class="month">June</span>
 <span class="year">2011</span>
 <span class="time"> 8:00 </span>
</div>

Ahora tengo un código:

<div class="field-content">
 <span class="date-display-single">10 June 2011, 8:00</span>
</div>

¿Cómo puedo hacerlo paso a paso?

1. Debe instalar el módulo de tokens (la última versión beta incluye tokens de campo) y el módulo de formateadores personalizados desde http://drupal.org/project/custom_formatters .

2. Luego habilítelo desde la página de módulos.

3. Vaya a admin-> estructura-> formateadores.

4. Agregue un nuevo formateador, asígnele el nombre que desee.

5. Formato: HTML + Tokens

6. Tipo de campo: fecha

7. Formateador:

   <span class="day">[node:source:field-datefieldname:custom:j]</span>
   <span class="month">[node:source:field-datefieldname:custom:F]</span>
   <span class="year">[node:source:field-datefieldname:custom:Y]</span>

8. Salvar

¡Ahora, ha creado un formateador de fecha personalizado, que puede usar a su vista!

Puede hacer esto sin módulos adicionales.

1. Agregue el campo de fecha. Excluir esto de la pantalla. Elija personalizado y escriba d en el cuadro (como en la fecha php del día). Cambie la 'Configuración de estilo' - Personalice el campo HMTL (establecido en ninguno) y Personalice el campo y el contenedor de etiquetas HTML (establecido en ninguno).
2. Agregue el campo de fecha nuevamente. Excluya esto también de la pantalla. Elija personalizado y escriba M en el cuadro (como en la fecha de php para el mes). Cambie la 'Configuración de estilo' - Personalice el campo HMTL (establecido en ninguno) y Personalice el campo y el contenedor de etiquetas HTML (establecido en ninguno).
3. Agregue el campo de fecha nuevamente. Excluya esto también de la pantalla. Elija personalizado y escriba Y en el cuadro (como en la fecha de php para el año). Cambie la 'Configuración de estilo' - Personalice el campo HMTL (establecido en ninguno) y Personalice el campo y el contenedor de etiquetas HTML (establecido en ninguno).
4. Agregue el campo de fecha nuevamente (¡ÚLTIMA HORA!). NO EXCLUYA ESTO DE LA PANTALLA. Elija personalizado y escriba G: i (como en la fecha de php para las horas y minutos). Cambie la 'Configuración de estilo' - Personalice el campo HMTL (establecido en ninguno) y Personalice el campo y el contenedor de etiquetas HTML (establecido en ninguno).

5. Reescribe los resultados de este campo de fecha final. Usando los patrones de reemplazo, puede escribir algo como esto:

   <div class="date">
     <span class="day">
       [created]
     </span>
     <span class="month">
       [created_1]
     </span>
     <span class="year">
       [created_2]
     </span>
   </div>

Una solución razonablemente rápida (si puede escribir php), pero una solución un poco complicada sería anular la plantilla para ese campo (ver Vistas básicas de temas ), procesar el valor de fecha sin procesar con php para sacar las piezas separadas y luego pegarlas con El HTML de su elección.

Alternativamente, creo que podría escribir un formateador de campo de fecha personalizado ( aquí hay alguien que hizo eso para D6). Esa sería una buena solución en caso de que quiera reutilizar el formateador personalizado en sus nodos.

Esto no es posible usando la IU de Vistas. Necesitaría un código bastante complejo, y me gustaría conocer su caso de uso antes de alentarlo a que lo descubra.

Si preguntara cómo agregar clases al campo en su conjunto, la respuesta sería algo como esto:

1. Haga clic en el campo en la interfaz Vistas.

2. Expanda el conjunto de campos "Configuración de estilo".

3. Marque la casilla de verificación "Personalizar HTML de campo", luego la casilla de verificación "Crear una clase CSS".

4. Ingrese su clase deseada.

Quizás esa solución sea suficiente. De lo contrario, te deseo suerte.

Esto es realmente fácil (una vez que sepa cómo)

Utilice un campo personalizado de conjunto de visualización

Vaya a admin / structure / ds / fields

(En el menú: Estructura -> Display Suite -> Campos)

Haga clic en agregar un campo de código

Para mi caso de uso, ingresé lo siguiente

Etiqueta

Cualquier cosa

Entidades

Nodo

Campo de límite

Dejado en blanco

Código de campo

<div>
  <span class="mf-month">[node:created:custom:M]</span> 
  <span class="mf-day">[node:created:custom:d]</span>
</div>

Simbólico

comprobado

Una vez que haya creado el campo, vaya a la página de visualización de administración para el tipo de contenido y el modo de vista que está ajustando y seleccione el nuevo campo personalizado.

Captura de pantalla de la configuración anterior