Comment faire un thème drupal 7

Trois parties:PréparationCréation du Thème FichiersInstaller le thème et finitions

Drupal est un des trois principaux systèmes de gestion de contenu (CMS de) dans le monde, avec Wordpress et Joomla, Drupal 7 (sorti en Janvier 2011) étant la dernière version de Drupal. Drupal est personnalisé en utilisant des thèmes, qui sont un moyen puissant pour améliorer un site web Drupal alimenté en définissant la structure et l'apparence (et des fonctionnalités supplémentaires) du site. Cet article va travailler à travers la création d'un thème Drupal 7, du début à la fin.


Se il vous plaît noter que bien que cet article vous guide à travers le processus de faire un thème de rien, il est souvent préférable de commencer votre travail avec un thème de base, tels que les thèmes zen, Omega ou Tao populaires. Si vous êtes nouveau à cela, faire un thème à partir de zéro première sera moins confus et vous enseigner plus!

Partie 1 de 3: Préparation
1
Assurez-vous que vous êtes prêt à attaquer les étapes. Pour être en mesure de suivre et compléter le tutoriel efficace, vous devez comprendre les bases de:
  • Le but de sites
  • HTML et CSS: comment ils sont utilisés pour rendre les sites Web
  • PHP: ce que ce est, et comment il est utilisé pour améliorer
  • CMS de: ce qu'ils sont, et comment ils sont utilisés à des sites Web de puissance
  • Drupal: Comment mettre en place un site web simple utilisation
  • Ne soyez pas rebutés par cette liste, cependant. Avec suffisamment d'enthousiasme, vous pouvez apprendre ce que vous devez en suivant ce tutoriel.
