forum

Créations de Thèmes » Vos Thèmes » PHPBoostrap 3.x Bootstrap 3.3.7

Modérateur

rank_modo.png

Avatar

Equipe Graphique

Inscrit le: 16/05/2008

Messages: 2261

Le 25/01/2018 à 08h02
Thème créé avec Bootstrap 3.3.7

[WARNING] Pour les "hébergés" chez free, ce thème est assez lourd (1.55Mo en version compressée), il est préférable de l'installer via ftp plutôt que par l'administration des thèmes

La génèse


Mais pourquoi est-il si lourd ?


J'avais le choix entre garder la structure de phpboost et adapter les css et js de bootstrap à pbt ou l'inverse. Dans les deux cas la manipulation est longue mais finalement possible :) .
J'ai donc opté pour l'inverse, tout simplement parce que modifier bootstrap en profondeur pour l'adapter à pbt s'apparente à tenter l'ascension du K2 à main nue, à poil, sans assistance ni oxygène. Comprenez qu'il faudrait faire la manip à chaque mise à jour de bootstrap, alors que dans ce sens, toute mise à jour de bootstrap sera rapidement adaptable au thème.

Cette option a donc nécessité d'inclure les tpl de tous les modules et comporte quelques problèmes mais je garde mon intégrité physique :

Nouveaux modules


J'ai prévu tous les modules existant pour phpboost (officiels + non-officiels), mais bien sur, tout nouveau module ne sera pas adapté puisque cela requière une architecture spécifique. J'essaierai dans la mesure du possible de le faire dès lors qu'un nouveau module sera déclaré dans la rubrique téléchargement de phpboost.com

Nombre de colonnes dans la config


Certains modules proposent une disposition des catégories et/ou des items (articles/news/etc...) en colonne avec la possibilité de définir ne nombre de colonnes dans la config. Cette option saute, ne pouvant adapter ce nombre à l'architecture de bootstrap et il est fixé à 3. Pour ceux qui connaissent Bootstrap, rien ne vous empèche de le modifier directement dans les tpl du thème.

Spécificatures


Côté javascript, 2 scripts ont été ajoutés, en plus de bootstrap.js, bootstrap-grid-columns.js qui permet de gérer une hauteur égale quand plusieurs items sont sur la même ligne, vu que je n'ai pas utilisé la flexbox de bootstrap et navbar.js qui gère les menus d'actions et le multi-level des menus et facilite la navigation "au clic".

Côté design, le but du thème n'est pas d'être complexe comme peut le permettre bootstrap, mais bien de proposer un thème qui pourra servir de base aux amoureux de bootstrap. Vous retrouverez donc l'architecture de phpboost habituelle.
L'administration est également incluse et fait appel en grande partie aux fichiers du front ce qui aidera encore aux futures mises à jour de bootstrap et de phpboost. J'ai prévu un fichier à part pour les pages spécifiques.

J'ai mis pas mal de temps pour faire ce thème, par concéquent il manque certainement des explications que je n'ai plus en tête mais qui seront fournies au gré de vos questions.

Visualisations


Téléchargement 5.1 - github

Démo
Accès admin :
adminpbt
Admin609Pbt





Edité par babsolune Le 26/01/2018 à 06h08


Site web    

Booster Missile

rank_5.png

Avatar

Inscrit le: 03/09/2009

Messages: 1029

Le 25/01/2018 à 16h12

Bonjour à tous

merci pour ce théme comment fait on pour augmenter la colonne centrale ?

 

merci à vous

 

cdlt

pat

Mail Site web    

Booster Fuzil

rank_2.png

Avatar

Inscrit le: 20/10/2016

Messages: 59

Le 25/01/2018 à 17h38
La démo ne fonctionne pas chez moi
Mail    

Booster Missile

rank_5.png

Avatar

Inscrit le: 03/09/2009

Messages: 1029

Le 25/01/2018 à 17h43

nickel moi mais je suis en local j'ai mis le theme comme dit par le serveur

mais tu as  bien en 5.1 ?





