Contao et le responsive

[tom-over]

Bonjour,

Le sujet a peut être été abordé dans le passé mais les modules et versions de Contao évolues vites !

Avez vous des modules ou astuce pour développer un site responsive facilement ?

J'ai repéré des modules que je n'ai pas encore testés (mais c'est en court d'installation)...

Grille/colonnes :
Rocksolid-columns : http://rocksolidthemes.com/en/contao/plugins/columns
Simple_columns : https://contao.org/de/extension-list/vi ... 09.de.html

Navigation :
Mobile menu : https://contao.org/en/extension-list/vi ... 29.en.html
MMENU - Mobile Navigation : https://contao.org/de/extension-list/vi ... 09.de.html
Mmenu - mobile menu (Alpha) : https://contao.org/en/extension-list/vi ... 00.en.html

Si vous avez une technique ou module faisant gagner du temps en développement n'hésitez pas à partager

[zepokpok]

Salut,

Je te réponds rapidement car je vois que tu n'as jamais eu de réponse !

Personnellement je n'utilise que le système de grilles de contao3 en précisant dans mes élements de contenu "grid8", "grid4", etc... ça marche plutôt pas mal je trouve, j'en fais ce que je veux en assez peu de temps et je n'installe rien de plus.
Pour la partie navigation j'utilise le menu rapide de contao mais j'ai aussi utilisé une extension qui te crée un menu latéral au clic, assez bien foutu, je ne me rappelle plus du nom mais je peux te chercher ça si tu veux !

Bonne soirée

[tom-over]

Je relance le sujet
En effet l'outil de base de Contao fonctionne plutôt bien :
- Grille sur 12 colonnes
- Présentation responsive

Par contre la grille est issue de quel outil ? pas bootstrap, pas fondation, 960 Grid ?

Car ça serait bien utile pour savoir quel class utiliser :
http://getbootstrap.com/examples/grid/

Car je trouve ça dommage de ne pas communiquer sur le sujet ! Car j'ai perdu vachement de temps avant de savoir à quoi servait ces feuilles de style disponibles dans la présentation de page !

Je viens de trouver une extension pour intégrer Bootstrap à Contao
http://denniserdmann.de/contao-bootstrap/
Je n'ai pas eu le temps de tester...

[zepokpok]

Hello !

C'est du 960 grid ou un truc maison je crois, pas du bootstrap en tout cas.
Si tu veux ajouter du bootstrap je crois qu'il existe des modules qui font ça mais encore une fois, personnellement je suis très satisfait du responsive de contao.
Bon j'en fais une bonne partie à la main dans la feuille responsive ensuite mais au moins je gère les choses très finement.

EDIT : je n'avais pas lu la fin de ton message
Je veux bien aussi des retours d'utilisation de cette extension, ça m'intéresserait pour aller encore plus loin sachant que quasiment tous mes projets sont responsive maintenant.

Merci !

[ST WebDesign]

Hello,

Juste au passage, pour le menu de navigation en responsive j'utilise souvent celui-ci : MMENU - Mobile Navigation : MMENU - Mobile Navigation : https://contao.org/de/extension-list/vi ... 09.de.html

Simple d'utilisation et efficace

@+

[zepokpok]

Testé et approuvé également de mon côté !

J'utilise aussi beaucoup le menu rapide sous forme de balise select, mais il faut reconnaitre qu'avec le bouton go pour lancer la page ce n'est pas hyper ergonomique...

[FiX']

Par contre la grille est issue de quel outil ? pas bootstrap, pas fondation, 960 Grid ?

Aux dernières nouvelles (je veux dire, la dernière fois que j'ai mis la tête dans le code), c'était une grille 100% maison... mais elle fonctionne sur le même principe que 960 grid system et autres.

En ce qui concerne Bootstrap... je ne pense pas que ça soit une bonne solution de l'intégrer à une installation Contao.

A+

[zepokpok]

Salut,

On a compris au fil de tes messages que tu étais anti-bootstrap, mais sincèrement c'est un bon framework responsive, stable et pérenne. De plus je pense que professionnellement ça pose un peu plus les choses d'utiliser des technos maintenant reconnues et sérieuses.

Si je trouve des choses moins bidouillées pour ce framework prochainement je l'adopte définitivement.

[FiX']

Comme tu l'as dis @zepokpok, je ne suis pas fan de bootstrap et compagnie. Je pense que de meilleurs solutions sont envisageables... plus optimisées et plus personnalisées.

Pourquoi ne faut-il pas utiliser Bootstrap sous Contao ? Tout simplement parce que Contao n'en a pas besoin... il dispose de tous les fichiers pour pouvoir créer rapidement des sites (en clair, il dispose de son propre framework). La seule chose, c'est qu'il lui manque des components.

Après, savoir utiliser Boostrap ou Foundation, professionnellement... en effet, c'est un plus... mais savoir créer des sites sans ces solutions restera toujours primordial !

A+

[tom-over]

C'est du maison ok mais il n'y a pas d'exemple de grille pour la mise en page ?
Comme l'exemple ci-dessous :
http://getbootstrap.com/examples/grid/

Avec des class bien identifiés pour pouvoir hiérarchiser les éléments sur smartphone ?

[FiX']

C'est du maison ok mais il n'y a pas d'exemple de grille pour la mise en page ?

A ma connaissance, il n'existe aucune documentation.

Mais, en théorie, elle fonctionne comme tout framework.

Quel est-ton soucis ?

A+

[tom-over]

Premièrement j'ai remarqué la grille de Contao et le rôle que récemment ! ! Et pour cause on y fait référence nul part sur les sites officiels !
à aucun moment on explique le fonctionnement ainsi que les class à utiliser pour faciliter la création de site responsive...
J'avais remarqué que certaine grille pouvais faire passer la 3ème colonne en première sur les smpartphones en utilisant une class spécifique.

Sur contao on n'en sait rien ! !

[FiX']

Premièrement j'ai remarqué la grille de Contao et le rôle que récemment ! ! Et pour cause on y fait référence nul part sur les sites officiels !

J'ai appris l'existence de cette grille via les fichiers "changelog". Dès qu'il y a une nouvelle version, je lis ce fichier pour en connaître les nouveautés.

J'avais remarqué que certaine grille pouvais faire passer la 3ème colonne en première sur les smpartphones en utilisant une class spécifique.

Tu parles des sélecteurs push et pull ?

Si c'est le cas, il me semble que la grid de Contao ne propose pas ces sélecteurs par défaut. Il faut les intégrer toi-même.

La grille par défaut est très simple, elle permet juste de donner une largeur aux éléments qui les utilisent (principe de base d'une grille)

A+

[zepokpok]

Hello !

En fait les colonnes responsive de contao sont en marge négative pour pouvoir se caler automatiquement sous la balise main, en dernier quoi. On a rarement besoin de passer la colonne en premier, mais dans ce cas il suffit simplement de virer ces marges négatives et aligner les blocs de colonne principale / gauche / droite avec des float left ou right très simples.
Mais c'est vrai qu'il faut mettre les mains dans le cambouis et qu'il n'y a pas de doc...

J'ai des grilles PSD avec les 12 colonnes (bien plus pratiques que les 16), si ça branche quelqu'un faites moi signe !

[Bouctoubou]

http://susy.oddbird.net
http://la-cascade.ghost.io/decouvrir-susy/