Twenty Ten<br />The last theme you’ll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Hope you’ve guessed my name<br />Pleased to meet you<br />
Handyman depuis 1998<br />WordPress depuis 2005<br />(Pas encore assez) Impliqué dans la communauté WP<br />Freelance depu...
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Bling!<br />Bling!<br />
Twenty Ten: the last theme you'll ever need?<br />RIP Kubrick<br />Twenty Ten<br />
Hey there, good looking!<br />Supporte les nouveaux features<br />Conçu pour êtreune base de développement<br />Twenty Ten...
Twenty Ten: the last theme you'll ever need?<br />Les nouveaux features<br />Bells and whistles<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />without losing sleep over it<br />To develop a WordPress theme<br />
Twenty Ten: the last theme you'll ever need?<br />What is a theme?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br ...
Twenty Ten: the last theme you'll ever need?<br />Let’s get started<br />
<?php<br />Twenty Ten: the last theme you'll ever need?<br />|<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Easy Peasy!<br />Good learning experience, but…<br />A bad idea<br />
Twenty Ten: the last theme you'll ever need?<br />Sandbox<br />There has to be a better way<br />
Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br ...
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Encapsule les modifications<br />Utilise les compétences des designers<br />Des fois (pas souvent), le CSS ne suffit pas<b...
Twenty Ten: the last theme you'll ever need?<br />Theme frameworks<br />Could there be an even better way?<br />
SEO optimized!<br />Classes et IDs à la Sandbox<br />Menus déroulantsSoS<br />13 zones à widgets!<br />Des dizaines de hoo...
Twenty Ten: the last theme you'll ever need?<br />We are family<br />Child themes<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br ...
Twenty Ten: the last theme you'll ever need?<br />Page HTML<br />Templates<br />functions.php<br />Filters<br />Actions<br...
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Avantages Sandbox++<br />Désavantages Sandbox<br />More dependencies<br />Learning curve<br />Twenty Ten: the last theme y...
Twenty Ten: the last theme you'll ever need?<br />Twenty Ten as a Parent Theme<br />Who’s your daddy?<br />
Thematic: isoler modifications dans Child Theme<br />Sandbox: HTML complet avec unetonne de classes et d’IDs<br />Kubrick:...
Twenty Ten: the last theme you'll ever need?<br />CSS Mods<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Template Mods<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />What is good for?<br />functions.php<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />I think so too<br />Pretty good, no?<br />
Simple d’approche, mais puissant<br />Puissant, mais simple d’approche<br />Supporte(ra) tous les features<br />Créé et ma...
Twenty Ten: the last theme you'll ever need?<br />End with the beginning<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />
Twenty Ten: the last theme you'll ever need?<br />Questions?<br />Thanks!<br />
Upcoming SlideShare
Loading in …5
×

Twenty Ten: the last theme you'll ever need?

4,513 views

Published on

Présentation en franglais, prepared for WordCamp Montréal 2010.

Twenty Ten is the new default theme in WordPress 3.0. It showcases all the new features in 3.0 and incorporates best practices learned from theme frameworks developed by the community. I'll tell you why you should be using it for most (all?) your WordPress sites, starting right now. Then I'll show you how to do it.

