{"id":381,"date":"2013-08-23T15:54:22","date_gmt":"2013-08-23T14:54:22","guid":{"rendered":"http:\/\/sphinx.lamecarlate.net\/?p=381"},"modified":"2018-09-30T18:02:16","modified_gmt":"2018-09-30T17:02:16","slug":"nouveau-theme-pour-le-sphinx","status":"publish","type":"post","link":"https:\/\/informatique.lamecarlate.net\/extras\/nouveau-theme-pour-le-sphinx","title":{"rendered":"Nouveau th\u00e8me pour le Sphinx"},"content":{"rendered":"

Cela fait longtemps que j’avais d\u00e9laiss\u00e9 le th\u00e8me de ce blog : la premi\u00e8re version \u00e9tait bancale, tant en design qu’en code, j’\u00e9tais encore trop peu exp\u00e9riment\u00e9e. Les suivantes \u00e9taient essentiellement le th\u00e8me par d\u00e9faut de WordPress, par flemme. Maintenant, on passe \u00e0 un vrai travail ! J’ai plus ou moins reni\u00e9 la v1 (je n’ai m\u00eame plus les fichiers), mais appelons celle-ci v2 tout de m\u00eame !<\/p>\n

<\/p>\n

Base<\/h2>\n

Je suis partie du th\u00e8me Inpixelitrust Responsive blank theme<\/a> (vous pouvez reprendre votre souffle), de St\u00e9phanie Walter<\/a>. C’est un th\u00e8me \u00ab\u00a0blank\u00a0\u00bb, c’est-\u00e0-dire sans v\u00e9ritable design, juste une bonne base solide pour d\u00e9velopper un th\u00e8me.<\/p>\n

Ambiance<\/h2>\n

Le processus cr\u00e9atif autour de \u00e7a… est difficile \u00e0 expliquer. En effet, je ne suis pas designeuse, ni graphiste, mon travail et mes talents sont plus le d\u00e9veloppement et l’int\u00e9gration ; mais j’arrive souvent \u00e0 un visuel qui me pla\u00eet apr\u00e8s de nombreuses it\u00e9rations. Je code, et je vois si \u00e7a me va, si oui on continue, si non, on modifie ^^’<\/p>\n

L’id\u00e9e \u00e9tait de rester sur la couleur violette. En effet, j’ai plusieurs blogs, chacun avec un sujet diff\u00e9rent, un \u00ab\u00a0animal tot\u00e9mique\u00a0\u00bb (mythologique, pour ne rien g\u00e2cher), et une couleur d’ambiance. Le Codex sphinxial est violet depuis le d\u00e9but, et il va le rester (jusqu’\u00e0 ce que je change d’avis, \u00e9videmment).<\/p>\n

En cherchant des infos sur des directives de Compass, je suis tomb\u00e9e sur cette page : https:\/\/coderwall.com\/p\/o4sbng<\/a>, et j’ai eu un coup de foudre pour le design de la page. Oui, c’est un peu bateau comme visuel, un fond flou et un objet \u00ab\u00a0flottant\u00a0\u00bb par dessus, mais… \u00e7a m’a plu et j’ai voulu m’en inspirer. Une autre source d’inspiration a \u00e9t\u00e9 le site OhMyGame<\/a> (qui d’ailleurs a bien d’autres attraits que son apparence : si des visions pertinentes, vari\u00e9es et f\u00e9ministes sur les jeux vid\u00e9o vous int\u00e9ressent, foncez !), pour l’aspect \u00ab\u00a0petites cartes\u00a0\u00bb sur la page d’accueil.<\/p>\n

Au niveau polices, une Open Sans toute simple pour le texte, et la superbe SciFly<\/a> pour la titraille – j’ai fait pas mal d’essais mais celle-ci m’a tap\u00e9 dans l’\u0153il.<\/p>\n

Responsive design<\/h2>\n

De nos jours, il est important d’avoir un design qui s’adapte proprement suivant les tailles d’\u00e9cran. J’ai essay\u00e9 ici de me baser non pas sur les p\u00e9riph\u00e9riques, mais sur des points de rupture interm\u00e9diaires, en m’inspirant de cet article : D\u00e9finir ses points de rupture<\/a>.<\/p>\n

\u00c9criture et code<\/h2>\n

Je me suis mise au markdown ! Assez semblable \u00e0 la syntaxe wiki, il permet de se concentrer sur le texte, en retenant quelques symboles et commandes pour mettre en forme : >, #, `, et des espaces. J’ai utilis\u00e9 le plugin WP-Markdown<\/a>, qui a comme particularit\u00e9 sympathique d’int\u00e9grer une coloration syntaxique !<\/p>\n

Il reste tant \u00e0 faire…<\/h2>\n

Et pourtant, rien n’est vraiment fini. Bon, ce th\u00e8me va \u00e9voluer, un peu, comme toujours, mais il y encore de petites choses de ci de l\u00e0 – des choses que je suis peut-\u00eatre seule \u00e0 voir \ud83d\ude00<\/p>\n

Mais d\u00e8s maintenant, bienvenue chez le Sphinx ! Essuyez-vous les pattes en entrant, ne dites pas de gros mots, puissiez-vous appr\u00e9cier votre s\u00e9jour.<\/p>\n","protected":false},"excerpt":{"rendered":"

Cela fait longtemps que j’avais d\u00e9laiss\u00e9 le th\u00e8me de ce blog : la premi\u00e8re version \u00e9tait bancale, tant en design qu’en code, j’\u00e9tais encore trop peu exp\u00e9riment\u00e9e. Les suivantes \u00e9taient […]<\/p>\n","protected":false},"author":1,"featured_media":476,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[37],"tags":[69,68,67],"_links":{"self":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/381"}],"collection":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/comments?post=381"}],"version-history":[{"count":2,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/381\/revisions"}],"predecessor-version":[{"id":934,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/posts\/381\/revisions\/934"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/media\/476"}],"wp:attachment":[{"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/media?parent=381"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/categories?post=381"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/informatique.lamecarlate.net\/wp-json\/wp\/v2\/tags?post=381"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}