[RÉGLÉ] affichage image et titre de menu, aligement

[Bege]

Bonjour à tous,

j'ai un petit souci avec les titres de certains menus, comment faire pour qu'il s'alignent en dessous (ou dessus) de l'image?
voir par ici :

http://www.blooo.fr/accueil/

dans les colonnes de gauche et de droite le titre commence à côté de l'image
j'ai beau chercher dans les paramètres des menus ou des modules mais je ne trouve pas,

merci de vos conseils

[Bege]

Re : affichage image et titre de menu, aligement

personne n'aurait un début de piste pour moi?

[Bege]

Re : affichage image et titre de menu, aligement

voilà une copie d'écran pour bien voir le problème, ce serait vraiment super si quelqu'un pouvait me tirer de ce mauvais pas voilà le lien : http://www.blooo.fr/accueil/
merci infiniment

[jisse03]

Re : affichage image et titre de menu, aligement

Surcharger le module pour y ajouter un <br /> entre l'image et le texte, par exemple.

Ou réduire la taille des vignettes utilisées.

[Bege]

Re : affichage image et titre de menu, aligement

merci pour ta réponse,
alors Surcharger le module pour y ajouter un <br /> je veux bien essayer, mais je fais ça ou?

et si ça ne va pas je réduirais les vignettes, mais ça m'embête un peu car je les trouve déjà limite en taille.

[jisse03]

Re : affichage image et titre de menu, aligement

C'est modules/mod_weblinks/tmpl/default.php qu'il faut surcharger de la manière classique en le copiant en templates/ton_template/mod_weblinks/default.php et modifier cette version locale.

[Bege]

Re : affichage image et titre de menu, aligement

mais dans le répertoire de mon template qui est beez3 je n'ai pas de répertoire /mod_weblinks/
alors je dois le créer?

et après, je veux dire que une fois que j'ai copié default.php dans ce répertoire je le mets ou le <br />?
voilà le code du fichier :

<?php
/**
 * @package     Joomla.Site
 * @subpackage  mod_weblinks
 *
 * @copyright   Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */

defined('_JEXEC') or die;
?>
<ul class="weblinks<?php echo $moduleclass_sfx; ?>">
<?php foreach ($list as $item) :    ?>
<li>
    <?php
    $link = $item->link;
    switch ($params->get('target', 3))
    {
        case 1:
            // open in a new window
            echo '<a href="'. $link .'" target="_blank" rel="'.$params->get('follow', 'nofollow').'">'.
            htmlspecialchars($item->title, ENT_COMPAT, 'UTF-8') .'</a>';
            break;

        case 2:
            // open in a popup window
            echo "<a href=\"#\" onclick=\"window.open('". $link ."', '', 'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=780,height=550'); return false\">".
                htmlspecialchars($item->title, ENT_COMPAT, 'UTF-8') .'</a>';
            break;

        default:
            // open in parent window
            echo '<a href="'. $link .'" rel="'.$params->get('follow', 'nofollow').'">'.
                htmlspecialchars($item->title, ENT_COMPAT, 'UTF-8') .'</a>';
            break;
    }
    ?>
    <?php if ($params->get('description', 0)) : ?>
        <?php echo nl2br($item->description); ?>
    <?php endif; ?>

    <?php if ($params->get('hits', 0)) : ?>
        <?php echo '(' . $item->hits . ' ' . JText::_('MOD_WEBLINKS_HITS') . ')'; ?>
    <?php endif; ?>
</li>
<?php endforeach; ?>
</ul>

[Bege]

Re : affichage image et titre de menu, aligement

et donc, je fais comment?

[Bege]

Re : affichage image et titre de menu, aligement

plus d'aide?

[ghazal]

Re : affichage image et titre de menu, aligement

Salut,
si j'en crois ce que je vois sur le site que tu indiques, il serait plus simple de faire l'impasse d'une surcharge et de modifier l'affichage via une règle css :

.nav .image-title {
display: block;
}

Autre chose, il faudrait alors virer les petits carrés à gauche, pour cela, il va falloir retourner dans le module menu concerné (ceux des chats ou des machines) et entrer une ID de menu dans les "paramètres avancés", exemple : truc.
Puis cette cette règle CSS :

ul#truc li a:link, ul#truc li a:visited {background-image:none}

PS : le chemin des surcharges est plutôt :
templates/mon-template/html/mod_lemoduleconcerné/default.php
Le dossier "html" étant à créer s'il n'existe pas.

[Bege]

Re : affichage image et titre de menu, aligement

très bien, merci à toi je vais tester,
ou alors peut être faire comme j'ai fais à droite? voir le sujet ici :

http://forum.joomla.fr/showthread.php?182007-comment-changer-la-couleur-de-fond-d-un-module&p=921649#post921649

qu'en penses-tu?

[ghazal]

Re : affichage image et titre de menu, aligement

Lol. On a chacun nos petits trucs. Les 2 solutions sont correctes.
Mais la question posée dans ce post-ci concernait le passage à la ligne du texte sous l'image.

[Bege]

Re : affichage image et titre de menu, aligement

oui tu as raison, je me mélange un peu les pédales, mais donc j'avais réussi à le faire pour la colonne de droite en mettant ceci :

#right ul li a span {
width: 100%;
float: left;
}

pour la colonne de gauche j'ai bien essayé de mettre "left" mais ça ne donne rien
c'est pour ça que j'avais ouvert ce sujet ici pour la colonne de gauche

[Bege]

Re : affichage image et titre de menu, aligement

et pour réduire l'espace entre le titre du lien et le bas comme je l'indique ici sur cette copie d'écran :


je peux faire comment?

j'ai un peu cherché sous Firefox avec "examiner l'élément" mais je ne trouve pas, alors est ce qu'on peu la aussi créer une règle css.


merci

[ghazal]

Re : affichage image et titre de menu, aligement

j'ai un peu cherché sous Firefox avec "examiner l'élément" mais je ne trouve pas

Comme tu me donnes l'impression de débuter (mais il faut bien commencer un jour), ca ne m'étonne pas trop que tu t'emmeles les pinceaux avec Firefox et "Inspecter l"élément".
En fait, sur Firefox (depuis versions 10/11), tu as le choix entre deux possibilités de debuggage CSS (et JavaScript)
1 - une native (cad propre à FF) à laquelle tu accèdes par "Inspecter l"élément"(clic droit) ou le Menu Outils
2 - Firebug (getfirebug.com), une extension de FF, antérieure à la native, et qu'il faut installer
Perso, question d'habitude, j'utilise plutôt la 2e solution, et ensuite la premiere, si je ne trouve pas ce que je veux.

Maintenant, re ta question, si tu donnes le même suffixe de class .fondbleuclair aux 2 menus, la même règle s'appliquera aux deux menus.
Il suffit que tu donnes un autre nom au suffixe de class à ce module de gauche, ex, fondbleuclair2, avec une règle CSS de ce type:
.fondbleuclair, .fondbleuclair2 {
background-color: #DDFFF4;
}
et ca devrait aller.