Personnalisation d'une fiche de RP [Ajartielle]

Bonjour bonjour,
je souhaiterais demander de modifier ce codage de Jawilsia :

Spoiler:

Code:

<link href='http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic|Playball' rel='stylesheet' type='text/css'>
<style> .icone{opacity : 0.6; transition : 1s }.icone:hover{opacity :1}.bloc{opacity : 0.5; width : 460px; padding : 15px; text-align : justify; background-color :#797773; border-radius : 5px;  ;}.texte{font-family: 'Crimson Text', serif; color : #000000; text-shadow : 1px 1px 1px #6D6D6D; font-size : 15px; text-align : justify}  </style>

<center><div style =" width : 550px; background-color : #373228; border-right : 10px solid #666561; border-left : 10px solid #666561;"><div style = "background-image: url('http://secondlife.mitsi.com/SeamlessTextures/large/BT-wood%20floor%202-seamless-solid-by-Linda-Kellie.png' ); opacity : 0.5;">
<div class="icone"><img src="http://www.gifsanimes.fr/celebrites/e/ed-sheeran/ed-sheeran-gifs-animes-5111799.gif" style="width: 480px; border: solid 2px #666561;  box-shadow : 2px 2px 10px #a0a0a0;"  /></div>
<div style ="text-align : center;  font-weight : bold ; font-size : 40px; font-size : 40px; text-shadow : 1px 1px 1px #4F4E4D; letter-spacing :2px ; font-family: 'Playball', cursive; margin-top : -25px; color : #F2F2F1">
[i]Nom du RP [/i]<span style = "text-align : center;  font-weight : bold ; font-size : 20px;letter-spacing :-1px ; font-family: 'Crimson Text', serif;" >
Titre complémentaire </span></div>


<div class = "bloc"><span class ="texte">

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent quis ligula a mauris porttitor rhoncus sit amet id leo. Morbi dignissim molestie libero eu blandit. Suspendisse potenti. Suspendisse vehicula luctus ex, et tincidunt erat facilisis at. Suspendisse vulputate dolor sed arcu tristique cursus. Sed finibus neque luctus pellentesque convallis. Sed tellus urna, aliquam eu tortor ut, laoreet tincidunt nisi. Proin sit amet pulvinar justo.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque non sem enim. Nulla non arcu a justo ultrices sagittis non at ex. Etiam in sem dictum, convallis magna ut, interdum lacus. Vivamus dui nibh, iaculis eu mollis ac, scelerisque ac nisi. Duis vehicula odio quis sapien mollis mollis. Aliquam quis iaculis libero. Phasellus vitae ultricies est, et vestibulum nisi. Integer a urna aliquet nisl semper rhoncus. Pellentesque sit amet convallis metus. Nulla commodo id felis in hendrerit. Duis non velit in erat facilisis mattis et at lectus. Vivamus auctor, massa non blandit pretium, quam risus blandit velit, sed luctus ipsum augue vitae tellus. In cursus mollis ante a commodo. Curabitur pulvinar, purus eu pharetra condimentum, turpis est semper tellus, quis iaculis lacus enim vitae ipsum.

Quisque fringilla rhoncus mauris. Proin porttitor malesuada purus, sit amet venenatis diam porta nec. Phasellus egestas tortor rhoncus justo tincidunt blandit. Donec id arcu pharetra, cursus dolor sed, rhoncus neque. Mauris suscipit, enim in ornare tincidunt, nulla massa imperdiet mauris, tincidunt maximus felis enim id ante. Nullam elit ipsum, venenatis ac gravida at, accumsan vitae augue. Ut mattis nisl massa, sit amet venenatis eros tempus quis. Proin eget blandit turpis. Sed laoreet nulla nulla, at lacinia ex scelerisque non. Integer dignissim blandit facilisis. Suspendisse fringilla metus dui, sed facilisis tellus rutrum quis. Donec semper nisi a nisi eleifend, ac efficitur diam rutrum. Nam sed sem id tortor ultricies euismod et eget ipsum. Aliquam porta, dui nec sodales sollicitudin, ex sem posuere est, ut vulputate diam elit id sapien.
</span></div>
<a style="color: #5f5f5f; font-size: 10px; padding : 0px; font-family: 'Josefin Slab', serif; letter-spacing: 2px;" href="http://www.never-utopia.com/">© Jawilsia sur Never Utopia</a>

</div></div></center>

Voila je ne m'y connais pas du tout en codage (sauf en JavaScript)
Du coup je ne sais pas comment faire mais j'aimerais :
- Changer la couleur de tous les textes (Titres et textes) en couleur Fraise BF3030
- Et arrondir les coins de l'image juste un tout petit petit peu histoire de rendre le tout moins agréssif.
- Et -si ce n'est pas trop compliquer- intégrer un lecteur de musique entre le titre et le texte comme celui là (car je trouve que les lecteur youtube bug tout le temps graphiquement) :

Spoiler:

Je ne sais pas comment il s'appelle je trouve aucune infos nul part alors je me dis que vous savez peut être... comme il est noir, c'est parfait.

Voila voila.
Merci beaucoup beaucoup d'avance en tout cas !

Up ^^

Hello ^^

Voici ce que j'obtiens (sous hide), en modifiant un peu :



J'ai également changé un peu la couleur de fond derrière le texte, sinon, avec une couleur fraise, c'était illisible. x)

