web-dev-qa-db-fra.com

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

Quelles seraient vos suggestions pour apprendre le développement de thèmes CSS et WordPress?

J'utilise WordPress depuis plus de 4 ans maintenant, mais je ne me suis jamais vraiment familiarisé avec CSS ou la conception de thèmes (je pouvais le modifier ici et là, mais cela ne fait pas grand-chose). J'aimerais pouvoir les faire, mais je ne sais pas par où commencer. La plupart des guides que j'ai rencontrés ne sont pas spécifiquesWP, et je crains de passer par du matériel redondant.

Merci

themestheme-developmentcss
1
Tal Galili

Tout d’abord différer entre les trucs. WP n'est pas CSS et CSS n'est pas WP. Mais les thèmes WP utilisent CSS. Donc, si vous apprenez à propos de CSS, vous ne vous trompez pas (la bonne chose avec CSS, c’est courant entre tous les sites Web ). L'autre partie est HTML. Et puis vous avez PHP.

Donc, ce sont trois langages informatiques qui sont utilisés les uns avec les autres:

  • un langage de programmation: PHP
  • un langage structurel: HTML
  • une langue de domaine: CSS

Ensuite, vous avez une architecture de réseau multicouche: PHP est exécuté sur le serveur et HTML et CSS sont fournis par le serveur mais lus/traités par le navigateur sur l'ordinateur client.

Ainsi, même si les thèmes peuvent sembler simples, avec WP, tout cela est mélangé et vous devez le mettre à nouveau de côté.

PHP est dans "Thème" (PHP) Fichiers, HTML est généré (et l'est aussi) à l'intérieur de ces fichiers de thème, CSS est dans le fichier CSS.

Donc, fondamentalement, vous devez décider vous-même de 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 le CSS. Il est très puissant une fois que vous avez parfaitement compris la cascade. Vous devez connaître le droit d'auteur HTML (pas PHP, seulement HTML). En fin de compte, le CSS est absolument important pour la représentation visuelle d'un site Web, c'est un outil puissant pour décorer n'importe quel site Web. Donc, vous pouvez utiliser cela avec tout, même les thèmes wordpress;)

Fonce. Si vous n'avez pas compris jusqu'à maintenant après 4 ans, dépensez-vous un peu en é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 défini par le W3C et HTML. La définition n’est pas très conviviale, mais elle est correcte, vous pouvez donc en apprendre beaucoup là aussi. w3schools est également bien fait (et ce site le fait en quelque sorte au fil des ans, semble avoir au moins un peu de cerveau derrière). HTML/CSS, c’est le WWW, récupérez votre source: D

Pour PHP il y a php.net. Pour wordpress, cela change constamment et consomme des ressources de votre carrière personnelle, alors ne vous concentrez pas trop dessus. De toute façon, il est bien entretenu, alors cherchez ce qui est bon pour vous, ne vous concentrez pas trop sur wordpress.

5
hakre

En ce qui concerne CSS, il n’ya pas beaucoup de choses spécifiques à WordPress dans ce domaine. Allez à w3schools et parcourez leurs tutoriels. En ce qui concerne la construction d’un thème, les deux meilleures ressources que je puisse recommander sont la section pour développeurs du thème du codex et le thème par défaut (à ce jour, Vingt dix). Lisez la page Développement de thèmes et la page Modèles pour obtenir un bon compréhension de base. Ensuite, il suffit de lire le code source du thème par défaut, en utilisant la documentation du développeur (en particulier les balises de modèle et . Référence de fonction pages) comme référence.

J'espère que cela a aidé!

3
John P Bloch

La chose la plus importante à faire est de créer une installation WordPress locale avec laquelle vous pourrez vous amuser. (Instructions pour: Mac | Windows | Linux ) Cela vous permettra d’expérimenter et de faire des erreurs sans que le reste du monde vous regarde.

Le moyen le plus rapide d'apprendre consiste à modifier les thèmes existants et à créer des thèmes enfants pour les divers cadres . Parmi ceux-ci, mon favori personnel est thématique . Il est très difficile de repartir de zéro, ces ressources peuvent donc vous aider à démarrer rapidement.

Pour apprendre le CSS, w3schools.com est la ressource . Firebug est un outil indispensable pour de nombreux concepteurs. Ne partez pas sans elle!

2
kylan

Étape 1: Créez un thème enfant d’un bon thème parent solide. A. Installez le thème thématique. B. Suivez leurs instructions pour créer un thème pour enfants. (Déplacez le dossier thematic-sample-child-theme en dehors du dossier thématique, sous wp-content/themes. Maintenant, vous avez/wp-content/themes/thematic et/wp-content/themes/theme-sample- child-theme. C. Renommez ce dernier répertoire en votre nouveau nom de thème préféré. D. Allez à l'écran d'affichage et activez votre nouveau thème.

Étape 2: Modifiez styles.css et expérimentez CSS. A. Par exemple, ajoutez:

#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 simplement en changeant les couleurs et les polices, vous pouvez alors vous lancer dans des choses plus sophistiquées telles que des coins arrondis, des séparations flottantes, etc.

Étape 3: utilisez le fichier original style.css du répertoire/wp-content/themes/thematic comme guide. Étudiez vraiment ce style.css. Utilisez une référence telle que http://reference.sitepoint.com/css pour vous aider à comprendre chaque règle.

Avec un thème pour enfants, vous pouvez changer autant ou autant que vous le souhaitez. Par exemple, certains ne changeront que le logo #brand, comme indiqué ci-dessus. Plus vous en essayez, plus vous en apprendrez.

2
Marjorie Roswell

http://digwp.com/ Leur livre est vraiment pratique et facile à comprendre et leur blog aussi!

0
user3401

Kylan a mentionné Firebug pour Firefox.

C'est un très bon outil pour voir comment les autres ont construit leurs thèmes.

Téléchargez quelques thèmes intéressants, puis utilisez Firebug pour les explorer. Cela m'a beaucoup aidé lorsque j'ai commencé.

0
Nohl