Ma reconversion pro

Du bâtiment au développement web

Catégorie : Bootstrap

La pagination avec Bootstrap

Salut, La pagination avec Bootstrap

Dernier article de la longue série sur le framework de Twitter. Aujourd’hui on va voir comment mettre en place la pagination avec Bootstrap. Cette fonction va permettre à tes utilisateurs de pouvoir changer de page et de poursuivre leur navigation dans une même thématique. Tu peux retrouver un exemple de pagination dans ce blog dans l’onglet ARTICLE en bas de page. Il faudrait d’ailleurs que je prenne le temps de rechercher dans les fichiers PHP comment remplacer les textes en anglais pour les mettre en français.

Si tu me lis depuis quelques articles, je procèderais de la même façon, tous les exemples de code seront visibles depuis cet article ou depuis un projet Codepen.

Pour mettre ta pagination en place, on va encore et toujours ajouter des classes CSS, et Bootstrap s’occupe du reste!

Continue reading

 

Faire une navbar avec Bootstrap

La navigation avec Bootstrap – Partie 2Faire une navbar avec Bootstrap

Suite du tour des possibilités qu’offre le framework qui nous intéresse depuis plusieurs articles, cette fois nous allons voir comment faire une navbar avec Bootstrap.

Une navbar est un des éléments les plus importants d’une page web. C’est une des raisons qui font que tes utilisateurs visitent ton site ou le quittent. Les titres d’onglets leurs couleurs, leurs animations, son aspect général, etc doivent être choisis avec précision et susciter l’intérêt. Mais autre aspect important, la navbar doit aussi être accessible sur mobile.

Bootstrap est un framework pensé mobile first, donc le code qui suivra tiendra compte de l’aspect responsive que devra avoir une navbar. Pour cela Bootstrap a pensé à tout! Comme pour l’article précédent sur la navigation, certaines de ces fonctions auront besoin de jQuery et de Javascript pour fonctionner. N’étant pas encore formé à ces deux langages, je ne parlerai pas de ça pour le moment.

Continue reading

 

La navigation avec Bootstrap

La navigation avec Bootstrap – Partie 1

Salut, la navigation avec bootstrap

Dernier sujet sur Bootstrap, à propos de la façon de construire la navigation de ton site. Comme d’habitude, il faudra ajouter des classes particulières, et pour que certaines techniques fonctionnent il faudra ajouter du code jQrery et/ou JavaScript, choses que je ne connais pas encore. Je reviendrai donc sur l’animation de ces navigations plus tard lorsque j’aurai maîtrisé ces deux choses là.

Bootstrap propose donc plusieurs façons d’organiser et de réaliser la navigation de ta page. Chacune de ces solutions est différentes visuellement, donc à toi de savoir laquelle utiliser.

Au risque de faire un article très long, je le découpe en au moins 3 parties, peut-être même 4…

Continue reading

 

Les boutons de Bootstrap

Salut, les boutons de bootstrap logo

Nouvel article aujourd’hui concernant une autre option qui s’offre à nous, les boutons de Bootstrap. En effet comme pour toutes les autres possibilités qu’offre ce framework, il suffira d’ajouter des classes spécifiques pour réaliser la mise en formes des boutons.

Cet article va être assez court aujourd’hui, pour trois raisons:

  • celui de mardi était vraiment long,
  • c’est assez simple de faire des boutons dans Bootstrap,
  • J’ai pas trop de temps, je vais à Roland Garros demain! Ok rien à voir mais j’y suis jamais allé, alors oui je me la pête un peu avec ça…

Bref, allons y pour le dernier article de la semaine…

Continue reading

 

Utiliser la grille Bootstrap

Salut, utiliser la grille bootstrap

Après être resté un peu sur notre faim la semaine dernière, je vais donc te montrer comment utiliser la grille Bootstrap. Nous allons nous servir des dernières classes CSS vues, celles qui ressemble à cela: col-md-5. Si tu ne te rappelles pas comment cette balise est constituée et ce que ça signifie, tu peux jeter un oeil à mon dernier article: Le système de Grille avec Bootstrap.

Continue reading

 

Le Sytème de Grille avec Bootstrap

Bonjour,le système de grille avec Bootstrap

On continue la série consacrée à Bootstrap avec cet article sur ce qui est pour moi l’élément fondateur du frawework:  le système de grille. Ce système permet assez facilement de construire des pages responsives, puisqu’il est pensé Mobile First. Il est assez simple de faire des pages qui s’adaptent à tout types d’écrans, de ton PC 30″ à ton smartphone. Assez simple, mais il faut quand même un peu de temps pour bien comprendre comment ça marche, et j’avoue qu’au départ il y a 2-3 trucs un peu perturbant…

Continue reading

 

Installer Bootstrap

Salut, installer-bootstrap

Cela fait quelques jours que je me suis vraiment mis à Bootstrap, qui est à la base un framework développé par Twitter. J’avais commencé par suivre les exercices sur freecodecamp, qui constituent un très bon début mais j’avais besoin d’aller plus loin. J’ai donc récupérer un livre très complet que tu trouveras dans la bibliothèque: « Bootstrap 3, le Framework 100% web design », de Benoît Philibert.

Bootstrap est un framework très pratique et vaste qui permet de faire de la mise en forme directement en indiquant des classes CSS aux balises HTML. Je n’ai pas encore tout appris donc je ferais plusieurs articles sur Bootstrap, il y a beaucoup de choses à dire et ça m’évitera de faire des articles trop long. La première chose à faire est d’installer Bootstrap!

Continue reading

 

© 2019 Ma reconversion pro

Theme by Anders NorenUp ↑