Pour l'ajout du lecteur de musique, la façon de faire que j'ai fini par trouver et qui donne exactement ce que tu veux est un peu compliquée. Je ne veux pas m'en attribuer le mérite, donc voici le lien du tuto que j'ai suivi (et qui viens d'un autre site... désolée si ça compte comme de la pub... mais il faut rendre à César ce qui est à César ! Non ?) : Le 7e message.



P.S. Oui, mettre du BBcode dans du HTML, c'est criminel, mais j'ai pas pu faire autrement.

Hiii, merci, c'est top !
Sans vouloir être embêtant, pour terminer, serait-il possible d'avoir le même fond que dans l'exemple s'il vous plait ?
En fait il fait parti des éléments principaux de mon "coup de foudre" :/
Si cela est impossible ce n'est pas grave, seulement l'effet du fond je l'aime beaucoup.
Merci beaucoup d'avance !!!

La couleur de fond que j'ai changé derrière le texte ? Si tu veux, mais je t'aurai prévu. C'est illisible. x)

Il suffit juste de changer le background-color de la class bloc et de remettre l'effet d'opacité à 0.5.

Merci beaucoup, je verrais de moi même si le fond est si ennuyant !
Merci beaucoup en tout cas

Ah et j'ai essayer pour le remettre cela ne marche pas (ou alors je suis pas au bon endroit --' ) xD
Comment je peux faire ? Merci

AustinWolf a écrit:Ah et j'ai essayer pour le remettre cela ne marche pas (ou alors je suis pas au bon endroit --' ) xD
Comment je peux faire ? Merci

Remettre quoi ? x) La couleur de fond ?

Euh oui désolé ^^'

En fait, si tu essais de remettre le code tel quel en changeant des trucs qui se trouvent entre les balises "style" (au début du code de la fiche) en postant dans une page où la fiche est déjà présente, ça ne marchera pas parce que les éléments "style" qui se trouvent dans un message précédent vont entrer en conflit avec tes changements. Je sais pas si c'est clair ce que je dis. x)

Disons que je poste 2 fois la fiche. Dans le code de la première fiche, pour la class bloc, je mets un "background-color: #ffffff;". Dans le code de la deuxième, je mets "background-color: #000000;". Et bien mes deux fiches vont être pareil, même si leur code est différent. Parce que les class qui sont codées entre les balises "style" s'appliquent à tous les éléments qui portent cette class dans la page. Et là, il y a contradiction, vu qu'il y a deux fois le code. Donc si j'ai une div "class="bloc"", ben elle reçoit 2 ordres différents...

BREF. Ça peut expliquer pourquoi tu n'arrives pas à changer la couleur (si tu essayais de le faire en postant à un endroit où la fiche était déjà présente). Pour éviter ça, d'ailleurs, je te propose de limiter au minimum ce qui se trouve entre les balises "style" et donc de modifier le code de la fiche ainsi :



À partir de là, si tu veux modifier la couleur de fond du texte, c'est là (juste après la balise flash) :

Code:

<div style="opacity: 0.5; width: 460px; padding: 15px; text-align: justify; background-color: #797773; border-radius : 5px;">

