web-development-kb-pt.site

Como começar a aprender CSS e desenvolvimento de temas?

Quais seriam as suas sugestões para aprender CSS e desenvolvimento de temas WordPress?

Eu uso o WordPress há mais de 4 anos, mas eu nunca me senti confortável com CSS ou design de tema (eu poderia Tweak it aqui e ali, mas isso não está realmente fazendo muito). Eu adoraria poder fazer isso, mas não sei por onde começar. A maioria dos guias que conheci não são específicos WP e temo passar por material redundante.

Obrigado

themestheme-developmentcss
1
Tal Galili

Primeiro de tudo diferem entre as coisas. WP não é CSS e CSS não é WP. Mas WP temas fazem uso de CSS. Então, se você aprender sobre CSS, você basicamente não está fazendo nada errado (boa coisa com o CSS é, é comum entre todos os sites ). A outra parte é HTML. E então você tem PHP.

Então, estas são três linguagens de computador que são usadas umas com as outras:

  • uma linguagem de programação: PHP
  • uma linguagem estrutural: HTML
  • uma linguagem específica de domínio: CSS

Então você tem uma arquitetura de rede multi-camada: PHP é executado no servidor e HTML e CSS são fornecidos pelo servidor mas lidos/processados ​​pelo Browser no computador cliente.

Então, mesmo que os temas pareçam simples, com WP tudo isso se torna intercambiável e você deve colocar as coisas de novo.

PHP está em "Theme" (PHP) Arquivos, HTML é gerado (e também é) dentro desses arquivos de tema, CSS está no arquivo CSS.

Então basicamente você precisa decidir o que quer aprender. A maioria dos recursos é diferente entre PHP e HTML/CSS.

Com base na sua pergunta, posso sugerir apenas que você aprenda CSS. É muito poderoso depois que você entendeu completamente o Cascade. Você precisa conhecer o forehand de HTML (não PHP, apenas HTML). No final, CSS é absolutamente importante para a representação visual de um site, é uma ferramenta poderosa para decorar qualquer site. Então você pode usar isso com tudo, até temas de wordpress;)

Vá em frente. Se você não entendeu até agora depois de 4 anos, se dedique a alguma educação. Sugiro algum livro como http://oreilly.com/catalog/9780596101978 que é perfeito para a auto-educação (ao lado de praticar).

O CSS em si é muito bem definido pelo W3C e pelo HTML. A definição não é muito amigável, mas é correta, então com alguns você também pode aprender muito. O w3schools é bem feito também (e esse site de alguma forma faz isso ao longo dos anos, parece que pelo menos algum cérebro está por trás disso). HTML/CSS, que é o WWW, pegue sua fonte: D

Para PHP existe o php.net. Para o wordpress, bem, ele está sempre mudando e consome recursos de sua carreira pessoal, por isso não se concentre muito nisso. Seu bem mantido desenvolvido de qualquer maneira assim, basta olhar para o que é bom para você, não se concentre em wordpress demais.

5
hakre

Quanto CSS vai, não há um monte de coisas específicas do WordPress nesta área. Vá para w3schools e siga seus tutoriais. No que diz respeito a aprender como construir um tema, os dois melhores recursos que eu posso recomendar são a seção do desenvolvedor do tema do códice e o tema padrão (a partir de agora, Dois mil e dez). Leia a página de Desenvolvimento de Tema e a página Modelos para obter uma boa compreensão básica. Em seguida, basta ler o código-fonte do tema padrão, usando os documentos do desenvolvedor (especialmente os Tags de modelo e Referência de Função páginas) como referência.

Espero que isso tenha ajudado!

3
John P Bloch

A coisa mais importante que você pode fazer é criar uma instalação local do WordPress com a qual você possa brincar. (Instruções para: Mac | Windows | Linux ) Isso permitirá que você experimente e cometa erros sem o resto do mundo assistindo.

A maneira mais rápida de aprender é modificar os temas existentes e criar temas filhos para os vários frameworks . Destes, meu favorito pessoal é Temático . É muito difícil começar do zero, então esses recursos podem ajudá-lo a começar a corrida.

Para aprender CSS, w3schools.com é o recurso . Para muitos designers, Firebug é uma ferramenta indispensável. Não saia de casa sem ela!

2
kylan

Etapa 1: crie um tema filho de um bom tema pai sólido. A. Instale o tema temático. B. Siga as instruções para criar um tema infantil. (Mova a pasta theme-sample-child-theme para fora da pasta temática, em wp-content/themes. Agora você terá/wp-content/themes/thematic, e/wp-content/themes/thematic-sample- C. Renomeie o último diretório para o novo nome do tema preferido D. Vá para a tela de aparência e ative seu novo tema.

Etapa 2: edite o styles.css e experimente o CSS. A. Por exemplo, adicione:

#primary, #secondary {
   background-color: #e8e8d6;   
   margin-right: 10px;
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
   padding:18px 0 0;
}

#branding {
    background: url(http://example.com/wp-content/uploads/2010/09/example.jpg) top left no-repeat;
}

É mais fácil começar apenas mudando as cores e as fontes, então você pode entrar em coisas mais extravagantes, como cantos arredondados, divs flutuantes, etc.

Etapa 3: use o estilo original.css no diretório/wp-content/themes/thematic como seu guia. Realmente estude esse estilo.css. Use uma referência como http://reference.sitepoint.com/css para ajudar a entender cada regra.

Com um tema infantil, você pode mudar o quanto quiser. Por exemplo, alguns apenas alterarão o logotipo #brand, conforme mostrado acima. Quanto mais você tentar, mais aprenderá.

2
Marjorie Roswell

esses caras me ajudaram muito (e ainda fazem) http://digwp.com/ Sua bookis realmente handson e fácil de entender e por isso é seu blog!

0
user3401

Kylan mencionou o Firebug para o firefox.

É uma ótima ferramenta para ver como os outros criaram seus temas.

Baixe alguns temas interessantes e use o Firebug para explorá-los. Isso me ajudou muito quando eu comecei.

0
Nohl