PluXml.org

Blog ou CMS à l'Xml

Vous n'êtes pas identifié(e).

#1 18/01/2016 19:12:43

Lewo
Membre
Inscription : 16/01/2010
Messages : 109
Site Web

[RÉSOLU] Mon thème n'est pas très responsive !

Bonjour à tous,

Voilà un sacré bout de temps que je n'ai plus posté ici... n'empêche que je suis un fidèle de Pluxml. J'ai cherché mieux ailleurs : en vain !
Dernièrement, je me suis bricolé un petit thème perso. Un truc sobre. Pour un blog de voyage. Pour les copains qui sont restés là-bas. Bon, j'ai pu bidouiller un truc qui collait pile poil avec l'idée que j'avais dans le dedans de ma tête. Sauf que...

...sauf que, ça grogne un peu, on me le reproche, visiblement (je ne puis pas vérifier) le bouzin n'est pas super responsive-machin-truc. Qu'il ne s'adapte pas ou peu aux affichages sur téléphones par exemple. Que ça gronde dans mon dos. Que moi je bidouille, je démonte, je remonte comme je puis avec ce que je sas faire, mais que j'y connais rien au CSS web-design-hyper-responsive-W3C-cent-pour-cent-valide. Que si, et je suis certain que oui, il y a une bonne âme ou deux pour me filer un coup de main, je prend !

Faute d'une super connexion actuellement, je puis seulement vous donner l'adresse du blog déjà en fonction, histoire de jeter un œil : http://miaouw.info
Dès que possible, si quelqu'un se propose de m'aider, je balance un paquet complet avec mon fameux thème...

Bien à vous.

Dernière modification par Lewo (21/01/2016 21:17:39)

Hors ligne

#2 18/01/2016 19:54:13

danielsan
Membre
Lieu : Montpellier
Inscription : 18/07/2011
Messages : 1 274

Re : [RÉSOLU] Mon thème n'est pas très responsive !

hello
effectivement ... pour vérifier ce qu'il se passe tu peux déjà réduire la largeur de ton navigateur ...
L'équipe de PluXml a développé une superbe feuille de style CSS responsive : PluCSS
simple et très compréhensible wink
bon courage, ton thème est relativement simple, ça sera facilement adaptable


Que l'inspiration soit avec vous, à jamais !

Hors ligne

#3 18/01/2016 20:38:53

kowalsky
Membre
Inscription : 20/08/2015
Messages : 267
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

Salut Lewo,

Une modification rapide pour rendre ton site un peu plus responsive :

remplace à la ligne 168 de minou.css

.content {
    clear: both;
    margin: 0 auto;
    padding-top: 10px;
    width: 800px;
}

par

.content {
    clear: both;
    margin: 0 auto;
    max-width: 800px;
    padding-top: 10px;
    width: 90%;
}

(la valeur de "width" à 90% permet d'ajouter une petite marge latérale facilitant la lecture pour éviter que le texte ne soit collé de chaque coté)

Hors ligne

#4 19/01/2016 00:00:08

Lewo
Membre
Inscription : 16/01/2010
Messages : 109
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

danielsan > Grrr ! J'ai découvert ça un peu tard, et pour bien tout comprendre, j'ai beaucoup à réapprendre. Mais je garde sous le coude. Merci.

kowalsky > Ah ! Merci bien, que c'est déjà mieux. Peut-être même suffisant ? Je pensai, je ne sais pas pourquoi, que l'attribut "max-width" était déprécié. En tous cas, avec mon navigateur, petit ou grand, ça semble bien.

Merci à vous. Je ne met pas (encore) ce sujet en résolu, si jamais il y à d'autres propositions...

Hors ligne

#5 19/01/2016 10:15:37

kowalsky
Membre
Inscription : 20/08/2015
Messages : 267
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

Ça s'affiche déjà mieux sans la largeur fixe de la colonne principale smile

Par contre bien qu'utilisant des valeurs relatives dans ton CSS (em et %), le texte s'affiche avec des petits caractères sur mobile. Cela devrait s'améliorer en ajoutant la ligne suivante après <head> dans le fichier header.php de ton thème :

[== Indéfini ==]
<head>
	<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0">

Max-width et min-width sont utilisés très souvent dans les média queries en CSS pour permettre d'ajuster l'affichage en fonction de la résolution d'écran. Tu trouveras une petite explication en image sur le tuto du Hollandais Volant

(tu voudras sans doute appliquer les mêmes corrections pour ton site http://miaouw.eu.org/)

Hors ligne

#6 19/01/2016 14:21:45

Lewo
Membre
Inscription : 16/01/2010
Messages : 109
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

Ah ! Intéressant ce truc. J'ai potassé. Un peu. J'ai mis en place...
Merci pour le coup de pouce (et la doc). C'est dur, quand on est que bidouilleur du dimanche, de se tenir au goût du jour. La technologie web roule très vite, en avion de chasse, moi je trottine derrière en mobylette. Heureusement qu'il y a des bonnes âmes pour aider ! smile

(et merci d'avoir songé à mon autre site, mais je vais le fermer...)

Dernière modification par Lewo (19/01/2016 14:22:44)

Hors ligne

#7 19/01/2016 21:07:20

kowalsky
Membre
Inscription : 20/08/2015
Messages : 267
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

Bah pour quelqu'un qui trottine en mobylette, j'ai vu des templates CSS moins bien structurés et en prime sans les délicates petites attentions commentées wink

Pour preuve, en modifiant seulement 2 lignes de code ton site est devenu optimisé pour tous types d'écrans.

Allez, je te propose quand même une nouvelle correction : il y a un retour à la ligne qui foire sur les très petites résolutions (width < 330px) quand le titre des articles est un peu long.

Supprime le line-height à la ligne 49 de minou.css et cela le corrigera.

[== CSS ==]
h1 {
    margin-bottom: 0;
    padding-top: 5px;
    font-size: 2em;
}

Hors ligne

#8 21/01/2016 21:17:05

Lewo
Membre
Inscription : 16/01/2010
Messages : 109
Site Web

Re : [RÉSOLU] Mon thème n'est pas très responsive !

Et bien ! Je vais arrêter de me confondre en remerciements (même si, vraiment, merci) et mettre ce sujet en « résolu ».

Hors ligne

Pied de page des forums

A propos Nous soutenir Contact Twitter Google+
Copyright © 2006-2017 PluXml.org, tous droits réservés