Edité par patgame Le 25/01/2018 à 17h44
Mail Site web    

Booster Fuzil

rank_2.png

Avatar

Inscrit le: 20/10/2016

Messages: 59

Le 25/01/2018 à 22h04
patgame :

nickel moi mais je suis en local j'ai mis le theme comme dit par le serveur

mais tu as  bien en 5.1 ?



Tu parle à moi ? Si oui bah j'ai pas besoin d'avoir quelque chose c'est sur son site la démo ne fonctionne plus
Mail    

Booster Fusée

rank_6.png

Avatar

Equipe Assistance

Inscrit le: 07/12/2007

Messages: 6120

Le 26/01/2018 à 05h49
Bonjour,

la démo étant sur un hébergeur gratuit il se peu qu'elle soit inaccessible de temps en temps, donc le mieux est de tester soit même en local, ou sur la démo officiel (si l'upload le permet).

Cordialement, janus57


Ma boule de cristal est en panne. merci de donner les détails de votre problème
   

Modérateur

rank_modo.png

Avatar

Equipe Graphique

Inscrit le: 16/05/2008

Messages: 2261

Le 26/01/2018 à 06h11
la démo était bien en carafe, tout est réinstallé... jusqu'à la prochaine fois :)


Site web    

Booster Missile

rank_5.png

Avatar

Inscrit le: 03/09/2009

Messages: 1029

Le 26/01/2018 à 11h23

Par contre  on s'est éloigné de ma question originale lol

comment fait on pour agrandir la colonne centrale ?

je n'ai pas vu tout a fait le même code que sur les autres thémes donc j'attends un avis autorisé

Merci

 

Bonne journée

Pat

 

une explication en image :

 

https://www.phpboost.com/upload/agrandir_central.jpg





Edité par patgame Le 27/01/2018 à 01h04
Mail Site web    

Modérateur

rank_modo.png

Avatar

Equipe Graphique

Inscrit le: 16/05/2008

Messages: 2261

Le 27/01/2018 à 06h59
plop

Dans le fichier body.tpl, remplace (ligne 47)
<div id="global" class="container">
par
<div id="global" class="container-fluid">



Site web    

Booster Missile

rank_5.png

Avatar

Inscrit le: 20/01/2014

Messages: 1140

Le 27/01/2018 à 07h34
:top


Site web    

Modérateur

rank_modo.png

Avatar

Equipe Graphique

Inscrit le: 16/05/2008

Messages: 2261

Le 27/01/2018 à 13h20
oui c'est du bootstrap "dans le texte", il est truffé de ce genre de choses, comme la largeur du conteneur ou des colonnes.
Je vous invite à lire la doc de bootstrap et vous incite à modifier le thème en privilégiant les fichiers phpboostrap3x.css et phpboostrap3x-theme.css plutôt que les fichiers bootstrap.css et bootstrap-theme.css, quitte à y créer les classes de bootstrap que l'on veut modifier afin de garder la main sur les futures mises à jour de bootstrap


Site web    

Booster Missile

rank_5.png

Avatar

Inscrit le: 03/09/2009

Messages: 1029

Le 27/01/2018 à 13h31

merci babsolune pour ton aide on est au milieu du gué lol, il faut maintenant réduire la taille des 2 colonnesdoite et gauche et augmenter d'autant la partie centrale

je te  joins une copie d'écran

https://www.phpboost.com/upload/theme_3.jpg

 

Merci pour l'aide

cordialement

Pat

 

je me réponds à moi même par contre si tu peux confirmer l'exactitude de mon code ou le corriger le cas échéant je t'en remercie

j'ai ajouté dans phpboostrap.css

à la ligne 115 et 121

width:17%;

ça fonctionne mais est-ce vraiement ça ?





Edité par patgame Le 29/01/2018 à 11h16
Mail Site web    
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie
1 Utilisateur en ligne : 0 Administrateur, 0 Modérateur, 0 Membre et 1 Visiteur
Utilisateur en ligne : Aucun membre connecté