Twenty Ten est le nouveau thème par défaut offert avec WordPress 3.0. Il met en valeur les nouvelles fonctionnalités de 3.0 et incorpore les meilleures pratiques glanées de "theme frameworks" développés par la communauté. Je vais vous expliquer pourquoi vous devriez dès maintenant l'utiliser pour la plupart de (tous?) vos sites WordPress. Puis je vous montrerai comment le faire.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
4,513
On SlideShare
0
From Embeds
0
Number of Embeds
374
Actions
Shares
0
Downloads
21
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide
  • Joke du 13poDernièreannée: Presque juste du WP Mon premier plugin Contribution à la traductionfrançaiseTheme review?Beaucoup de développement de thème
  • Développement de thème customTu me donne un PhotoshopJe tesors un thèmeWordPress fully fonctional
  • WordPress.com + Custom CSSChoisis un thèmeJe le pimpe
  • Nouveau thème par défautdepuis 3.03 grosses nouveautés:MultisiteCustom MenusTwenty Ten
  • Good looking: àvous de voirFeatures: on va passer viteBase de dév: le plus gros de la pres
  • Post thumbnail: utilisédans header image
  • Menudéroulantàpartir de la structure de pages
  • Menudéroulantàpartir de Custom Menus.Remarque le tour gris qui disparaît, grâceà…
  • Utilise le nouveau Custom Background APIPermet de faire plein de stupid shitIci, mon blog personnel
  • Làmon site de compagnie.Vousaurezcomprisque je suis pas un designer!
  • Première question:c’est quoi un thème? On peut le regarder de différents angles…
  • Cequ’onchoisitdans le theme picker, duh!Tout ce qui est en charge du look and feel de la partiepublique d’un site WordPress
  • Trèsconcrètement:Une bunch de fichiers. PHP, CSS, JS, PNG ouautres
  • La hiérarchie de templates…Troisgrandes classes:SingleListe (Archive)Modèles plus spécifique: page, tag, catégorie, date, auteur, homeCasspécifiques: unecatégorieprécise
  • Mon fucking masterpiece.Mon défi: expliquer comment un thèmefonctionne en 5 minutesEn partant du bas:WordPress: gestion du contenu, fonctions, users, comments, adminThème: présentationcôté publicTemplatesTemplate Tags pour allerchercher le contenu et le printerFilters pour modifier du contenuàl’outputfunctions.php (optionnel)Librairie de fonctionsutiles pour le thèmeFilters pour le modifierActiver des features avancésRegistrer des sidebarsActions pour insérer du contenu, roulerfonctions customTout çapousseune page web dans le browserHTMLTags pour entourer le contenu et signaler son sensId et class pour aider quand les tags ne suffisent plusTout çasert de hook pour le CSS et le JavaScriptCSS: look and feelJavaScript: effets fancy (animation, transitions, etc)
  • Bon.HTML, CSS, PHP, template tags, template hierarchy, codex, PHP.netY a pas un moyen plus simple?
  • Donne un bon headstart,surtoutsituveuxgarder un look “blog”. Par contre, situveux des looks différents, attacheta tuque.Dèsqu’ily a unemiseà jour, t’esbaisé:Écraser au complet: tuperdstes hacksRester avec ta version hackée: tuperds les nouveaux featuresMerger tes hacks dans la nouvelle version: tut’arraches les cheveux
  • Il fallaitconcevoir un thèmeexpressément pour servir de base àd’autresthèmes
  • Y aller en sens inverseKubrick: partir d’un design et d’utiliser les morceauxnécessaires pour l’implémenter (Template Tags, HTML, CSS)Sandbox: exposertous les morceauxdisponibles pour que la base soitcomplète et la plus utile possible pour les hackers.Output de *tous* les templates tagsTous les types de templatesTags, classes et ID àgogoDévelopper un thème = faire unefeuille de style
  • Çapaye pas de mine,parcequec’est pas fait pour êtreutilisételquel.Commeils le disentsibieneux-mêmes: un canevas pour les artistes CSS
  • Regardez-moitoutesces classes!
  • Hackeseulement un fichier, style.css. Justeluià merger dans un upgrade
  • Inspiré par Sandbox: encourage les modifs en CSS seulementPremium theme: pas juste du look &amp; feel, ajout de fonctionsaussiVise à encore plus encapsulerCeluique je connais: Thematic
  • Hooks:pourquoi? Parcequeconçu pour êtreétendu en Child Theme
  • Créer un thème: une bunch de fichiers
  • WPvachercher les templates dans le ChildS’il les trouve pas, dans le Parent (défini par Template: dansstyle.css)On copiedans le child theme seulementcequ’onveut changer du parent, oucequ’onajoute: isoler les changements
  • Un Parent Theme, c’estcommeajouterunecouche
  • Un Parent Theme, c’estcommeajouterunecouche
  • But de tousces hooks: permettred’insérerou de manipuler du contenu sanscopier des Templates:toujoursisoler des changements
  • Pourallerd’iciàlà:Du CSS et…
  • Le verdict?Commence avec le CSSPas assez? Les hooksPas encore assez? Override des TemplatesEstutilisabletelquelDésavantages:Encore juste un garsS’ilabandonne, qu’est-ce qui arrive?Dépendences:Update WP brise ThematicUpdate Thematic brisethème enfantUpdate WP brisethème enfantAttendre Thematic avantd’updater WP = attendre pour nouveaux features
  • Commethème de base, Twenty Ten a gardé les bonscôtés des 3 solutions présentéesavant, sans les inconvénients (oupresque)Dernier point est important. En choisissant Twenty Ten commethème parent, tu sais quetuserasjamaisabandonné et quetu sais que ton thème parent vaêtreupdaté en même temps queWordPress.Quelquesexemples de cequ’onpeut faire
  • Petit tweak pour site corpo: Posts =  Nouvelles. On veut pas de catégorieoud’auteurs
  • Pour 3 colonnes: séparer #primary et #secondary, ajuster floats, width et margins
  • Designcomplètementdifférent!Réimplémentation de MistyLook en Child Theme Twenty TenPourquoi?
  • Les liens d’un post àl’autredans les singlesPleind’autresbénéfices sans faire exprès: custom menus
  • Menu déroulants!En passant: surWP.com. Avantage de rester en CSS: compatible avec WP.com et l’option “Custom CSS”,autant en mode “override” que “tweaking”.
  • Headermodifié: nav bar en haut de l’imageSidebar modifiée: contenu par défautTemplate custom avec un paquet de zones de contenuDans Child Theme:Créer les nouveaux TemplatesCopier les Templates à modifier, les modifier
  • Modifiés:HeaderFooterPageSidebarAjoutés:Sidebars2 Page Templates: accueil, calendrier4 Template Parts: carousel, searchform-header, loop-category, loop-subpagesLoop? C’est quoi ça?
  • Get_template_part: nouveau Template Tag très puissant, permetunehiérarchie de template à un niveau plus granulaireUtilisédanstous les templates de type Liste
  • Exemple: Tag TemplateAvantage: plusbesoin de copier/modifier category.phpoutag.phpTrès simple, très puissant
  • Sertàcepourquoiçaavaitétéconçu:Librairie de fonctionsutilitairesActiver/désactiverfonctionsavancésSettings: sidebars, média, etc.
  • Bien documenté!Explique comment overriderdans un Child ThemeIf (!function_exists) = solution simple, puissante et élégante au problème de l’encapsulation des changements
  • remove_action(‘init’,’twentyten_widgets_init’);function setup_my_widgets()Confession: pas réussià faire marcher ça encore.
  • Peut-êtreparcequej’utiliseTwentyTen avec WP 2.9?
  • On a vu tout cequeça fait par défautOn a vu tout cequeçapeut faireComment Twenty Ten est-ilné?
  • Ticket 9015, ouvertily a 19mois par dd32
  • “So, What i&apos;m proposing, Is that instead of including a current generation base them such as Sandbox (Or the many others that escape my mind right now)Is that the WordPress Project aims to create a new theme, Which is Simple, Stylish, Clean code, Uses the latest features, And most importantly, Is easy for new developers to customise to their own requirements. At first, This probably sounds like yet another sandbox, But the idea behind it, Is to provide a platform which people can base their work from, Full well knowing that it uses the latest practices, Explains what its doing, and how its doing it, A Community effort, Not a single person (Or a small group of people)&apos;s opinions on how to do it.Kubrick isn&apos;t bad, It does look OK, and it IS a good theme, But its not the best for people to be basing their new themes off.New theme developers (And current developers even), Need something which they can rely upon.”La vision estlà: tout cequ’onvient de voirestdécritUn gars (ouunefille) le proposeUn an plus tard, çaexiste et on peuts’enservirC’est la beauté de l’open source. “It blows my mind.”
  • Twenty Ten: the last theme you'll ever need?

    1. 1. Twenty Ten<br />The last theme you’ll ever need?<br />
    2. 2. Twenty Ten: the last theme you'll ever need?<br />Hope you’ve guessed my name<br />Pleased to meet you<br />
    3. 3. Handyman depuis 1998<br />WordPress depuis 2005<br />(Pas encore assez) Impliqué dans la communauté WP<br />Freelance depuis 2009<br />Twenty Ten: the last theme you'll ever need?<br />
    4. 4. Twenty Ten: the last theme you'll ever need?<br />
    5. 5. Twenty Ten: the last theme you'll ever need?<br />Bling!<br />Bling!<br />
    6. 6. Twenty Ten: the last theme you'll ever need?<br />RIP Kubrick<br />Twenty Ten<br />
    7. 7. Hey there, good looking!<br />Supporte les nouveaux features<br />Conçu pour êtreune base de développement<br />Twenty Ten: the last theme you'll ever need?<br />
    8. 8. Twenty Ten: the last theme you'll ever need?<br />Les nouveaux features<br />Bells and whistles<br />
    9. 9. Twenty Ten: the last theme you'll ever need?<br />
    10. 10. Twenty Ten: the last theme you'll ever need?<br />
    11. 11. Twenty Ten: the last theme you'll ever need?<br />
    12. 12. Twenty Ten: the last theme you'll ever need?<br />
    13. 13. Twenty Ten: the last theme you'll ever need?<br />
    14. 14. Twenty Ten: the last theme you'll ever need?<br />without losing sleep over it<br />To develop a WordPress theme<br />
    15. 15. Twenty Ten: the last theme you'll ever need?<br />What is a theme?<br />
    16. 16. Twenty Ten: the last theme you'll ever need?<br />
    17. 17. Twenty Ten: the last theme you'll ever need?<br />
    18. 18. Twenty Ten: the last theme you'll ever need?<br />
    19. 19. Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br />Page HTML<br />Templates<br />functions.php<br />Nom de fichier<br />Actions<br />Template Tags<br />Filters<br />WordPress<br />
    20. 20. Twenty Ten: the last theme you'll ever need?<br />Let’s get started<br />
    21. 21. <?php<br />Twenty Ten: the last theme you'll ever need?<br />|<br />
    22. 22. Twenty Ten: the last theme you'll ever need?<br />
    23. 23. Twenty Ten: the last theme you'll ever need?<br />Easy Peasy!<br />Good learning experience, but…<br />A bad idea<br />
    24. 24. Twenty Ten: the last theme you'll ever need?<br />Sandbox<br />There has to be a better way<br />
    25. 25. Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br />Page HTML<br />Templates<br />functions.php<br />Nom de fichier<br />Actions<br />Template Tags<br />Filters<br />WordPress<br />
    26. 26. Twenty Ten: the last theme you'll ever need?<br />
    27. 27. Twenty Ten: the last theme you'll ever need?<br />
    28. 28. Encapsule les modifications<br />Utilise les compétences des designers<br />Des fois (pas souvent), le CSS ne suffit pas<br />Pas beau par défaut<br />Abandonné<br />Twenty Ten: the last theme you'll ever need?<br />
    29. 29. Twenty Ten: the last theme you'll ever need?<br />Theme frameworks<br />Could there be an even better way?<br />
    30. 30. SEO optimized!<br />Classes et IDs à la Sandbox<br />Menus déroulantsSoS<br />13 zones à widgets!<br />Des dizaines de hooks supplémentaires<br />Twenty Ten: the last theme you'll ever need?<br />
    31. 31. Twenty Ten: the last theme you'll ever need?<br />We are family<br />Child themes<br />
    32. 32. Twenty Ten: the last theme you'll ever need?<br />
    33. 33. Twenty Ten: the last theme you'll ever need?<br />
    34. 34. Twenty Ten: the last theme you'll ever need?<br />
    35. 35. Twenty Ten: the last theme you'll ever need?<br />
    36. 36. Twenty Ten: the last theme you'll ever need?<br />Image<br />CSS<br />JavaScript<br /><tag /><br />id=“”<br />class=“”<br />Page HTML<br />Templates<br />functions.php<br />Nom de fichier<br />Actions<br />Template Tags<br />Filters<br />WordPress<br />
    37. 37. Twenty Ten: the last theme you'll ever need?<br />Page HTML<br />Templates<br />functions.php<br />Filters<br />Actions<br />Templates<br />functions.php<br />Nom de fichier<br />Actions<br />Template Tags<br />Filters<br />WordPress<br />
    38. 38. Twenty Ten: the last theme you'll ever need?<br />
    39. 39. Twenty Ten: the last theme you'll ever need?<br />
    40. 40. Twenty Ten: the last theme you'll ever need?<br />
    41. 41. Avantages Sandbox++<br />Désavantages Sandbox<br />More dependencies<br />Learning curve<br />Twenty Ten: the last theme you'll ever need?<br />
    42. 42. Twenty Ten: the last theme you'll ever need?<br />Twenty Ten as a Parent Theme<br />Who’s your daddy?<br />
    43. 43. Thematic: isoler modifications dans Child Theme<br />Sandbox: HTML complet avec unetonne de classes et d’IDs<br />Kubrick: supporté et misà jour par la communautéWordPress<br />Twenty Ten: the last theme you'll ever need?<br />
    44. 44. Twenty Ten: the last theme you'll ever need?<br />CSS Mods<br />
    45. 45. Twenty Ten: the last theme you'll ever need?<br />
    46. 46. Twenty Ten: the last theme you'll ever need?<br />
    47. 47. Twenty Ten: the last theme you'll ever need?<br />
    48. 48. Twenty Ten: the last theme you'll ever need?<br />
    49. 49. Twenty Ten: the last theme you'll ever need?<br />
    50. 50. Twenty Ten: the last theme you'll ever need?<br />
    51. 51. Twenty Ten: the last theme you'll ever need?<br />
    52. 52. Twenty Ten: the last theme you'll ever need?<br />
    53. 53. Twenty Ten: the last theme you'll ever need?<br />
    54. 54. Twenty Ten: the last theme you'll ever need?<br />Template Mods<br />
    55. 55. Twenty Ten: the last theme you'll ever need?<br />
    56. 56. Twenty Ten: the last theme you'll ever need?<br />
    57. 57. Twenty Ten: the last theme you'll ever need?<br />
    58. 58. Twenty Ten: the last theme you'll ever need?<br />
    59. 59. Twenty Ten: the last theme you'll ever need?<br />What is good for?<br />functions.php<br />
    60. 60. Twenty Ten: the last theme you'll ever need?<br />
    61. 61. Twenty Ten: the last theme you'll ever need?<br />
    62. 62. Twenty Ten: the last theme you'll ever need?<br />
    63. 63. Twenty Ten: the last theme you'll ever need?<br />I think so too<br />Pretty good, no?<br />
    64. 64. Simple d’approche, mais puissant<br />Puissant, mais simple d’approche<br />Supporte(ra) tous les features<br />Créé et maintenu par la communauté<br />Twenty Ten: the last theme you'll ever need?<br />
    65. 65. Twenty Ten: the last theme you'll ever need?<br />End with the beginning<br />
    66. 66. Twenty Ten: the last theme you'll ever need?<br />
    67. 67. Twenty Ten: the last theme you'll ever need?<br />
    68. 68. Twenty Ten: the last theme you'll ever need?<br />Questions?<br />Thanks!<br />

    ×