L'annuaire des forums Forumactif
votre référence en terme de référencement et de développement de forums.
 




 Fiche de présentation des animés [SeLfde4Th7]

Lenpikaavatar
Messages : 133
Bonjour je souhaiterai faire une demande pour une fiche de présentation de shojo : un mangas pour jeunes filles


Le lien du forum où le code sera installé :http://airyscine.forumgratuit.org
Lien de la publicité sur l'annuaire : http://www.forumsdeforumactif.com/t13975-le-monde-de-airyscine
Support de mise en page : Message de la page d'accueil - Messages du forum - page HTML - Qui est en ligne - Modifications des catégories - Fiche de présentation ou relations
Résultat en : HTML - BBcode
Type de mise en page : Classique* - Colorée* - Personnalisée
----------------------------------------------------
Plan :


Spoiler:
 

Description plus détaillée : je voudrais si possible que les bords de la fiche soit arrondie ou en tout cas original que cela ne soit pas carré, c'est triste sinon
Les couleurs : J'aimerais que cela corresponde au thème  shojo donc mangas pour jeunes filles, des couleurs douces qui représente l'amour ( je n'en ai pas de précise en tête, je laisse libre choix au codeur de me surprendre )
Texte :Il n'y en a pas de prédéfini puisque ça change selon le manga/animé :s
Image(s) :Je n'en ai pas non plus puisque l'image changera selon le manga/animé
La largeur de votre forum : 50%
D'autres commentaires : J'aimerais vraiment que ressorte le côté jeune fille.

Merci d'avance à celui ou celle qui prendra en charge ma commande Smile
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Je valide votre commande et déplace donc le sujet dans les demandes en cours.
Je reviens très vite vers vous Wink.
Lenpikaavatar
Messages : 133
D'accord Smile merci beaucoup ^^
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
C'est de nouveau moi, j'ai terminé la demande.
Le résultat est visible ici.
Au niveau des couleurs, j'avou ne pas avoir été inspiré, mais vous pourrez les changer si vous le souhaitez Wink.

Bonne soirée Smile.
Lenpikaavatar
Messages : 133
Oui, ça me va ^^ comme tu dis je changerai les couleurs après vu que de toute manière, il n'y à pas que des fiches shojo Smile merci
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,



Dis moi si tu as un problème lors de l'installation Wink.
Lenpikaavatar
Messages : 133
je ne sais pas où placer ce que tu me dit dans la feuille de style css dans le panneau d'admin j'ai déjà  quelque chose :

SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Re,

Le CSS est à placé dans la feuille de style CSS comme dit, après ce qu'il y a déjà dans celle-ci Wink .

Le HTML etant donné qu'il sagit d'une fiche est à placer dans votre message de présentation une fois que vous aurez écris ce que vous désirez à la place des texte déjà placé.
Lenpikaavatar
Messages : 133
D'accord ^^ sinon comment je fais si je veux faire des fiches différentes mais en gardant la même base ?
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Et bien si par exemple vous ne voulez pas mettre de petite introduction sous le titre et que vous ne voulez pas donner d'avis pour l'une de vos fiche il vous suffit d'enlever les textes qui correspondent ainsi que les balises (que l'on reconnait par les symboles < et > pour les balises ouvrantes et pour les balises fermantes) qui les entourrent.

Ainsi pour l'exemple dont je vous parle le code serait :
Lenpikaavatar
Messages : 133
D'accord c'est très utile, ça répond directement à une autre de mes questions ^^

Sinon, si je veux une fiche par exemple pour un autre genre d'animé prenons le seinen ou l'univers et plus noir comme un thriller. Comment je fais pour faire une fiche du même genre mais pour un auutre type d'animé ?

donc en gros des couleur différents
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Re,

Ce que vous pouvez faire c'est ajouter une class à la première balise, par exemple :
Code:
<div id="pres_Body" class="seinen">

Et vous stylisez les couleurs de cette fiche avec cette class, ce qui donnerait quelque comme ça :
Code:
.seinen{
    background-color: #COULEUR;
}

.seinen h1{
    color: #COULEUR;
    background-color: #COULEUR;
}

.seinen div{
    color: #COULEUR;
}
Lenpikaavatar
Messages : 133
Bonjour ^^

et donc les codes :

Code:
.seinen{
    background-color: #COULEUR;
}

.seinen h1{
    color: #COULEUR;
    background-color: #COULEUR;
}

.seinen div{
    color: #COULEUR;
}

je les mets dans la feuille CSS c'est ça?
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Pardonnez moi je crois m'être mal exprimé.
Je reprend Wink.

Je vous est donné un code CSS à mettre dans votre feuille de style CSS, ce que vous avez fait.
Ce code défini le style de la fiche (la bordure et sa couleur, la taille, les couleurs de texte, de fond...).
Vous pouvez y changer les couleurs que l'on écrit généralement en code hexadécimal, je les ai indiquées avec /*des commentaires*/ à la suite de la ligne ou elles se trouvent.
ceux-ci constitue vos fiches de base.

