Affichage condensé articles [Réglé]
Centrer l'ensemble des condensés verticalementl
Créations de Thèmes
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Voici mon problème :
La longueur du titre conditionne le positionnement du condensé de l'article donc on a un décalage verticale dans les vignettes.
Je souhaiterai harmoniser cet affichage.
Si quelqu'un a une petite idée, merci d'avance.
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 24/03/2016 à 13h48
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Si, oui, comment faut-il procéder? modifications css ou tpl?
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 24/03/2016 à 13h50
janus57 Membre non connecté
-
Booster Fusée
- Voir le profil du membre janus57
- Inscrit le : 07/12/2007
- Groupes :
-
Equipe Assistance
Perso j'aurais modifier le css pour avoir une taille minimale fixe.
Note : il est mieux d'editer que de faire du double post.
Cordialement, janus57
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
oui dsl pour le double post.
Du coup, quel fichier css doit être modifié? Je ne sais pas quel est celui qui correspond à l'affichage des condensés (article_mini.css peut etre?).
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 24/03/2016 à 14h21
janus57 Membre non connecté
-
Booster Fusée
- Voir le profil du membre janus57
- Inscrit le : 07/12/2007
- Groupes :
-
Equipe Assistance
Perso j'aurais inspecter l'element avec le cache css desactive.
Cordialement, janus57
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Code CSS :
#module-articles .small-block { min-height: 420px; }
Il faudrait que je diminue cette valeur?
Et la modif se ferait alors dans le fichier articles.css
Bon j'ai fait un test :
Code CSS :
#module-articles .small-block { height: 380px; }
la taille des cadres entourant les condensés est maintenant fixe mais le pb est identique à l'intérieur des cadres : il faudrait arriver à centrer verticalement les images...
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 24/03/2016 à 15h22
ElenWii Membre non connecté
-
Administrateur
- Voir le profil du membre ElenWii
- Inscrit le : 14/08/2009
- Site internet
- Groupes :
-
Equipe Graphique
Dans ton cas, je pense que c'est le
headerde l'article qu'il faut ciblé pour limiter la taille du titre.
Tu fixe la
headeravec un
height:100px;et tu cache le surplus avec un
overflow:hidden;.
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Peut etre est-ce ça :
Code CSS :
#module-articles hr { margin-top: 10px; }
Parce que j'ai essayé avec vos valeurs précédentes mais ça ne fonctionne pas, donc je dois me tromper lol
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 24/03/2016 à 16h28
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
ElenWii Membre non connecté
-
Administrateur
- Voir le profil du membre ElenWii
- Inscrit le : 14/08/2009
- Site internet
- Groupes :
-
Equipe Graphique
Il te faut ajouter dans le fichier article.css un code similaire à :
Code CSS :
#module-articles .article-articles header a { height: 30px; overflow: hidden; }
De cette façon, le titre ne fera pas plus de 30px de haut et tout sera aligné. Bien sûr ajuste le 30px à la valeur que tu souhaite.
Il te faudra certainement utiliser différente valeur en fonction de la plateforme que tu veux prendre en charge (desktop, tablette, mobile)
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Et j'ai était un peu pressant ....dsl
Merci pour votre aide précieuse (tous les admin bien sur et les fans de phpboost).
Je vais essayer la modif css et je reviendrai confirmer que ça fonctionne
.Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
En passant par le css, les modifs n'aboutissent pas.
Donc j'ai modifié le template : ArticlesDisplaySeveralArticlesController.tpl et le résultat est probant :
et en admin jai gardé le bouton edit et delete :
Cependant il reste toujours le HR qui est génant et je ne sais pas comment l'enlever....
Merci de votre aide!
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
ElenWii Membre non connecté
-
Administrateur
- Voir le profil du membre ElenWii
- Inscrit le : 14/08/2009
- Site internet
- Groupes :
-
Equipe Graphique
xela Membre non connecté
-
Modérateur
- Voir le profil du membre xela
- Inscrit le : 26/12/2015
- Groupes :
-
Equipe Rédaction
Merci c'est ok !!!
Pour ceux qui veulent le faire :
1. On modifie le ArticlesDisplaySeveralArticlesController.tpl en enlevant :
- le titre du condensé
Code TPL :
- la date de création, heure, catégorie éventuelle etc
Code TPL :
<div class="more"> # IF articles.C_AUTHOR_DISPLAYED # ${LangLoader::get_message('by', 'common')} # IF articles.C_AUTHOR_EXIST #<a itemprop="author" href="{articles.U_AUTHOR}" class="{articles.USER_LEVEL_CLASS}" # IF C_USER_GROUP_COLOR # style="color:{articles.USER_GROUP_COLOR}"# ENDIF #>{articles.PSEUDO}</a># ELSE #{articles.PSEUDO}# ENDIF #, ${TextHelper::lowercase_first(LangLoader::get_message('the', 'common'))} # ELSE # ${LangLoader::get_message('the', 'common')} # ENDIF # <time datetime="# IF NOT articles.C_DIFFERED #{articles.DATE_ISO8601}# ELSE #{articles.PUBLISHING_START_DATE_ISO8601}# ENDIF #" itemprop="datePublished"># IF NOT articles.C_DIFFERED #{articles.DATE}# ELSE #{articles.PUBLISHING_START_DATE}# ENDIF #</time> ${TextHelper::lowercase_first(LangLoader::get_message('in', 'common'))} <a itemprop="about" href="{articles.U_CATEGORY}">{articles.CATEGORY_NAME}</a> </div>
2. On modifie le articles.css
- On fixe la taille du cadre des condensés en remplaçant :
Code CSS :
#module-articles .small-block { min-height: 420px; }
par
Code CSS :
#module-articles .small-block { height: 380px; }
Mettez évidemment la valeur que vous voulez
- On enlève le <h2> (ligne de séparation)
Code CSS :
#module-articles .article-articles header h2 { border: none; }
Résultat :
Avant :
Après:
Merci à ElenWii et janus57 pour leur aide !
Cordialement,
Xela
PHPBOOST 5.0.2
THEME : Underline 3.0.2
Édité par xela Le 26/03/2016 à 08h48
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie