como adiciono classes extras a um campo de data nas visualizações?

7

Estou usando o Drupal 7 . Eu criei uma exibição, que está usando um campo de data. Gostaria de criar classes extras para o campo de data para essa exibição específica.

Por exemplo,

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

Agora eu tenho um código:

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

Como posso fazer isso passo a passo?


fonte

Respostas:

3
  1. Você precisa instalar o módulo token (a versão beta mais recente inclui tokens de campo) e o módulo formatadores personalizados em http://drupal.org/project/custom_formatters .

  2. Em seguida, ative-o na página de módulos.

  3. Vá para admin-> estrutura-> formatadores.

  4. Adicione um novo formatador, coloque o nome que você gosta.

  5. Formato: HTML + Tokens

  6. Tipo de campo: Data

  7. Formatador:

    <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. Salve 

Agora, você criou um formatador de data personalizado, que poderá usar na sua exibição!

John
fonte
4

Você pode fazer isso sem nenhum módulo adicional.

  1. Adicione o campo de data. Exclua isso da exibição. Escolha personalizado e escreva d na caixa (como na data php do dia). Altere as 'Configurações de estilo' - Personalize o campo HMTL (definido como nenhum) e Personalize o campo e o HTML do invólucro de etiqueta (definido como nenhum).Campo de data do drupal
  2. Adicione o campo de data novamente. Exclua isso também da exibição. Escolha personalizado e escreva M na caixa (como na data php do mês). Altere as 'Configurações de estilo' - Personalize o campo HMTL (definido como nenhum) e Personalize o campo e o HTML do invólucro de etiqueta (definido como nenhum).
  3. Adicione o campo de data novamente. Exclua isso também da exibição. Escolha personalizado e escreva Y na caixa (como na data php do ano). Altere as 'Configurações de estilo' - Personalize o campo HMTL (definido como nenhum) e Personalize o campo e o HTML do invólucro de etiqueta (definido como nenhum).
  4. Adicione o campo de data novamente (ÚLTIMA HORA!). NÃO EXCLUIR ISTO DO VISOR. Escolha personalizado e escreva G: i (como na data php para as horas e minutos). Altere as 'Configurações de estilo' - Personalize o campo HMTL (definido como nenhum) e Personalize o campo e o HTML do invólucro de etiqueta (definido como nenhum).
  5. Reescreva os resultados deste campo de data final. Usando os padrões de substituição, você pode escrever algo como isto:

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

Resultados de reescrita do Drupal

David Paul
fonte
11
Parece um ótimo método para a data criada, mas parece que você não pode selecionar o "Formato personalizado" se estiver usando um campo do módulo Data adicionado a um tipo de conteúdo?
Mark
11
@ Mark, se você se deparar com esse problema, poderá adicionar seus formatos de data usando / admin / config / regional / date-time e, nas etapas 1 a 3, selecione o formato apropriado no menu suspenso em vez de personalizado.
Webdrips
3

Uma solução razoavelmente rápida (se você pode escrever php), mas uma solução leviana seria substituir o modelo desse campo (consulte Noções básicas sobre temas de exibições ), processar o valor bruto da data com php para retirar as partes separadas e colá-las com o HTML de sua escolha.

Como alternativa, acho que você poderia escrever um formatador de campo de data personalizado ( aqui está alguém que fez isso com o D6). Essa seria uma boa solução caso você queira reutilizar o formatador personalizado em seus nós.

Marcvangend
fonte
1

Isso não é possível usando a interface do usuário do Views. Você precisaria de um pouco complexo de código, e eu ficaria curioso sobre o seu caso de uso antes de incentivá-lo a descobrir isso.

Se você perguntasse como adicionar classes ao campo como um todo, a resposta seria algo como isto:

  1. Clique no campo na interface Views.

  2. Expanda o conjunto de campos "Configurações de estilo".

  3. Marque a caixa de seleção "Personalizar campo HTML" e, em seguida, a caixa de seleção "Criar uma classe CSS".

  4. Digite sua turma desejada.

Talvez essa solução seja suficiente. Caso contrário, desejo-lhe sorte.

tim.plunkett
fonte
2
Obrigado pela resposta, mas sua solução ajuda apenas a mudar de classe para todo o campo, não me permite criar partes de data separadas.
11
Em seguida, escrever um formatador personalizado é provavelmente sua única opção real; quando a data chegar à camada de tema, ela será completamente processada, consulte a função Auxiliar para obter dados de campo brutos e renderizados .
tim.plunkett
1

Isso é realmente fácil, (depois que você souber)

Use um campo personalizado do conjunto de exibição

Vá para admin / structure / ds / fields

(No menu: Estrutura -> Suíte de exibição -> Campos)

Clique em adicionar um campo de código

Para o meu caso de uso, digitei o seguinte

Rótulo

Qualquer coisa

Entidades

Campo limite

Deixado em branco

Código do campo

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

Símbolo

verificado

Depois de criar o campo, vá para a página de exibição de gerenciamento do tipo de conteúdo e modo de exibição que você está ajustando e selecione o novo campo personalizado.

Captura de tela da configuração acima

Captura de tela da página de configurações

chim
fonte