Maintenant imaginons que demain vous désirez poster une autre fiche avec un univers comme vous l'avez cité: plus sombre !
Dans ce cas vous allez créer un nouveau sujet, dans ce nouveau sujet vous allez mettre le HTML de votre fiche est ajouter comme je vous l'ai dit une class par exemple "seinen" à la première balise, pour rappel ça donnerait quelque chose comme ça :
Code:
<div id="pres_Body" class="seinen">

Puis pour changer les couleurs par rapport à votre fiche de base on se sert de la class "seinen" pour appliquer les nouvelles couleurs (toujours via le CSS et donc à placer dans la feuille de style), ce qui comme je vous l'ai dit donnerait quelque chose comme ça :
Code:
.seinen{
    background-color: #COULEUR;
}

.seinen h1{
    color: #COULEUR;
    background-color: #COULEUR;
}

.seinen div{
    color: #COULEUR;
}

Ce que j'ai oublié de vous dire c'est qu'il faudra bien sur dans ce code changer pour chacune des lignes "#COULEUR" par le code hexadécimal de la couleur que vous désirez.
Lenpikaavatar
Messages : 133
Alors j'ai bidouiller un peu tout, essayer pas mal de chose le seul résultat que j'obtient c'est d'arriver à changer la couleur de fond pour les blocs titres   ce qui veut dire qu'à un moment ça marche et qu'ensuite fausse joie '-'

voila le code en entier ( j'ai vraiment du mal avec tout ces codes, ce n'est pas tant que l'explication qui est mauvaise mais plus la mise en oeuvre lol)


Code:

/*** Debut de la fiche de présentation réalisee par SeLfde4Th7
 *** pour Lenpika
 *** sur l annuaire des forums forumactif : http://www.forumsdeforumactif.com
 *** toute reproduction même partielle est strictement interdite sans l accord du codeur ***/

 /*Corp de la fiche*/
#pres_Body{
    width: 670px;
    margin: auto;
    padding: 0px 2px;
    padding-bottom: 45px;
    background-color: #70BFCF; /*Couleur de fond de la fiche*/
    border: 1px solid #000; /*Bordure de la fiche*/
    overflow: hidden;
    text-align: center;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px; /*Arrondis*/
    -o-border-radius: 100px;
    border-radius: 100px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
.seinen
    background-color: #000000;
}


/*Image du haut de la fiche*/
.pres_Img{
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;/*Arrondis de l image*/
    -o-border-radius: 15px;
    border-radius: 15px;
}

/*Titres*/
#pres_Body h1{
    padding: 3px 0px;
    color: #F70;/*Couleur des titres*/
    background-color: #8ECF70;/*Couleur du fond des blocs titres (h1)*/
    text-align: center;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;/*Arrondis des blocs titres (h1)*/
    -o-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
.seinen h1
    color: #000000;
    background-color: #DC143C;
}

/*contenu des descriptions*/
#pres_Body div{
    width: 95%;
    margin: auto;
    color: #777;/*Couleur des textes*/
    text-align: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
.seinen div
    color: #FEFEFE;
}



/*Crédits*/
#credits{
    width: 100%;
    position: relative;
    top: 40px;
    text-align: center !important;
    font-size: 11px;
}

Et voici le code htlm dont je me sers sur la fiche 

Code:

