Up Remember the OnirismDown Remember the Onirism
Forum d'entraide à la création de projets & de Libre service

5. Codage

le 26.11.17 13:14

le codage


Bon, là, on arrive dans le lourd...
MAIS !
Si vous êtes ici, c'est parce qu'il y a une raison, je me trompe ? Dans ce cas, je vais vous expliquer le but de ce sujet ! Mais avant, quelques bases...



Les bases


Il faut que vous ayez pris conscience ce qui a été dit dans "1. A lire~". C'est important, c'est pour ça que je l'ai numéroté avec un "1." et que je l'ai mis en note !
Pour cette section, les crédits sont obligatoires. Mais à vous de me dire si vous décidez de me créditer dans un sujet :"Les crédits" ou si je dois le faire par moi-même dans le code.
Et bien sûr, interdiction de dire :"C'est moi qui l'ait fait !" alors que non. Le respect de mes créations, toussa toussa ~
Et puis c'est tout... C'était court !


Le but


Je touche à peu près à tout. Templates comprises ! (Quoique, j'ai encore un peu de mal... Mais j'ai déjà codé un QEEL, des catégories, une PA... Bref, presque tout !)
De toute façon, si je ne peux pas ou si c'est trop compliqué pour moi, je vous en ferai part ! Donc ne soyez pas timides et proposez toujours ~ Le risque que je dise "Nope" est très faible !
Je sais faire des transitions et animations aussi !


Quelques créations


Des "pages d'accueil:

Autres:

CLIQUE → Une PA
Un QEEL :


Le formulaire


A poster à la suite de ce message...


Code:
<center><p style="text-transform:uppercase;color:white;font-size:30px;font-family: 'Amatic SC', cursive;border:1px solid white;padding:10px;">J'ai besoin d'aide ! [Codage]</p></center>
<div style="padding:15px;text-align:justify;font-size:12px;font-family:arial;">→ <span class="important">Type de service</span> : [x] Fiche ; [..] PA ; [..] Catégories ; [..] Autre.
→ <span class="important">Type de forum</span> : [x] Phpbb2 ; [..] Phpbb3 ; [..] ModernBB ;  [..] Invision.
→ <span class="important">Le template associé (si besoin de template)</span> : NOM DU TEMPLATE
[code]COPIER/COLLER ICI[/code]
→ <span class="important">La maquette (avec dimensions)</span> : <img src="LIEN DE VOTRE IMAGE"/>
 ... x ... px
→ <span class="important">Pour quel forum/blog/site ?</span> : <a href="LIEN VERS VOTRE FORUM/BLOG/SITE">NOM DE VOTRE FORUM/BLOG/SITE</a>
→ <span class="important">Des images pour illustrer ?</span> :
→ <span class="important">Les explications</span> :
→ <span class="important">Des précisions ?</span> : </div>

Ce qui donne :

J'ai besoin d'aide ! [Codage]


Type de service : [x] Fiche ; [..] PA ; [..] Catégories ; [..] Autre.
Type de forum : [x] Phpbb2 ; [..] Phpbb3 ; [..] ModernBB ;  [..] Invision.
Le template associé (si besoin de template) : NOM DU TEMPLATE
Code:
COPIER/COLLER ICI
La maquette (avec dimensions) :
... x ... px
Pour quel forum/blog/site ? : NOM DE VOTRE FORUM/BLOG/SITE
Des images pour illustrer ? :
Les explications :
Des précisions ? :
avatar
Mon projet :

Messages : 184

LS Graphiques : 2

LS Codage : 3

LS Projets : 1

Songes : 602

Spécialité : Codage... ?

Tic's Thing


le 17.02.18 18:04
Bonjour !
besoin d'aide pour un codage de fichette parce que je manque de temps !
   

J'ai besoin d'aide ! [Codage]


   
Type de service : [x] Fiche ;
   → Type de forum : [x] Phpbb2 ;
   → La maquette (avec dimensions) :

  Alors :
-ça ne doit pas dépasser les 610px large.
-Pour les block en hauts c'est du moitié/moitié niveau largueur. (Longueur, je m'en fiche tant que les bloques ne se décalent pas.)
-Pour les blocks (Objectifs/récompenses etc...) La largeur et la hauteur n'ont pas vraiment d'importance.


Pour quel forum/blog/site ? : Advictâme

Des précisions ? :

-Alors, j'aimerais que codage soit CSS/html. Juste pour pouvoir changer les couleurs facilement en cas de changement de graphisme.
-Il faudrait une barre de défilement pour le résumé. Mais pas pour Objectifs/récompenses etc...
-La police c'est Arial
-Les bords c'est bien du blanc


