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.


    (ONYX) Signature codée à onglets

    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 19:35

    Ma demande



    Bonjouur, cela fait longtemps que je voudrais une petite signa' codée, donc je me lance!

    Schéma(s) et Eléments
    Schémas :
    Spoiler:
    Tailles des éléments : Taille comme sur le schéma je pense.
    Version de votre forum : PHPBB2


    Ressources
    L'image du fond :
    Spoiler:

    La typo s'appelle "Bellerose" et les 2 codes couleur sont : #fe285a & #c8254b.


    Autres précisions ?
    Un grand merci ! =D


    Dernière édition par Madii-x le Ven 26 Sep 2014 - 19:29, édité 1 fois




    (ONYX) Signature codée à onglets 1E4PE
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 24 Sep 2014 - 20:32

    Bonjour,

    Pour information, je pense que pour faire un système d'onglet, si on compte en plus le codage css, l'éventuel javascript si on fait avec du JS, le HTML, et le texte/les images que tu vas insérer, je pense qu'on dépasse facilement pour ne pas dire largement les 1000 caractères, à moins de vraiment tout réduire... (Ou a moins que la limite a augmenté depuis) je pense que le mieux serait de faire via une Iframe ou de viser quelque chose de plus simple Wink

    Autre chose, pour la taille tu dis "comme sur le schéma" mais il nous faudrait au moins la largeur "approximative" que tu désires ou selon le/les forums où tu vas t'en servir, si possible la hauteur aussi mais ça y'a plus moyen de s'adapter pour faire que ça agrandisse pas trop un message et que ce soit raisonnable.


    Dernière édition par Alzufen le Mer 24 Sep 2014 - 20:53, édité 2 fois



    NyoTheNeko
    NyoTheNeko
    FémininAge : 30Messages : 5683

    Mer 24 Sep 2014 - 20:52

    (Alzufen, je pense qu'elle voulait passer par iframe de toute façon =P )



    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 24 Sep 2014 - 20:54

    Je le pense aussi, mais je préfère préciser dans le doute, ou pour en informer un petit curieux qui passe par là et qui tombe sur ça en se disant "Chouette, moi aussi je veux faire" mais qui n'a pas de forum où mettre une page HTML pour faire une Iframe :3



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 21:25

    Excusez-moi mais... c'est quoi iframe? xD (J'aimerais vraiment l'avoir comme cela si possible et ne pas faire plus simple, elle est déjà simple je trouve :p)

    Pour la taille du bloc entier c'est du : 500x220px .




    (ONYX) Signature codée à onglets 1E4PE
    Nihil Scar Winspeare
    Nihil Scar Winspeare
    Messages : 5244

    Mer 24 Sep 2014 - 21:29

    En fait tu mets le code dans une page HTML de ton forum, et ensuite tu peux l'inclure dans la signature des forums grâce à un petit bout de code : en utilisant une iframe ^^.
    Ca te permet d'éviter la limite des XXX caractères (je ne connais pas la valeur par coeur) -et en plus si tu utilises la même sur plusieurs forum, tu n'as pas besoin de la mettre à jour partout, tout se fait tout seul. :siffle:

    Par contre Madii-x, tu n'as pas précisé si le changement d'onglet se faisait au clic ou survol ~

    De toutes les façons le JS ne marche (heureusement) pas dans la signature, donc même réduit au strict minimum... :toto:
    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 21:45

    Aaah ok j'ai plus ou moins compris, enfin je laisse faire celui qui prendra ma commande, car je n'y connait rien xD Ah oui pour les onglets, je préfère au survol :)




    (ONYX) Signature codée à onglets 1E4PE
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Mer 24 Sep 2014 - 22:27

    Salut ^^

    J'ai commencé, mais ça serait possible d'avoir une police de Google Font? Disons que ce serait plus facile u_u


    Dernière édition par Onyx le Mer 24 Sep 2014 - 22:33, édité 1 fois



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 22:31

    Merci :) Je vais regarder, mais ce n'est pas possible du tout une police de dafont ? :o




    (ONYX) Signature codée à onglets 1E4PE
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Mer 24 Sep 2014 - 22:34

    Les polices de google font sont déjà uploadées sur le net et on peut l'installer dans la signature en mettant le lien. Les polices de dafont sont des fichiers qu'on peut downloader sur notre ordinateur ou dans nos logiciels. Du coup... non on ne peut pas prendre une police de dafont u_u

    Ce serait sûrement possible de dowloader ladite police sur notre ordi, puis sur internet, mais cela devient assez compliqué merci, donc quant à se casser à tête ou à trouver une police semblable sur google font, j'sais laquelle que je préfère Razz



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 22:48

    Ok alors j'ai trouvé la police "Abel" qui ressemble plus ou moins :p




    (ONYX) Signature codée à onglets 1E4PE
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Mer 24 Sep 2014 - 23:10

    *Tousse* T'abuse Onyx, j'allais le faire, en plus c'est la fête du string tout le monde répond et on me laisse dans les choux tout ça parce qu'aujourd'hui j'ai décidé d'aller me coucher :siffle:

    En tout cas, je plussoie ce qu'à dit Onyx, après il y a bien moyen d'installer une police sur un forum (une police dafont) mais le rendu n'est pas forcément pareil sur tous les navigateurs, il n'est pas forcément super beau, et c'est pas forcément idéal. Ou alors il y a la méthode du graph' quand c'est du texte "statique" (qui ne changera jamais ou pas souvent de contenu genre "Signature" toussa) mais peut-être que Onyx ne peut/ne veut pas ^^ Tu peux aussi voir avec elle pour fourni directement tes propres images si elle veut bien, ou si tu veux. Parce que moi à la base c'est ça que j'ai compris, que la police devait être utilisé pour les "titres" des onglets et c'est tout, donc hop j'allais ouvrir Gimp et faire une image de base, et une une fois sélectionné ou survolé Razz

    Je retourne dormir pour la peine, je vous boude naaah XD

    P.S : Perso, j'aurais conseillé au clic les onglets... Pourquoi ? Parce qu'une signature se trouve théoriquement à chaque fin de message, et on a rapidement fais de la survoler involontairement, ou autre, et du coup ça peut être assez énervant... Au plus on survol, on retournera toujours à la première quand la souris partira de l'onglet (sauf avec du JS peut-être)... Bref ! Ce n'est que mon avis et c'est pas ma demande, haaan patapey *Fuit* Nenuit XD



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 23:20

    Je vois ce que tu veux dire, ben au pire si la police donne moins bien, je ferais les images, on verra bien une fois que ce sera fait :p




    (ONYX) Signature codée à onglets 1E4PE
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Mer 24 Sep 2014 - 23:51

    Bouh!

    Alors voilà le résultat : http://forum-test-onyx3.forum-canada.com/h1-signature-de-maddi

    Alzu: Pour une fois que je suis plus rapide que Flash, j'en profite Twisted Evil



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Mer 24 Sep 2014 - 23:58

    Ooh mercii c'est génial ! *o* Juste petite modif', est-ce que tu sais agrandir un tout petit peu la taille des titres? Et enlever le soulignement de "profil" etc et à la place faire plus foncé au survol stp ? :p *je suis difficile*




    (ONYX) Signature codée à onglets 1E4PE
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Jeu 25 Sep 2014 - 0:13

    Flash il te dit qu'il était parti dormir parce qu'il doit se lever tôt demain, alors pour une fois que j'étais fatigué j'me suis dit "Ca peut attendre que j'ai une réponse, demain personne ne l'aura pris je pense) et en fait si... Cela dit, au survol ça peut se faire qu'avec du CSS c'est moins intéressant, au pire je posterais une autre version en LS au clic en JS :'3

    Et Flash il te dit aussi que tu aurais pu mettre ton nom + l'icône en cours dans le titre du topic Miss Onyx histoire que personne ne vienne voir en espérant que ce soit libre alors que non :3 <3


    Dernière édition par Alzufen le Jeu 25 Sep 2014 - 0:32, édité 1 fois



    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Jeu 25 Sep 2014 - 0:31

    Mmhh...

    Comme ça? : http://forum-test-onyx3.forum-canada.com/h1-signature-de-maddi

    Alzu: T'as raison, j'oublie toujours de le mettre dans le titre, sorry >< Et en fait, je me sentais lâche aujourd'hui alors j'ai tout fait en JS même si c'est au survol Rolling Eyes



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Jeu 25 Sep 2014 - 0:41

    Ouii merci beaucoup ! Bien que j'aurais préféré la police de départ qui donne quand même mieux, mais, mercii ! :hug2:




    (ONYX) Signature codée à onglets 1E4PE
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Jeu 25 Sep 2014 - 0:58

    Ahah bah c'est pas grave, le principal c'est que ce soit fait, t'inquiète moi aussi j'oubliais des trucs au début, genre les "up" quand je faisais des relances XD Tu t'y habitueras avec le temps, on m'a aussi reprocher l'icône "en cours" donc bon voilà Razz

    Et sinon pour le JS je vois ça, mais du coup ça permet de faire que même si on est pu sur l'onglet survolé il soit encore actif, c'est bien mieux je trouve pour ça :)

    Question esthétique, tu aurais aussi pu mettre un truc qui indiqué une suite (genre faire dépasser un bout de sign' et de texte) et permettre le scrolling qu'avec la molette sous Chrome, la scrollbar je la trouve pas belle là XD Enfin c'est que mon avis... *A un soucis avec les scrollbars en ce moment* XD

    Tu penseras à mettre l'icône terminé (le crochet vert) quand la demande sera fini Madii et que tu auras le LS (Oui, je le dis à chaque fois maintenant au cas où, y'a tellement d'oublies Razz)



    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Jeu 25 Sep 2014 - 3:03

    Rebonsoir!

    Voilà le LS : https://www.never-utopia.com/t51249-ls-signature-a-onglets

    Question esthétique, tu aurais aussi pu mettre un truc qui indiqué une suite (genre faire dépasser un bout de sign' et de texte) et permettre le scrolling qu'avec la molette sous Chrome, la scrollbar je la trouve pas belle là XD Enfin c'est que mon avis... *A un soucis avec les scrollbars en ce moment* XD
    Ça me dit rien Shocked Comment tu fais ça? Remarque, les mac n'ont pas de roulettes, alors ce serait pas super pour pour eux :hum:



    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Jeu 25 Sep 2014 - 3:45

    Bah tu peux aussi changer son apparence, c'est la mode en ce moment :hum:

    Et pour faire ça il faut utiliser le pseudo-élement scrollbar qui ne marche pour le moment qu'avec le préfixe -webkit- donc :

    ::-webkit-scrollbar ^^

    Et pour l'enlever bah tu mets le nom de la class où y'a la scrollbar tu ajoutes ça puis "display:none" remarque, tu peux aussi la faire apparaître au survol, ça doit être jouable ^^

    M'enfin, c'est ton LS, là je ne fais que t'apprendre un truc, c'est très bien comme ça et c'est Madii qui a commandé pas moi X'D



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Jeu 25 Sep 2014 - 13:40

    Donc on fait quoi pour la scrollbar ? Et il y a un petit soucis, dans la partie "MOI" c'est site qui doit apparaître et non NU puisque ce sera un lien vers mon site




    (ONYX) Signature codée à onglets 1E4PE
    Alzufen
    Alzufen
    MasculinAge : 28Messages : 2103

    Jeu 25 Sep 2014 - 13:49

    Pour la scrollbar, tu peux aussi personnaliser de toi-même avec le LS, j'ai expliqué les bases, le reste ne doit pas être trop trop dur, et au pire n'hésite pas à poster dans les problèmes si tu y arrives pas Wink

    Pour le NU, je suppose que ça sers de crédit au forum, tu peux très bien le remplacer par "Site" et changer l'url si tu comptes mettre le crédit ailleurs ou ajouter "Site" à côté Wink



    .Aelya.
    .Aelya.
    FémininAge : 30Messages : 2162

    Jeu 25 Sep 2014 - 15:08

    Oui mais je sais vraiment rien faire en codage, est-ce que le code de l'url est déjà mis ? Et pour le crédit, je ne sais pas où ni comment le mettre, mais en tout cas faut pas qu'il soit à cette emplacement, faut que ce soit bien distinguer des autres trucs x)




    (ONYX) Signature codée à onglets 1E4PE
    Onyx
    Onyx
    FémininAge : 30Messages : 3350

    Jeu 25 Sep 2014 - 15:15

    Salut,

    Ok, donc pour le crédit, tu as ceci dans le code :
    Code:
    <a href="LIEN VERS LE PROFIL" target="_blank">Profil</a>
                <a href="LIEN VERS LES MP" target="_blank">MP</a>
                <a href="http://www.never-utopia.com/" target="_blank">N-U</a>

    La dernière ligne, c'est le crédit. Tu as juste à l'enlever. Ensuite, entre le profil et le mp, tu rajoutes le lien pour ton site:
    Code:
    <a href="LIEN VERS LE SITE" target="_blank">Site</a>

    Là où mettre le lien de ton forum est en majuscules, donc j'imagine que tu le retrouveras facilement comme ça ^^



    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Nov 2024 - 9:28