AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le deal à ne pas rater :
LEGO Icons 10331 – Le martin-pêcheur
35 €
Voir le deal

    (ALZUFEN) Cadre en bordure pour top sites ?

    Ultraman Ginga
    Ultraman Ginga
    MasculinAge : 34Messages : 169

    Mer 17 Sep 2014 - 3:20

    Ma demande



    Bonjour à Tous !

    Je viens vous demander pour un petit cadre en bordure afin d'y mettre 3 top sites.

    Je voudrais ce cadre à gauche d'un forum, déroulant ou non (c'est à dire qu'il peut descendre en même temps que la navigation ou rester constamment en haut), ça ne me dérange pas.


    Schéma(s) et Eléments
    Schémas :
    Voici l'exemple, si vous regardez en haut à gauche de l'image qui est la bannière d'un forum sur lequel j'ai retrouvé ceci.

    https://2img.net/r/hpimg11/pics/367635kjnhkj.png

    Je rappelle que je ne cherches pas un plagiat de ce codage, je cherches surtout une petite base de ce codage que je pourrais bricoler tranquillement. Ce screen est donc un simple exemple, car je ne connais pas les termes précis pour décrire ce codage. Le but de ce codage me servira à y déposer des top sites de 35 hauteur et 100 pixel de largeur ^^

    Tailles des éléments : Assez pour y mettre 3 top sites de 35 hauteur par 100 largeur, une au dessus de l'autre.
    Version de votre forum : PHPBB2


    Ressources
    Je n'ai rien, hormis l'exemple. Sinon, si vous êtes assez gentil pour faire les couleurs du codage également, http://deepleisure.skyforum.net/ ceci est l'adresse de mon forum sur lequel je veux faire ce codage

    Autres précisions ?
    Merci d'avance !


    Dernière édition par Ultraman Ginga le Mer 24 Sep 2014 - 16:08, édité 2 fois
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 17 Sep 2014 - 5:38

    Bonsoir,

    Tout d'abord il y a un modèle à respecter pour les demandes, ce serait bien que tu édites ton message pour le mettre Wink

    Ensuite, il serait préférable d'avoir des screens plutôt qu'un lien vers un forum qui fait plus "pub" qu'autre chose, même si ce n'est pas le but recherché je suppose.

    Pour terminer, il serait judicieux de plutôt précisé plus exactement ce que tu aimerais, on ne fait pas dans le plagiat de code d'un autre forum, après un screen pour avoir "l'idée" oui mais on ne va pas recopier la même chose pour l'adapter à ce que tu désires Wink. Je rajouterais aussi que tu peux aller faire éventuellement un tour du côté des LS/Tutos ; il existe déjà des tuto pour fixer des choses aux bords du forum, il suffirait d'adapter un peu pour faire ce que tu désires, à condition de te sentir capable de le faire de toi-même Wink



    Ultraman Ginga
    Ultraman Ginga
    MasculinAge : 34Messages : 169

    Mer 17 Sep 2014 - 15:29

    Voilà, tout est modifié.
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 17 Sep 2014 - 16:21

    Pour information, ce qui se rapproche le plus de ça serait un widget Wink Certes, ce n'est pas forcément très approprié mais c'est ce qui s'en rapproche le mieux ^^

    Est-ce que quelque chose comme ça te conviendrais ? http://puu.sh/bCHhx/d68b055b81.jpg (Avec évidemment, des libres personnalisation pour la police, les couleurs, le texte et tout ^^)



    Ultraman Ginga
    Ultraman Ginga
    MasculinAge : 34Messages : 169

    Mer 17 Sep 2014 - 22:04

    Ce serait parfait !

    Comment pourrais-je installer cela ?
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Ven 19 Sep 2014 - 21:14

    Bonsoir, je ferais sans doute un tutoriel pour faire ce genre de choses (normalement, les demandes vont directement en LS mais je préfère faire un tuto) plus tard, en attendant voici le code pour ce "bloc" là :

    Ajoute ceci à ton css :
    Code:
    .widget_topsite{
    position: fixed;
    left: 20px; top: 40px;
    border: 4px solid #fd0290;
    background: #F3E7EE;
    width: 140px;
    height: 140px;
    padding: 0 10px;
    text-align: center;
    border-radius: 15px;
    }

    Puis, il te faudra ajouter ce code soit à ta page d'accueil (Donc dans généralité) soit dans le template overall-header juste après la balise "body", dans le premier cas ça ne marchera que si tu as retiré le tableau entourant la PA ^^ mais ça sera accessible à tous les admins du forum :

    Code:
    <div class="widget_topsite">¤ Top Sites ¤
    <a href="#"><img src="" height="30px" width="100px" /></a>
    <a href="#"><img src="" height="30px" width="100px" /></a>
    <a href="#"><img src="" height="30px" width="100px" /></a>
    <br />~ Votez pour nous ~</div>



    Ultraman Ginga
    Ultraman Ginga
    MasculinAge : 34Messages : 169

    Mer 24 Sep 2014 - 3:41

    Bonjour ! Merci de m'avoir offert ce codage.

    Cependant, après avoir ajouté dans la feuille CSS et l'autre codage dans overall-header, rien ne s'affiche ...

    Mais en mettant dans la PA, à l'intérieur des balises de table, ça fonctionne !
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 24 Sep 2014 - 11:53

    C'est étrange, peut-être que tu l'as mal mis, que tu as oublié de valider le template, ou qu'il est caché par autre chose :hum: Dans le doute, tu peux rajouter un z-index: 999; à la widget dans le css pour s'assurer que ce soit toujours au dessus ^^

    Pense à mettre le crochet vert pour indiquer que le topic est terminé Wink



    Contenu sponsorisé


      La date/heure actuelle est Dim 24 Nov 2024 - 11:18