Heu voilà. Je sais pas trop quoi dire de plus, mais je suis à dispo si un truc n'est pas claire :)
avatar
Mon projet :
Bienvenue dans un monde où ta vie ne tient qu'à une pierre ...

Messages : 118

LS Graphiques : 0

LS Codage : 0

Songes : 358

Spécialité : Graphisme

Membre


le 17.02.18 21:17
Et voilà la bête : www !

Ca te va ? Je te passe les codes ? :3




MES LS - COMMANDES CODAGE/GRAPHIQUE/ECRITURE



Mes cadeaux ♥️ Merci à vous, z'êtes chous !:

Père Nowel Secret 2017
avatar
Mon projet :

Messages : 184

LS Graphiques : 2

LS Codage : 3

LS Projets : 1

Songes : 602

Spécialité : Codage... ?

Tic's Thing


le 17.02.18 21:24
oh déjà !!!

C'est perfecto ! Je veux bien les codages oui **
avatar
Mon projet :
Bienvenue dans un monde où ta vie ne tient qu'à une pierre ...

Messages : 118

LS Graphiques : 0

LS Codage : 0

Songes : 358

Spécialité : Graphisme

Membre


le 17.02.18 22:10
Et oui, déjà XD

Les voici ♥️

Le CSS :
Code:
/*DEBUT FICHE QUÊTE*/

/*Corps de la fiche*/
.corFIC {background-color:white;width:580px;border:10px solid white;font-family:arial;margin-left:auto;margin:right:auto;color:black;}
/*Les deux titres*/
.titqFIC{font-size:25px;color:darkred;text-transform:uppercase;font-weight:bold;}
.typqFIC{font-size:18px;text-transform:uppercase;}

/*Le premier bloc*/
.blFIC{width:100%;background-color:rgb(209,200,177);height:250px;}
.blFIC1{text-align:center;width:50%;float:left;padding-top:10px;}
.blFIC1 p {font-size:12px;margin-left:auto;margin-right:auto;padding:5px;text-align:justify;border-top:1px solid darkred;border-bottom:1px solid darkred;height:150px;overflow:auto;width:90%;}
.linFIC{background-color:rgb(177,162,141);width:100%;height:3px;margin-top:5px;}
.modFIC{font-weight:bold;color:darkred;}

/*Les autres blocs encadrés*/
.parFIC{border:15px solid rgb(172,162,141);background-color:rgb(209,200,177);min-height:150px;width:91%;padding:2%;}

/*FIN*/

A mettre dans la fiche (donc html) :
Code:
<div class="corFIC"><div class="blFIC"><div class="blFIC1"><span class="titqFIC">titre de la quête</span>
<span class="typqFIC">type de quête</span>

<p>Le résumé rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, rapide, etc.</p></div><div class="blFIC1" style="text-align:justify;"><span class="modFIC">Maître du jeu :</span> Nom du maître du jeu

<div class="linFIC"></div><span class="modFIC">Nombre de joueurs :</span> Nombre ici

<div class="linFIC"></div><span class="modFIC">Ouvert à :</span> Classe de personnage

<div class="linFIC"></div><span class="modFIC">Lieu et date de déroulement in game :</span> Nombre ici

<div class="linFIC"></div><span class="modFIC">Dangerosité :</span> Nombre ici
</div><div style="clear:both"></div></div>
<div class="parFIC"><span class="modFIC">Les objectifs à remplir :</span> Ici</div>
<div class="parFIC"><span class="modFIC">Les récompenses :</span> Ici</div>
<div class="parFIC"><span class="modFIC">Les conditions d'inscription :</span> Là et là</div>
<div class="parFIC"><span class="modFIC">Explications en plus :</span> Bah là en fait</div></div>

Si tu rencontres le moindre soucis, n'hésite pas ! ♥️




MES LS - COMMANDES CODAGE/GRAPHIQUE/ECRITURE



Mes cadeaux ♥️ Merci à vous, z'êtes chous !:

Père Nowel Secret 2017
avatar
Mon projet :

Messages : 184

LS Graphiques : 2

LS Codage : 3

LS Projets : 1

Songes : 602

Spécialité : Codage... ?

Tic's Thing


le 18.02.18 10:16
Non c'est nickel ! Merci !!
J'ai bien mit les crédits :)
avatar
Mon projet :
Bienvenue dans un monde où ta vie ne tient qu'à une pierre ...

Messages : 118

LS Graphiques : 0

LS Codage : 0

Songes : 358

Spécialité : Graphisme

Membre


Hier à 12:44
Bonjour :)
J'ignore si les commandes sont encore possible mais je tente tout de même, j'attendrai le temps qu'il faudra :) au besoin,
je joins le petit formulaire :

