Comment commencer à apprendre le développement CSS et le thème?

Question

Quelles seraient vos suggestions pour l'apprentissage et le développement CSS thème WordPress?

J'utilise WordPress depuis plus de 4 ans, mais je n'ai jamais vraiment obtenu à l'aise avec le CSS ou le design à thème (je pourrais modifier ici et là, mais ce n'est pas vraiment faire beaucoup). J'aimerais pouvoir faire cela, mais je ne sais pas par où commencer. La plupart des guides, je suis tombé sur ne sont pas spécifiques WP, et je crains que je vais à travers le matériau redondant.

Merci

Answer 1

Tout d'abord les choses diffèrent entre. WP est pas CSS et CSS n'est pas WP. Mais thèmes WP utilisent CSS. Donc, si vous en apprendre davantage sur CSS vous fondamentalement pas faire le mal (bonne chose avec CSS est, il est commun entre tous sites). L'autre partie est HTML. Et puis vous avez PHP.

Ce sont donc trois langages informatiques utilisés avec l'autre:

• un langage de programmation: PHP
• une langue structurelle: HTML
• une langue spécifique de domaine: CSS

Ensuite, vous avez une architecture réseau multi-couches: PHP est exécuté sur le serveur et HTML et CSS est fourni par le serveur, mais en lecture / traité par le navigateur sur l'ordinateur client

.

Donc, même si des thèmes peut sembler simple, avec WP tout cela devient interchangeable mixte et vous devez vous mettre les choses à part à nouveau.

PHP est "Theme" (PHP) Fichiers, HTML est généré (et aussi bien est) dans les fichiers de thème, CSS est dans le fichier CSS.

Donc, fondamentalement, vous devez vous décider ce que vous voulez apprendre. La plupart des ressources diffèrent entre PHP et HTML / CSS.

Sur la base de votre question, je ne peux que vous suggérer d'apprendre CSS. Il est très puissant après avoir pleinement compris la Cascade. Vous devez savoir HTML coup droit (pas de PHP, juste HTML). Dans le CSS final est tout à fait important pour la représentation visuelle d'un site web, il est un outil électrique pour décorer un site Web. Ainsi, vous pouvez l'utiliser avec tout, même des thèmes wordpress;)

Allez-y. Si vous ne l'avez pas compris jusqu'à présent au bout de 4 ans, vous passer un peu d'éducation. Je suggère un livre comme http://oreilly.com/catalog/9780596101978 qui est parfait pour l'auto-éducation (à côté de la pratique).

CSS lui-même est très bien deined par le W3C ainsi que HTML est. La définition il n'y a pas très convivial mais il est correct avec une certaine vous pouvez apprendre beaucoup de choses là-bas aussi. W3Schools est bien fait aussi bien (et ce site fait en quelque sorte au fil des ans, regarde au moins une partie du cerveau est derrière elle). HTML / CSS, qui est le Web, saisissez votre source: D

Pour PHP il y a php.net. Crowdsourcing, eh bien, il est toujours en évolution et nécessite des ressources de votre carrière personnelle, il ne faut pas trop se concentrer sur elle. Son Soigné développé de toute façon, ce qui est juste pour regarder bon pour vous, ne pas se concentrer sur wordpress trop.

Answer 2

En ce qui concerne CSS va, il n'y a pas beaucoup de choses spécifique WordPress dans ce domaine. W3Schools et passer par leurs tutoriels. En ce qui concerne l'apprentissage comment construire un thème, les deux meilleures ressources que je peux recommander sont les codex de et le thème par défaut (à partir de maintenant, Twenty Ten). Lisez la page de Thème de développement et modèle Balises

J'espère que cela a aidé!

Answer 3

Étape 1: Créer un thème enfant d'un bon thème parent solide. A. Installer le thème thématique. B. Suivez les instructions pour faire un thème enfant. (Déplacer le dossier-échantillon-enfant-thème thématique en dehors du dossier thématique, sous wp-content / themes. Maintenant vous avez / Wp-content / themes / thématique et / Wp-content / themes / échantillon-enfant-thème thématique. C. Renommer ce dernier répertoire à votre nouveau nom de thème préféré. D. Allez dans l'écran d'apparence, et activer votre nouveau thème.

Étape 2: Modifier styles.css, et d'expérimenter avec CSS. A. Par exemple, ajouter:

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

Il est plus facile de commencer en changeant les couleurs et les polices, vous pouvez faire des choses plus fantaisistes comme les coins arrondis, divs flottants, etc.

Étape 3: Utilisez le style.css d'origine dans le répertoire / wp-content / themes / thématique comme guide. étudier vraiment style.css. Utilisez une référence, par exemple à l'aide http://reference.sitepoint.com/css comprendre chaque règle.

Avec un thème de l'enfant, vous pouvez changer aussi peu ou autant que vous aimez. Par exemple, certains ne changer le logo #brand, comme indiqué ci-dessus. Plus vous essayez, plus vous apprendrez.

Answer 4

La chose la plus importante que vous pouvez faire est de créer un WordPress installation locale que vous pouvez jouer avec. (Instructions pour: Mac | de Windows | Linux ) Cela vous permettra d'expérimenter et de faire des erreurs sans le reste du monde à regarder.

Le meilleur moyen d'apprendre est en modifiant des thèmes existants et la création de thèmes d'enfant pour les différents cadres . De ceux-ci, mon préféré est thématique . Il est très difficile de commencer à partir de zéro, de sorte que ces ressources peuvent vous aider à toucher le sol en cours d'exécution.

Pour en savoir CSS, w3schools.com est Ressource. Pour de nombreux designers, Firebug est un outil indispensable. Ne partez pas sans elle!

Answer 5

Kylan mentionné Firebug pour Firefox.

Il est un outil vraiment génial pour voir comment d'autres ont construit leurs thèmes.

Télécharger quelques thèmes à la recherche cool et puis utiliser Firebug pour les explorer. Cela m'a aidé beaucoup quand j'ai commencé.

Answer 6

ces gars-là me ont beaucoup aidé (et encore) http://digwp.com/ Leurs bookis HandsOn et facile realy à comprendre et donc est leur blog!