web-dev-qa-db-fra.com

Comment modifier la largeur de la taille du conteneur du modèle Protostar par défaut fourni avec Joomla 3.3.6

La largeur par défaut (conteneur) du modèle protostar est définie sur 960 px, dans la présentation statique statique par défaut. J'ai besoin que le modèle protostar reste dans la présentation statique réactive, mais avec une largeur de 1150 pixels, dans la présentation statique réactive.

Comment changer la largeur fixe (conteneur) (960 px à 1150 px) dans la présentation statique réactive du modèle protostar par défaut?

Je comprends, il se peut que je doive créer un nouveau fichier css et éventuellement l’ajouter à un autre fichier.

Si vous pouviez me dire toutes les étapes nécessaires pour changer la largeur fixe de 960px à 1150px, en restant dans la disposition statique réactive du modèle protostar par défaut, ce serait vraiment très apprécié!

Merci beaucoup

joomla-3.xtemplateslayout
1
Tim

Vous devriez changer le templates/protostar/css/template.css:

.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 940px;
}
.span12 {
width: 940px;
}
.offset12 {
margin-left: 980px;
}
.container {
max-width: 960px;
}

Mais il est possible que ces modifications soient écrasées lors de la prochaine mise à jour. Je vous conseille de copier le modèle Protostar et d’apporter les modifications nécessaires.

Edit: Depuis Joomla 3.5.0, vous pouvez créer un fichier CSS personnalisé dans /templates/protostar/css/user.css qui sera chargé automatiquement et ne sera pas écrasé par les futures mises à jour du modèle.

1
Dmitry Rekun

La largeur est définie dans le fichier templates/protostar/css/template.css, comme l'a souligné Dmitry, mais comme le modèle Protostar fait partie du noyau de Joomla, il est possible que les modifications aient disparu lorsque vous mettez à jour Joomla.

Commencez par créer une copie du modèle (si vous ne l’avez pas déjà fait). Les instructions peuvent être trouvé ici . Utilisez n'importe quel nom, mais évitez les espaces et les caractères spéciaux.

Personnellement je trouve le Protostar template.css file file un peu en désordre (près de 7500 lignes de code). Je pense qu'il est préférable de créer un nouveau fichier pour vos substitutions CSS. Appelez ça comme vous voulez (j'utilise custom.css) et placez-le dans le templates/YOURTEMPLATENAME/css/.

Maintenant, éditez le fichier templates/YOURTEMPLATENAME/index.php. Juste avant la fermeture </head> tag (environ ligne 121), ajoutez le code suivant:

<?php
  $doc->addStyleSheet(JUri::base() . 'templates/' . $this->template . '/css/custom.css', $type = 'text/css', $media = 'screen,projection');
?>

Cela devrait charger votre fichier CSS après tout. Ajoutez toutes les modifications à ce fichier.

.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1130px;
}
.span12 {
width: 1130px;
}
.offset12 {
margin-left: 1170px;
}
.container {
max-width: 1150px;
}

Edit: Depuis Joomla 3.5.0, vous pouvez créer un fichier CSS personnalisé dans /templates/protostar/css/user.css qui sera chargé automatiquement et ne sera pas écrasé par les futures mises à jour du modèle.

1
johanpw