J'ai besoin d'aide ! [Codage]


Type de service : [x] Fiche ; [..] PA ; [..] Catégories ; [x] autre --> QEEL
Type de forum : [x] Phpbb2 ; [..] Phpbb3 ; [..] ModernBB ;  [..] Invision.
Le template associé (si besoin de template) : me semble que le Template relatif au QEEL est le index_body
Code:
{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<!-- BEGIN message_admin_titre -->
<!-- END message_admin_titre -->
   <!-- BEGIN message_admin_txt -->
<div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>

   <!-- END message_admin_txt -->

<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
        <tr>
            <td width="50%" valign="top" align="{switch_user_login_form_header.V_ALIGN}" class="row1">

                <table>
                    <tr>
                        <td><span class="genmed">{L_USERNAME}:</span> </td>
                        <td><input class="post" type="text" size="10" name="username"/> </td>
                        <td>
                            <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                            <span class="gensmall">{L_AUTO_LOGIN}</span>
                        </td>
                    </tr>

                    <tr>
                        <td><span class="genmed">{L_PASSWORD}:</span> </td>
                        <td><input class="post" type="password" size="10" name="password"/> </td>
                        <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                    </tr>
                </table>
            </td>

            <!-- BEGIN switch_social_login -->
            <td width="10%" align="center" valign="middle" class="row1">
                <span class="genmed fb_or">{switch_user_login_form_header.switch_social_login.L_OR}</span>
            </td>
            <td width="40%" class="align_gauche row1">
                <div class="social_btn">
                    <!-- BEGIN fb_connect -->
                    <div class="fb-login-button"></div>
                    <!-- END fb_connect -->
                    <!-- BEGIN topicit_connect -->
                    <div class="ti-connect"></div>
                    <!-- END topicit_connect -->
                </div>
            </td>
            <!-- END switch_social_login -->

        </tr>
    </table>
</form>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td width="50%" valign="top">
         <!-- BEGIN switch_user_logged_in -->
         <span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a></span>
         <!-- END switch_user_logged_in -->
         <!-- BEGIN switch_delete_cookies -->
         <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
         <!-- END switch_delete_cookies -->
      </td>
      <td width="50%" align="right">
         <span class="gensmall">
            <a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
            <a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
            <a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
            <!-- BEGIN switch_on_index -->
               <!-- BEGIN switch_delete_cookies -->
               <br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
               <!-- END switch_delete_cookies -->
            <!-- END switch_on_index -->
         </span>
      </td>
   </tr>
</table>

<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
        <tr>
            <td width="50%" valign="top" align="right" class="row1">

                <table>
                    <tr>
                        <td><span class="genmed">{L_USERNAME}:</span> </td>
                        <td><input class="post" type="text" size="10" name="username"/> </td>
                        <td>
                            <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                            <span class="gensmall">{L_AUTO_LOGIN}</span>
                        </td>
                    </tr>

                    <tr>
                        <td><span class="genmed">{L_PASSWORD}:</span> </td>
                        <td><input class="post" type="password" size="10" name="password"/> </td>
                        <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                    </tr>
                </table>
            </td>

            <!-- BEGIN switch_social_login -->
            <td width="10%" align="center" valign="middle" class="row1">
                <span class="genmed fb_or">{switch_user_login_form_footer.switch_social_login.L_OR}</span>
            </td>
            <td width="40%" class="align_gauche row1">
                <div class="social_btn">
                    <!-- BEGIN fb_connect -->
                    <div class="fb-login-button"></div>
                    <!-- END fb_connect -->
                    <!-- BEGIN topicit_connect -->
                    <div class="ti-connect"></div>
                    <!-- END topicit_connect -->
                </div>
            </td>
            <!-- END switch_social_login -->

        </tr>
    </table>
</form>
<!-- END switch_user_login_form_footer -->

<!-- BEGIN disable_viewonline -->
<link href="https://fonts.googleapis.com/css?family=Great+Vibes" rel="stylesheet"/>

<div id="container_qeel">
<!-- IMAGE TOP --><img src="https://image.noelshack.com/fichiers/2017/46/6/1511004099-barre-cate.png "/>

    <div id="head_qeel">Qui est en ligne ?<br/>
        <span>Citation</span>
    </div>
<!-- IMAGE DU CENTRE --><img src="https://zupimages.net/up/17/50/jw6a.png"/>
    
    <div class="blocs_qeel" id="stats_qeel">
        <h1>Statistiques</h1>
        {TOTAL_USERS}<br/>
        {TOTAL_POSTS}<br/>
        {NEWEST_USER}<br/>
        {TOTAL_USERS_ONLINE}
    </div>
    <div class="blocs_qeel" id="were_here_qeel">
        <h1>Ils sont passés par là...</h1>
        <table>{L_CONNECTED_MEMBERS}</table>
    </div>
  <!-- GROUPES -->
    <div class="blocs_qeel" id="groups_qeel">
        <h1>Groupes</h1>
        <div class="label_groups_qeel" id="group1_qeel">Acer
            <div>
                <h2>Acer</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 1.</div>
        </div>
        <div class="label_groups_qeel" id="group2_qeel">Ignis
            <div><h2>Ignis</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 2.</div>
        </div>
        <div class="label_groups_qeel" id="group3_qeel">Agua
            <div><h2>Agua</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 3.</div>
        </div>
        <div class="label_groups_qeel" id="group4_qeel">Terra
            <div><h2>Terra</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 4.</div>
        </div>
        <div class="label_groups_qeel" id="group5_qeel">Flambios
            <div><h2>Flambios</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 5.</div>
        </div>
        <div class="label_groups_qeel" id="group6_qeel">Adultes
            <div><h2>Adultes</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 6.</div>
        </div>
        <div class="label_groups_qeel" id="group7_qeel">Ministère
            <div><h2>Ministère</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 7.</div>
        </div>
        <div class="label_groups_qeel" id="group8_qeel">Sainte-Mangouste
            <div><h2>Sainte-Mangouste</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 8.</div>
        </div>
        <div class="label_groups_qeel" id="group9_qeel">Commerçants
            <div><h2>Commerçants</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 9.</div>
        </div>
        <div class="label_groups_qeel" id="group10_qeel">PNJ
            <div><h2>PNJ</h2>
                <span>Citation</span>
                Blabla je suis la descri du groupe 10.</div>
        </div>
    </div>
  <!-- GROUPES FIN -->
    <div class="blocs_qeel" id="here_qeel">
        <h1>Ils sont là...</h1>
        <table>{LOGGED_IN_USER_LIST}</table>
    </div>
    
<!-- IMAGE AU BAS --><img src="https://image.noelshack.com/fichiers/2017/46/6/1511004099-barre-cate.png "/>    
</div>
<div id="creditqeel"><a href="http://epicode.bbactif.com/" target="_blank">(c) XLittleRainbow for flambios</a></div>

<!-- IMPORTANT DE NE PAS TOUCHER LE JS-->
<script type="text/javascript">
  document.getElementById('stats_qeel').innerHTML=document.getElementById('stats_qeel').innerHTML.replace(/Nous avons/,"Nos membres sont ").replace(/membres enregistrés/,"").replace(/Nos membres ont posté un total de/,"et ont posté").replace(/messages/,"parchemins.").replace(/L'utilisateur enregistré/,"Le sorcier").replace(/utilisateurs/,"sorciers").replace(/utilisateur/,"sorcier");
  document.getElementById('were_here_qeel').innerHTML=document.getElementById('were_here_qeel').innerHTML.replace(/Membres connectés au cours des 24 dernières heures : /,"");
  document.getElementById('here_qeel').innerHTML=document.getElementById('here_qeel').innerHTML.replace(/Utilisateurs enregistrés : /,"");
</script>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
   <tr>
      <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NEW_POSTS}</span></td>
      <td></td>
      <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
      <td> &nbsp;</td>
      <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
      <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
   </tr>
</table>
<!-- END switch_legend -->

{AUTO_DST}
Si nécessaire je pourrais fournir d'autres templates en éditant mon poste
La maquette (avec dimensions) :
la maquette finale : https://www.zupimages.net/up/18/05/3nme.jpg
https://zupimages.net/up/18/05/plb6.png
https://zupimages.net/up/18/05/hkxy.png
image : https://zupimages.net/up/18/05/xcx7.png
Si besoin des couleurs pour les groupes je reste dispo :)

Pour quel forum/blog/site ? : Flambios
Des images pour illustrer ? : J'ai tout mis plus haut zut xD
Les explications : Il y a juste un petit questionnement d'infobulle lorsqu'on passe sur l'un des groupes mais vous pourrez voir le résultat sur l'une des images plus haut avec l'effet désiré.
Des précisions ? :
Et bien je ne sais pas ? Si ce n'est pas suffisant, il suffit tout simplement de me le dire et je ferais ce qu'il faut pour :)

Encore merci et je reste disponible si besoin (ce qui est normal xD)

Bonne journée :)
avatar
Mon projet : [URL=ADRESSE][/URL]

Messages : 3

LS Graphiques : 0

LS Codage : 0

Songes : 16

Membre



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

Partenaires