2
Mettre en place un environnement de développement. Afin de développer un thème rapidement et en douceur (sans questions liées à Internet connexion), vous devez mettre en place un environnement de développement (un programme de l'éditeur de code et un serveur de test) sur votre ordinateur. La façon la plus courante de le faire est d'installer un / LAMP / WAMP pile de MAMP (W: Windows- L: Linux-M: Mac, A: Apache, M du serveur: MySQL, la base de données du P: PHP, le script côté serveur) et télécharger un éditeur de code open-source.
Faire un Drupal 7 Thème Étape 1.jpg
3


Concevoir le site.Commencez par dessiner la présentation de la page d'accueil de votre site Web en utilisant un crayon et une feuille de Paper- vous avez besoin de se sentir libre de faire des erreurs et de modifications. Tirer toutes les parties d'une page web de base, y compris l'en-tête, le menu de navigation (qui peut être juste en dessous de l'en-tête ou dans une barre latérale), le corps de la page (pour le contenu), et le pied de page. Vous pouvez avoir d'autres domaines de votre design.When vous êtes satisfait de votre conception, recréez votre dessin de son esquisse un programme graphique qui vous permet de concevoir des pages Web, tels que Adobe Photoshop, ou mieux encore, Adobe Fireworks. Ensuite, assurez-vous ajoutez tous les autres visuelle Elements- considérer les couleurs et les contrastes clair-obscur, la typographie et la façon dont il se ajoute à l'expérience de l'utilisateur, la mise en page et des espaces vides (espaces est important!), Et comment le contenu se adapter.
Faire un Drupal 7 Thème Étape 2.jpg
4
Développer le site web en utilisant HTML et CSS.Tout comme dans l'étape de conception de sites Web, il est probablement plus efficace pour ne créer les pages web du site qui ont leurs propres mises en page uniques, telles que la page d'accueil et la page Contactez-nous. Gardez la disposition aussi simple que possible et utiliser des pratiques modernes et conventions si possible (tels que HTML5 et CSS3). À ce stade, ne ajoutez pas de script côté serveur (comme PHP), et de garder un script côté client (telles que javascript) au minimum, afin de ne pas interférer avec le code- de Drupal cela peut être ajouté plus tard.
Faire un Drupal 7 Thème Étape 3.jpg
5
Mettre en place Drupal pour commencer thématisation. Télécharger Drupal et déplacer les fichiers vers le serveur que vous allez utiliser pour développer votre thème (votre serveur de test - recommandé - ou un serveur en ligne). Placez les fichiers téléchargés dans le racine dossier (si vous utilisez un serveur de test, ce est la www ou bien localhost dossier). Utilisez un navigateur Web pour naviguer vers le dossier racine (par exemple, http: // www /) Et suivez le processus d'installation. Vous devez ensuite installer d'autres modules qui seront utiles pour le développement du thème.
Faire un Drupal 7 Thème Étape 4.jpg
6
Comprendre page web de la structure de Drupal et convertir vos pages statiques à elle.
  • Pages web HTML sont connus comme «statique» - ce qui signifie qu'ils ne sont pas conçus pour avoir un contenu qui change régulièrement - et sont construits en utilisant des balises de type bloc comme les «div» (et «tête», «pied de page», etc. dans HTML5). Pages web Drupal sont une combinaison de pièces statiques (HTML) et les parties dynamiques - pièces dont le contenu devrait être changé régulièrement. Ces parties dynamiques sont appelés 'les régions'Dans Drupal. Un exemple d'une région est une barre latérale, où vous pouvez insérer des liens de navigation, une boîte de recherche, des boutons de médias sociaux, et ainsi de suite. Voir le schéma ci-dessous pour une représentation visuelle:
  • Les choses que vous pouvez mettre en régions sont appelées 'blocs'Dans Drupal. Par exemple, une boîte de recherche ou d'un menu sont des blocs couramment utilisés. Vous pouvez insérer des blocs en régions, ré-arranger les blocs, et supprimer les blocs de régions lorsque vous vous connectez sur le Drupal La Structure > Blocs page. Bon nombre des éléments disponibles dans un site typique Drupal sont fournies par les modules installés, mais vous pouvez créer vos propres blocs sur la page Blocs.
  • Le contenu de chaque page Web (le corps du texte, titres, images, etc.) sont également placés dans une région: la région 'Contenu', qui est nécessaire pour tous les thèmes de Drupal. Le contenu de chaque page Web (ou blog ou un type de contenu personnalisé) est appelé un 'nœud», Et est emballé dans le La page principale bloc. En d'autres termes, le contenu de la A Propos De Nous Cette page est enregistrée dans noeud (avec un type de 'page', bien sûr noeud), et est sortie à la La page principale bloc, qui est placé dans le Content région.
  • Notez que parfois plusieurs nœuds sont affichés sur une page Web à travers le La page principale un exemple d'îlot est la première page, qui, par défaut montre plusieurs des articles les plus récents du site Web (blog messages).
  • Votre thème sera de contrôler les régions, mais pas ce que les administrateurs de sites Web mis en eux. Comme le themer, vous avez informer Drupal quelles régions votre thème aura, et les enregistrer dans des fichiers appelés modèles, qui sont couverts dans la section suivante.






Partie 2 de 3: Création du Thème Fichiers
Faire un Drupal 7 Thème Étape 5.jpg
1
Mettre en place le dossier du thème. Dans ce dossier, créez un fichier .info qui contient l'objet de la thème et donne des informations sur la façon dont il est utilisé. Inscrivez ce qui se passe en elle. Dans le dossier ajouter screenshots. et un dossier de CSS.
Faire un Drupal 7 Thème Étape 6.jpg
2
Créer les fichiers de modèle.

Drupal 'modèle«fichiers (qui ont un nom de fichier se terminant par .tpl.php, qui signifie« modèle de PHP ') sont utilisés par Drupal pour structurer la sortie de chaque page Web.
  • Certains des modèles Drupal couramment utilisés comprennent: html.tpl.php, page.tpl.php, block.tpl.php, et puis node.tpl.php.
  • Chaque page Web que les sorties Drupal (la «page d'accueil», par exemple) utilisent le html gabarit une fois, la page gabarit une fois, et le région, bloc et puis nœud modèles au moins une fois chacun.
  • Ces fichiers modèles contiennent HTML, PHP, et les variables imprimés dans les scripts PHP. Un exemple d'une variable est imprimée ? lt;? php print render ($ content) -> dans le node.tpl.php un fichier. Cette content variable stocke tout le texte que l'utilisateur a tapé dans le champ «corps» d'une page de base lorsque l'utilisateur a été connecté à Drupal. La fonction render () est tout simplement que la sortie de la content variable est enveloppé dans les balises HTML appropriées.
  • Pour voir toutes les variables disponibles dans un fichier de modèle, recherche pour '.tpl.php' le fichier par défaut de Drupal sur Drupal.org. Si vous souhaitez voir le contenu typique d'un de ces modèles, vous pouvez regarder les fichiers de modèle dans le répertoire des thèmes de Drupal dans le noyau drupal > thèmes dossier (pas le drupal > les sites > tous > thèmes dossier).
  • Faire un Drupal 7 Thème Étape 7.jpg
    3
    Insérer des fonctions de traitement et prétraitement.Ces fonctions permettent l'themer de modifier l'une des variables disponibles pour les modèles, de sorte qu'ils se affichent sortie différente quand ils sont imprimés dans les fichiers de modèle. La différence entre le processus et fonctions prétraiter est tout simplement que toutes les fonctions de prétraitement sont appelés (dans un ordre précis fixé par Drupal) avant tous les processus fonctions- ils sont de la même autrement.
  • Ces fonctions sont toutes écrites dans le template.php fichier (notez que ce est ne pas un «.tpl.php 'fichier). Le nom de toutes les fonctions de prétraitement et de processus que vous vous ajoutez votre thème commencera par le nom de votre thème, par exemple. mytheme_process_node (). Pour ajouter une à votre thème, vous pouvez l'écrire à partir de zéro, ou le copier depuis un autre thème et de le modifier.
  • Un exemple d'utilisation d'une fonction de pré-traitement pour modifier une variable est d'ajouter une ouverture et fermeture
    Guide pour le début et la fin de la variables de $ ['contenu'] variable dans une 'mytheme_preprocess_node () fonction.
  • Vous pouvez en lire plus sur les fonctions de processus et de prétraitement, et de voir l'ordre dans lequel ils sont appelés, sur le Drupal 7 Fonction thème page sur Drupal.org.


  • Partie 3 de 3: installer le thème et finitions
    Faire un Drupal 7 Thème Étape 8.jpg
    1
    Installer le thème de Drupal, mettre en place les vues nécessaires et ajoutez les nœuds et les régions nécessaires.
    Faire un Drupal 7 Thème Étape 9.jpg
    2
    Installer des modules supplémentaires utiles qui améliorent l'apparence, la sécurité et la fonctionnalité.

    La liste suivante de modules sont très utiles à la plupart des sites Drupal, et a été écrit par Steve Floyd dans son article Top 25 modules Drupal:
  • Vues. Vital pour themers, Vues vous permet de rassembler presque ne importe quel contenu de votre site Web et le présenter comme une page ou d'un bloc. Particulièrement utile pour la création d'une page d'accueil dynamique.
  • Vues Diaporama
  • Pathauto
  • Mollom
  • Google Analytics
  • WYSIWYG
  • XMLsitemap
  • Sauvegarde et Migrate
  • Workbench
  • Médias
  • Drupal Commerce
  • Faire un Drupal 7 Thème Étape 10.jpg
    3
    Ajouter du contenu de site Web pour compléter le site.




  • » » Comment faire un thème drupal 7