Fork me on GitHub




(1) 2 »


xbootstrap c'est quoi le principe ?
Semi pro
Inscrit: 25/08/2005 22:51
De Aix les bains
Messages: 1270
Bonjour

Je 'm’intéresse à xbootstrap puisque apparemment ce thème est super et parce que j'ai quelques utilisateurs geek qui ont souvent une tablette ou smartphone entre les mains.

Pour ma part je suis allergique aux tablettes que je considère comme l'aboutissement de l'anti-ergonomie (de base vous avez une main de prise...pour tenir la tablette) et du coup j'ai bien du mal à comprendre les principes du responsive et de ce que doit permettre bootstrap.
Je trouve pleins de tutos qui expliquent comment mettre en oeeuvre bootstrap mais je n'arrive pas à comprendre la base : a quoi ca sert ? qu'est ce que ça change par rapport à un thème classique, comme ça s’adapte à la taille des écrans (changement de contenu ? reformatage du contenu ?...), bref la base de la base qui semble évidente pour tout le monde sauf moi.

Pourriez vous en 2 mot m'expliquer le principe de bootstrap svp ? Peut être un site sous xbootstrap pour que je puisse illustrer vos dires via un smartphone et une tablette (ça tombe bien je suis chez un geek qui possède une tablette ce we...)

Merci par avance pour vos lumières

Posté le : 13/09/2015 09:16

Mieux vaut marcher dans la bonne direction que courir dans la mauvaise.
----------------------------------------
www.68hc08.net la communauté francophone.
www.avironroannelecoteau.net (créé mais plus exploité)
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 16/03/2009 16:40
De Tende (06)
Messages: 3131
Créé à l'origine par Mark Otto et Jacob Thornton, les développeurs de Twitter (oui, oui, le fameux Twitter ! #cestfoucommenouvelle), Bootstrap est ce qu'on appelle un framework : une véritable boîte à outil qui vous met à disposition toute une série de fonctionnalités très pratiques pour coder des sites web entièrement responsive.


Que faut-il retenir de Bootstrap ?

- Il existe d'autres frameworks, mais Bootstrap est le plus populaire et le plus utilisé aujourd'hui. Par conséquent, il y a une communauté très active autour de Bootstrap, ce qui lui garantie des évolutions rapides et constantes.

- Le succès de Bootstrap vient aussi du fait qu'il est très bien documenté. C'est très pratique si vous désirez le prendre en main tout seul (ou approfondir toujours plus vos connaissances dessus).

- Il fonctionne sur l'ensemble des navigateurs récents et il est parfaitement adapté pour la création de sites responsive !

- Au niveau des langages de programmation Bootstrap utilise HTML5 et CSS3, et vous pouvez l'enrichir avec des extensions JavaScript et des plugins JQuery.

- De base, il fonctionne avec une grille 12 colonnes.

- Et j'oubliais un élément important... Il est totalement gratuit !

Source (là bas tu auras des tutoriels sur bootstrap aussi).

Thème xBootstrap en action sur le site de son auteur Angelo Rocha :

http://themes.angelorocha.com.br/

Posté le : 13/09/2015 11:00

Open in new window

Xoopseuse Mai 2012 | Responsable équipe internationale | Recherche avancée en bas de page !
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 04/03/2011 09:10
De Lot
Messages: 2610
et pour savoir comment fonctionne la grille bootstrap, c'est surtout ça à connaître, tu peux regarder ici

Posté le : 13/09/2015 11:03
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 16/03/2009 16:40
De Tende (06)
Messages: 3131
Les grilles toujours sur le même site qui contient des tutoriels, cité plus haut.

Posté le : 13/09/2015 11:07

Open in new window

Xoopseuse Mai 2012 | Responsable équipe internationale | Recherche avancée en bas de page !
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 05/03/2005 05:20
De Vaucluse
Messages: 959
Encore plus complet ici (en anglais)

Posté le : 13/09/2015 11:12

Open in new window

Xoops 2.5.7.2 - Debian 8.2 - Apache 2.4.10 - MySQL 5.5.47 - Php 5.6.17
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Semi pro
Inscrit: 25/08/2005 22:51
De Aix les bains
Messages: 1270
merci beaucoup, j'ai cru vos réponses trop dans le détail de la mise en oeuvre (les liens) mais vos commentaires associés étaient la réponse que j'attendais ! je commence à comprendre un peu

La grille n'est pas à définir pour toutes les tailles mais si on défini son thème (sa grille) avec des attributs "md" alors on aura le même affichage sur md et lg mais un empilage des contenus pour les tailles inférieures, je me trompe ?

questions subsidiaires :
-Sur frxoops, sur tablette et smartforme, on arrive sur une sorte de sommaire "mobile", c'est du bootstrap ou une autre manière de gérer le responsive avec 2 versions différentes du site ?
-Sur le site exemple de xboostrap on a le slide show de tête qui prend la largeur de l'écran quel que soit le support, avec des images qui se déforment du coup. Si on a un logo ou quelques chose qui ne peut pas se déformer à afficher, comment doit on le gérer ? Une manière de coder différent en fonction de la taille pour que ça n'affiche pas la même chose suivant la taille ? ou juste du CSS qui oblige la conservation des proportions ?

Merci

PS : pour info le site a refusé que je poste ma réponse (temps de session dépassé), j'ai retenté plusieurs fois de reposer sans succès. Il a fallu que je me déconnecte du site, que je me reconnecte avec login et mot de passe pour que enfin il accepte de valider mon message)

