-
.SPOILER (clicca per visualizzare)CODICE<div class="schedapg"><div class="pgheader">
<div class="pgpv">[IMG]Link immagine prestavolto[/IMG]<span>[IMG]Link immagine stemma[/IMG]</span></div>
<h1>Nome personaggio </h1></div><div class="info">
<h2>Informazioni Generali</h2><table>
<tr class="infocontainer"><th>Titoli</th>
<td><span>[IMG]Link immagine stemma[/IMG]<p>Nome titolo</p></span></td>
</tr>
<tr><th>Appartenenza</th>
<td>Casata maggiore</td>
</tr>
<tr><th>Religione</th>
<td>x</td>
</tr>
<tr><th>Cultura</th>
<td>x</td>
</tr>
<tr><th>Data di Nascita</th>
<td>x[Età Attuale: x]</td>
</tr>
<tr><th>Livello</th>
<td><span>x [<b>Punti Esperienza:</b> 0/20]</span></td>
</tr>
</table><h2>Parametri</h2><table>
<tr><th><table>
<tr><th>Diplomazia</th>
<td>x</td>
</tr>
<tr><th>Marzialità</th>
<td><span>valore marzialità<p><b>Forza</b> X
<b>Destrezza</b> X</p></span></td>
</tr>
<tr><th>Amministrazione</th>
<td>x</td>
</tr>
<tr><th>Intrigo</th>
<td>x</td>
</tr>
<tr><th>Conoscenze</th>
<td>x</td>
</tr>
</table></th><th><table>
<tr><th>Vita</th>
<td>x</td>
</tr>
<tr><th>Fertilità</th>
<td>x</td>
</tr>
<tr><th>Prestigio</th>
<td>0</td>
</tr>
<tr><th>Fama</th>
<td>0</td>
</tr>
<tr><th>Pietà</th>
<td>x</td>
</tr>
</table></th>
</tr>
</table><h2>Caratteristiche PG</h2><table>
<tr><th>Aspirazione</th>
<td>ASPIRAZIONE SCELTA</td>
</tr>
</table><h2>Tratti</h2> <table>
<tr class= "infocontainer"><th>Tratti Culturali</th>
<td></td>
<tr class= "infocontainer"><th>Tratti Educativi</th>
<td></td>
</tr>
</table>
<table>
<tr><th>Abilità</th>
<td>LISTA TRATTI ABILITA'</td>
<tr class= "infocontainer"><th>Competenze Diplomazia</th>
<td></td>
</tr>
<tr class= "infocontainer"><th>Competenze Marzialità</th>
<td></td>
</tr>
<tr class= "infocontainer"><th>Competenze Amministrazione</th>
<td></td>
</tr>
<tr class= "infocontainer"><th>Competenze Intrigo</th>
<td></td>
</tr>
<tr class= "infocontainer"><th>Competenze Conoscenze</th>
<td></td>
</tr>
</table>
<h2> Affinità </h2>
<table>
<tr class="infocontainer"><th>Affinità generiche</th><td>
<span>[IMG]immagine scelta[/IMG]<p>Valore affinità</p></span>
<i>(qui vanno inserite quelle culturali e religiose)</i></tr></td>
<tr class="infocontainer"><th>Affinità Casate</th><td>
<span>[IMG]immagine scelta[/IMG]<p>Valore affinità</p></span>
<i>(qui vanno inserite quelle con le Casate maggiori e minori)</i></td></tr>
<tr class="infocontainer"><th>Affinità pg specifiche</th><td>
<span>[IMG]immagine scelta[/IMG]<p>Valore affinità</p></span>
<i>(qui vanno inserite quelle con i pg)</i></tr></td>
<tr class="infocontainer"><th>Affinità png specifiche</th><td>
<span>[IMG]immagine scelta[/IMG]<p>Valore affinità</p></span>
<i>(qui vanno inserite quelle con i png)</i></td></tr>
</table>
<h2>Inventario</h2><table>
<tr><th>Soldi</th>
<td>3 Cervi d'argento, 5 stelle di rame o 30 dragoni (Credito Lord)</td>
</tr>
<tr class="infocontainer"><th>Equipaggiamento</th>
<td></td>
</tr>
<tr class="infocontainer"><th>Oggetti</th>
<td></td>
</tr>
</table><h2>Aspetto Fisico</h2><div class="pgtextbox">x</div>
<h2>Aspetto Psicologico</h2><div class="pgtextbox">x</div>
<h2>Storia</h2><div class="pgtextbox">x</div></div></div>
Edited by Rhi'Hesh - 12/4/2020, 16:05. -
.
Come modificare la scheda base
Premesse
Quella che vedremo sarà una trattazione generale e unificata delle modalità. Questo sarà possibile perché tratti, competenze, equipaggiamento, oggetti (e anche affinità) condividono la stessa struttura. Per questo motivo, vedremo dapprima la procedura generica, per poi entrare nel particolare dei casi con alcuni esempi. Questo tutorial sarà inoltre valido per l'attuale modello della scheda. Eventuali modifiche in futuro potrebbero invalidare completamente o in parte quello che verrà trattato nei prossimi paragrafi.
Osservazioni Preliminari
La vostra scheda si compone di blocchetti in codice HTML, penso sia chiaro a chiunque. Questi piccoli blocchi indicano al browser, tramite il quale navigate, come visualizzare la scheda e tutte queste istruzioni sono racchiuse tramite i simboli < e >. Insomma è in questi blocchetti che è contenuta la magia. Immaginiamo di creare qualcosa di molto minimale, giusto per farci un'idea di come funziona. Il codice lo metto sotto spoiler:
SPOILER (clicca per visualizzare)HTML<div class="schedapg"><div class="info"><h2>Sezione Generica</h2><table>
<tr class="infocontainer">
<th>Contenitore Generico</th><td>LISTA ELEMENTI</td>
</tr>
</table></div></div>Sezione Generica
Contenitore Generico LISTA ELEMENTI Tralasciate gran parte del codice, ma concentratevi su un blocchetto in particolare: tutto ciò che è contenuto tra <tr class="infocontainer"> ... </tr> compresa tale dicitura. Mediante questo codice, viene comunicato al browser che in quel punto dev'essere costruito un contenitore con quel titolo (Contenitore Generico) e quegli elementi (Lista Elementi). E se questa è la parte di codice che aggiunge questo tipo di elementi, è facile intuire che per aggiungere un secondo contenitore, basti ricopiare lo stesso codice:
SPOILER (clicca per visualizzare)HTML<div class="schedapg"><div class="info"><h2>Sezione Generica</h2><table>
<tr class="infocontainer">
<th>Contenitore Generico</th><td>LISTA ELEMENTI</td>
</tr>
<tr class="infocontainer">
<th>Contenitore Generico</th><td>LISTA ELEMENTI</td>
</tr>
</table></div></div>Sezione Generica
Contenitore Generico LISTA ELEMENTI Contenitore Generico LISTA ELEMENTI Notate che non ho fatto altro che copiare la stessa parte di codice. Gli elementi andranno ricopiati al posto della Lista Elementi, come già fate per aggiungere un tratto, un oggetto o una competenza. Ora che avete visto come funziona, possiamo applicarlo a qualcosa di più concreto, come per l'appunto le nostre schede PG. Nell'esempio aggiungere una categoria per i Tratti, ma è chiaro che per gli oggetti, le competenze o le affinità, sarà molto simile. Cambierà solo il "posto" in cui andrete a inserire questa formula magica, ripresa da sopra (Le parti in maiuscolo sono quelle che dovrete modificare):
HTML<tr class="infocontainer">
<th>TITOLO CONTENITORE</th><td>LISTA ELEMENTI</td>
</tr>Esempio: Aggiungere una Categoria ai Tratti
Per quest'esempio utilizzerò i nuovi codici dei tratti, principalmente per la facilità di scrittura. Direi di iniziare. Immaginiamo di avere una scheda PG con un certo numero di tratti. Non vi mostrerò l'intera scheda, ma solo la parte che interessa a noi:
Dovreste vedere qualcosa di simile nella vostra scheda, se cercate il seguente blocco (Ometto le parti che dovete saltare con [...]):Tratti
Tratti SPOILER (clicca per visualizzare)HTML<div class="schedapg">[...]
<h2>Tratti</h2><table>
<tr class="infocontainer">
<th>Tratti</th><td>LISTA DEI VOSTRI TRATTI</td>
</tr>
</table> [...]
</div>
Mettiamo caso che io voglia creare una nuova categoria per dividere i miei tratti Fisici, da tutti gli altri. In questo caso, io aggiungerò la formula magica immediatamente dopo il blocco <tr class="infocontainer">...</tr>, ottenendo qualcosa del genere:SPOILER (clicca per visualizzare)HTML<div class="schedapg">[...]
<h2>Tratti</h2><table>
<tr class="infocontainer">
<th>Tratti</th><td><span class="trait" nome="Manipolatore"></span><span class="trait" nome="Studioso"></span><span class="trait" nome="Impudente"></span><span class="trait" nome="Ambizioso"></span><span class="trait" nome="Cicatrice"></span><span class="trait" nome="Ferita"></span></td>
</tr>
<tr class="infocontainer">
<th>TITOLO CONTENITORE</th><td>LISTA ELEMENTI</td>
</tr>
</table> [...]
</div>Tratti
Tratti TITOLO CONTENITORE LISTA ELEMENTI
Adesso non mi resta che decidere il nome della categoria e spostare i tratti desiderati nella nuova categoria, ovvero aggiungendo il codice che ci viene fornito all'interno della LISTA ELEMENTI:SPOILER (clicca per visualizzare)HTML<div class="schedapg">[...]
<h2>Tratti</h2><table>
<tr class="infocontainer">
<th>Tratti</th><td><span class="trait" nome="Manipolatore"></span><span class="trait" nome="Studioso"></span><span class="trait" nome="Impudente"></span><span class="trait" nome="Ambizioso"></span></td>
</tr>
<tr class="infocontainer">
<th>Fisici</th><td><span class="trait" nome="Cicatrice"></span><span class="trait" nome="Ferita"></span></td>
</tr>
</table> [...]
</div>
E qui abbiamo terminato. Il risultato finale è il seguente:Per aggiungere ulteriori categorie, basta ripetere l'operazione e ricopiare la formula magica tante volte quante sono le categorie che vogliamo aggiungere. La stessa procedura si applica per oggetti, equipaggiamento, competenze e affinità. L'unica cosa che dovrete fare è individuare la posizione di questi contenitori, cosa che fate implicitamente quando aggiungete un elemento che ottenete come ricompensa nelle vostre schede. In ognuno di questi, troverete la medesima struttura da modificare e le stesse cose da aggiungere. Vi lascio qualche indizio (se volete preservare il piacere della scoperta non aprite questo spoiler):Tratti
Tratti Fisici SPOILER (clicca per visualizzare)- Tratti, visto nell'esempio. Per la maggior parte delle schede basta cercare
Tratti
e quello che segue immediatamente sotto sarà il blocco interessato. In alcune schede i tratti sono contenuti nella sezione Caratteristiche PG, dunque ricercate questa e il corrispondente contenitore dei tratti (aggiungete i nuovi contenitori sotto di questo); - Competenze, solitamente nella sezione Caratteristiche PG, aspettatevi dunque di ricercarli nel blocco
Caratteristiche PG
; - Oggetti, ricercate la sezione Inventario;
- Affinità, omonima seziona.
Se avete dubbi, domande o perplessità, aprite un topic in sezione Domande e Risposte, o in alternativa scrivetemi direttamente. Buon game
. - Tratti, visto nell'esempio. Per la maggior parte delle schede basta cercare
CODICE SCHEDA PG |