[size=13][size=10][color=#666666][font=Courier, 'Courier New', sans-serif]<div id="pres_Body" class="seinen">[/font][/color][/size][size=10][color=#666666][font=Courier, 'Courier New', sans-serif]<img class="pres_Img" src="http://placehold.it/650x210" alt="Image de présentation">[/font][/color][/size][/size]
[size=13][/size]
[size=13][size=10][color=#666666][font=Courier, 'Courier New', sans-serif]<h1>Titre</h1><div>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div><h1>Résumé</h1><div>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?</div><h1>Personnage</h1><div>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.</div><h1>Opening & endings ou Épisode</h1><div>Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.</div><h1>Avis</h1><div> Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.</div><div id="credits">Fiche de présentation réalisée par SeLfde4Th7 sur <a alt="l'annuaire des forums Forumactif" href="http://www.forumsdeforumactif.com/">l´annuaire des forums Forumactif</a>.</div></div>[/font][/color][/size][/size]

je crois que je peux bien avouer que j'ai du mal   
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Il serait plus simple de me dire les couleurs que vous désirez modifier Wink .
Lenpikaavatar
Messages : 133
en fait pour la fiche seinen, en fond je voudrais du noir, les blocs titres en rouge avec l'écriture en noire et blanc en texte 

Code:

.seinen
   background-color: #000000;

.seinen h1
   color: #000000;
    background-color: #DC143C;

.seinen div
   color: #FEFEFE;
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Vous avez oublié les accolades dans le code, essayez comme ça:
Code:
.seinen{
  background-color: #000000;
}

.seinen h1{
  color: #000000;
  background-color: #DC143C;
}

.seinen div{
  color: #FEFEFE;
}

J'ai vu que vous avez quelqu'un avec le rang de codeuse sur votre forum, ne connais-t-elle pas tout ça ?
Lenpikaavatar
Messages : 133
Le souci, et  aussi la raison pour laquelle je passe commande maintenant, c'est qu'elle n'a plus ni pc ni internet donc est totalement indisponible

pour les accolades je les avais enlever, car dans le code que je met donc ceci :

Code:

/*** Debut de la fiche de présentation réalisee par SeLfde4Th7
 *** pour Lenpika
 *** sur l annuaire des forums forumactif : http://www.forumsdeforumactif.com
 *** toute reproduction même partielle est strictement interdite sans l accord du codeur ***/

 /*Corp de la fiche*/
#pres_Body{
    width: 670px;
    margin: auto;
    padding: 0px 2px;
    padding-bottom: 45px;
    background-color: #70BFCF; /*Couleur de fond de la fiche*/
    border: 1px solid #000; /*Bordure de la fiche*/
    overflow: hidden;
    text-align: center;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px; /*Arrondis*/
    -o-border-radius: 100px;
    border-radius: 100px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
 .seinen{
  background-color: #000000;
}
}


/*Image du haut de la fiche*/
.pres_Img{
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;/*Arrondis de l image*/
    -o-border-radius: 15px;
    border-radius: 15px;
}

/*Titres*/
#pres_Body h1{
    padding: 3px 0px;
    color: #F70;/*Couleur des titres*/
    background-color: #8ECF70;/*Couleur du fond des blocs titres (h1)*/
    text-align: center;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;/*Arrondis des blocs titres (h1)*/
    -o-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
.seinen h1{
  color: #000000;
  background-color: #DC143C;
}
}


/*contenu des descriptions*/
#pres_Body div{
    width: 95%;
    margin: auto;
    color: #777;/*Couleur des textes*/
    text-align: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
.seinen div{
  color: #FEFEFE;
}
}






/*Crédits*/
#credits{
    width: 100%;
    position: relative;
    top: 40px;
    text-align: center !important;
    font-size: 11px;
}

que je les plaçent avant après ou aux endroits qu'il faudrait quand je regarde la fiche rien ne donne de résultat, ou seulement ce que je vous disais la couleur des blocs titres qui changent et pour cela je dois enlever les accolades c'est pour ça que je reviens vers vous, car je suis perdu
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Ça ne donne rien parce que vous avez placé les codes dans les autres accolades.
Cela devrait être comme ça (et non comme dans vote code actuel) :
Code:
#pres_Body{
    width: 670px;
    margin: auto;
    padding: 0px 2px;
    padding-bottom: 45px;
    background-color: #70BFCF; /*Couleur de fond de la fiche*/
    border: 1px solid #000; /*Bordure de la fiche*/
    overflow: hidden;
    text-align: center;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px; /*Arrondis*/
    -o-border-radius: 100px;
    border-radius: 100px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.seinen{
    background-color: #000000;
}
Lenpikaavatar
Messages : 133
bonjour, j'ai déjà tester cela et rien ne change
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Bonjour,

Dans ce cas vous pouvez essayer en ajoutant des "!important" comme ceci :
Code:
.seinen{
  background-color: #000000 !important;
}

.seinen h1{
  color: #000000 !important;
  background-color: #DC143C !important;
}

.seinen div{
  color: #FEFEFE !important;
}

Bonne journée Wink .
Lenpikaavatar
Messages : 133
Ah oui ! La ça marche Very Happy merci ^^
SeLfde4Th7V.I.P.avatar
Messages : 2573
++
Super, j'archive donc Wink .
Si vous avez de nouvelles questions à propos de cette n'hésitez pas à poster dans le studio d'aide et tutoriel : http://www.forumsdeforumactif.com/f69-studio-d-aide-tutoriels

Bonne soirée
Contenu sponsorisé

,
 Sujets similaires
-
» Code de présentation de fiche RP
» Onglets fiche de présentation
» [RPG] Fiche de présentation
» Fiche de Présentation RPG
» Tableau de partenaires avec effet Zoom

Répondre au sujet


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum

Modérer

Trames

  • Nos services
  • Prés. obligatoire
  • Référencé
  • Réf. (comp)
  • Prérelance
  • 1ère relance
  • 2ème relance
  • Recherche (relance)
  • Recherche (corbeille)
  • Formulaire manquant
  • Formulaire incomplet
  • 1
  • 2
  • 3
  • 4
  • 5
  • Evaluation