Posté le : 13/09/2015 12:49

Mieux vaut marcher dans la bonne direction que courir dans la mauvaise.
----------------------------------------
www.68hc08.net la communauté francophone.
www.avironroannelecoteau.net (créé mais plus exploité)
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 04/03/2011 09:10
De Lot
Messages: 2610
Citation :

-Sur frxoops, sur tablette et smartforme, on arrive sur une sorte de sommaire "mobile", c'est du bootstrap ou une autre manière de gérer le responsive avec 2 versions différentes du site ?


C'est deux thèmes différents, l'aiguillage se fait via un script de détection PHP basé sur le user-agent et la machine.
Le plus pratique reste tout de même le 'responsive', qui n'est pas forcément bootstrap.


Citation :

-Sur le site exemple de xboostrap on a le slide show de tête qui prend la largeur de l'écran quel que soit le support, avec des images qui se déforment du coup. Si on a un logo ou quelques chose qui ne peut pas se déformer à afficher, comment doit on le gérer ? Une manière de coder différent en fonction de la taille pour que ça n'affiche pas la même chose suivant la taille ? ou juste du CSS qui oblige la conservation des proportions ?

C'est parce que le thème n'est pas assez poussé dans son utilisation, on, peut si on enregistre différentes tailles de l'image, avoir un slider avec des images non écrasées. Certains slider, le gère même directement (ce n'est pas le cas ici).

Citation :

PS : pour info le site a refusé que je poste ma réponse (temps de session dépassé), j'ai retenté plusieurs fois de reposer sans succès. Il a fallu que je me déconnecte du site, que je me reconnecte avec login et mot de passe pour que enfin il accepte de valider mon message)

C'est parce que tu as changé d'IP entre ta connexion et ta tentative de publication, pour Protector, cela peut-être une tentative d'usurpation, donc il rejette, et le serveur fait de même au bout d'un certain temps et d'un certain nombre de tentatives.

Posté le : 13/09/2015 13:02
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Semi pro
Inscrit: 25/08/2005 22:51
De Aix les bains
Messages: 1270
Merci

Yapluska. Ce responsive va m'obliger a faire des thèmes plus simples que ce que je faisais jusque là, ce sera sans doute mieux.


EDIT Cesagonchu : sujet mis en "info".

Posté le : 13/09/2015 17:29

Edité par Cesagonchu sur 17/09/2015 05:24:20

Mieux vaut marcher dans la bonne direction que courir dans la mauvaise.
----------------------------------------
www.68hc08.net la communauté francophone.
www.avironroannelecoteau.net (créé mais plus exploité)
Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Régulier
Inscrit: 20/03/2010 18:26
De toulon
Messages: 155
bonjour à vous je vous ecris car je bloque sur la création de liens dans le theme/xboostrap/slider de ma page d accueille

<div class="item"><img alt="XOOPS" src="<{$xoops_imageurl}>images/travaux-terrassier.jpg">

            <
div class="carousel-caption hidden-xs">
                <
h1>Travaux de terrassement</h1>

                <
p>Tout savoir sur vos travaux de terrassement maisonsagrandissements et autres.
                
ServicesCréation de piscinesCréation Murs soutènementenrochementGros Oeuvre</p>


TEXTE MODIFIER
<p>[b]<a href="http://www.service-construction.fr/modules/publisher/item.php?itemid=2[/b]" class="btn btn-large btn-primary"><{$smarty.const.THEME_READMORE}></p></a>
            </
div>
        </
div><div class="item"><img alt="XOOPS" src="<{$xoops_imageurl}>images/travaux-maçon.jpg">

            <
div class="carousel-caption hidden-xs">
                <
h1>Travaux de Maçonnerie‎</h1>

                <
p>Les travaux de maçonnerie intérieure et maçonnerie extérieure font appel à des connaissances techniques et pratique non négligeables pour la bonne réalisation du projet de construction gros oeuvre</p>


TEXTE D ORIGINE
<p>[b]<a href="javascript:;" class="btn btn-large btn-primary"><{$smarty.const.THEME_READMORE}></a></p>[/b]
            </
div>
        </
div>

LE LIEN NE MARCHE PAS VIA MON SITE

Merci pour vos conseils

Posté le : 31/03/2018 09:59

Partager son savoir, c'est ce rendre utile.

Partager Twitter Partagez cette article sur GG+
Re: xbootstrap c'est quoi le principe ?
Admin Frxoops
Inscrit: 04/02/2003 06:41
Messages: 783
Bonjour,

Je viens de tester vite faite avec l'inspecteur d'élément et cela fonctionne pour moi avec ce code sur ton site :
<p><a href="http://www.service-construction.fr/modules/publisher/item.php?itemid=2" class="btn btn-large btn-primary">Lire la suite</a></p>


En fait il semble que tu mélange bbcode et html, les balises "b", d'ailleurs elle est mal placée dans le lien

Tu dois déclarer en class ton gras tout simplement et non pas en bbcode.

Posté le : 31/03/2018 10:38

Quand tu montres la lune du doigt, l'imbécile regarde le doigt.
Infos sur TSO et tutos PC sur Tutoriaux PC
Partager Twitter Partagez cette article sur GG+

 Haut   Précédent   Suivant
(1) 2 »




Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

27 Personne(s) en ligne (20 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 27 | Plus ...