D'accord parce que j'avais mal compris... j'avais compris que le background que je voulais au départ était présent mais que tu avais changer l'opacité. En fait c'est un background totalement différent, et du coup si je veux mettre exactement le même que dans l'exemple que je t'avais donner ? ^^
Merci

J'avais changé à la fois la couleur de fond et l'opacité.

Code:

J'avais mis ça :

background-color: #bcbbb9;

(Et enlevé l'opacité.)

Dans le dernier code que je t'ai donné, il s'agit de la couleur de fond et de l'opacité d'origine tels que présents dans le LS de Jawilsia.

Code:

opacity: 0.5;
background-color: #797773;

Ah d'accord merci beaucoup alors !
Je termine le topic donc.
Merci beaucoup ^^

Edit; Soit je suis vraiment bête, soit c'était difficile à comprendre pour moi ... --'
Bref je viens de relire toute notre conversation par curiosité et je me suis rendu compte que de l'opacité ça ne pouvait parler que de l'encadré du texte...
J'ai alors en effet constater tes changement dans ton deuxième post et oui en effet c'est illisible, car moi je pensais au background... background quoi ! Le fond noir effet "bois", qu'avait mit Jawilsia.
Je suis désolé je continu encore de demander des trucs mais apparemment il y a eu un malentendu depuis le début ^^
Ce que je voulais changer de ton premier post -si cela ne dérange pas- c'est mettre le fond de Jawilsia, car c'est lui qui est dans le thème de ma signature et ma fiche de présentation ^^
Merci

J'ai fais un edit ^^

AustinWolf a écrit:moi je pensais au background... background quoi ! Le fond noir effet "bois", qu'avait mit Jawilsia.
Je suis désolé je continu encore de demander des trucs mais apparemment il y a eu un malentendu depuis le début ^^
Ce que je voulais changer de ton premier post -si cela ne dérange pas- c'est mettre le fond de Jawilsia, car c'est lui qui est dans le thème de ma signature et ma fiche de présentation ^^
Merci

Wuuuuut ? xD xD

J'avais même pas remarqué qu'il était supposé avoir un effet de texture derrière. Haha. Oui, on parle pas de la même chose depuis le début en fait ! xD Désolée ! xD xD

Donc, bon, oui, voilà, on va y arriver... =')

L'effet de texture bois en background de toute la fiche (et non pas juste le background derrière le texte, comme je pensais xD) viens de cette ligne de code :

Code:

<div style="background-image: url('http://secondlife.mitsi.com/SeamlessTextures/large/BT-wood%20floor%202-seamless-solid-by-Linda-Kellie.png' ); opacity: 0.5;">

Or il semble que l'adresse URL de l'image de bois soit morte. C'est pour ça qu'elle n'apparaît plus. En fouillant sur Google, je crois qu'il s'agit de cette image.

Donc en changeant l'URL, ça devrait refonctionner. Pour éviter que ça se reproduise, quand même, je te conseille de sauvegarder l'image, de la ré-héberger (par exemple sur Servimg) et donc d'utiliser un URL à toi à la place.

C'est moi qui m'excuse xD
Alors si je comprends bien je remplace par mon futur lien mais pourquoi au milieu du lien y a :
%20floor%202
C'est obligatoire ou ça viens du lien ? (Car cette partie du lien est en bleu dans le code)

D'après ce que j'en sais/comprends, puisqu'un URL ne peut pas contenir d'espaces ou de caractères spéciaux (genre des accents), ils sont convertis en codes. Le titre de l'image, au départ, devait être "Wood floor 2" et les espaces ont été remplacés par le code %20. Ça donne donc "wood%20floor%202".

Pourquoi ils sont en bleu, ça, c'est parce que la balise "code" du forum donne des couleurs en fonction de certains critères... Genre, entre des apostrophes, c'est rouge. Donc, bon, je connais pas tous les critères, mais j'imagine qu'elle reconnaît les codes avec des %.

Bref, ça fait parti du lien. Tout ce qui est entre les apostrophes tu peux l'effacer pour mettre l'URL de l'image. ^^

En tout cas merci beaucoup tu as juste fais un super travail :3
Merci merci merci

Contente d'avoir aidé ! On a fini par se comprendre ! Haha !

Hésite pas si tu as d'autres questions. ^^