você está aqui: Home  → Arquivo de Mensagens

Drupal e Bootstrap em temas que não usam o Bootstrap como padrão

Colaboração: Cesar Brod

Data de Publicação: 08 de julho de 2014

Essa é uma dica um tanto específica para aqueles que trabalham com o Drupal.

Desde que o Twitter lançou o Bootstrap, um framework para o desenvolvimento de projetos web responsivos em HTML, CSS e Javascript, vários gerenciadores de conteúdo passaram a contar com temas que usam a tecnologia.

Se você, como eu, usa o Drupal há algum tempo, é bem provável que você tenha optado por desenvolver ou adequar temas que ainda não utilizavam o Bootstrap. Nesse caso, faça o seguinte. Baixe e descompacte o Bootstrap e, dentro da estrutura de seu tema, na pasta sites/all/themes/meutema, coloque todos os arquivos de css extraídos do Bootstrap. Dentro da pasta sites/all/themes/meutema/js coloque os Javascripts extraídos do Bootstrap.

Altere seu arquivo meutema.info e adicione as seguintes informações:

  stylesheets[all][] = bootstrap.css 
  stylesheets[all][] = bootstrap.min.css 
  stylesheets[all][] = bootstrap-theme.css 
  stylesheets[all][] = bootstrap-theme.min.css 
  
  scripts[] = js/custom.js 
  scripts[] = js/bootstrap.js 
  scripts[] = js/bootstrap.min.js 

Pronto! No meu caso, isso foi o suficiente para que eu possa usar módulos de panels, views e displays específicos para o Bootstrap.

Os nomes dos elementos nos arquivos css do Bootstrap não correspondiam com nomes que eu usei em meus css anteriores, assim não tive problemas de conflitos. Mas, em todo o caso, comece conferindo por aí se você encontrar alguma dificuldade.


Cesar Brod ministra cursos in-house adequados à necessidade de sua empresa, além de atuar como coach de equipes ágeis. Visite nosso portal para saber mais ou entre em contato diretamente com o autor para mais informações.



Veja a relação completa dos artigos de Cesar Brod

 

 

Opinião dos Leitores

Seja o primeiro a comentar este artigo
*Nome:
Email:
Me notifique sobre novos comentários nessa página
Oculte meu email
*Texto:
 
  Para publicar seu comentário, digite o código contido na imagem acima
 


Powered by Scriptsmill Comments Script