Una domanda agli esperti...
Partendo da una pagina HTML (index.html):
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" href="global.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="header">
<h1>Header</h1>
</div>
<div id="left">
<p>
Prova Header: speriamo un giorno riesca a capire come funziona Drupal.....
</p>
</div>
<div id="main">
<h2>Subheading</h2>
<p>
Prova Subeading: Il tempo passa e vedo semple piu' lontana la soluzione.....
</p>
</div>
<div id="footer">
Footer
</div>
</div>
</body>
</html>e il relativo CSS (global.css)
#container {
width: 90%;
margin: 10px auto;
background-color: #fff;
color: #333;
border: 1px solid gray;
line-height: 130%;
}
#header {
padding: .5em;
background-color: #ddd;
border-bottom: 1px solid gray;
}
#header h1 {
padding: 0;
margin: 0;
}
#sidebar-left {
float: left;
width: 160px;
margin: 0;
padding: 1em;
}
#main {
margin-left: 200px;
border-left: 1px solid gray;
padding: 1em;
max-width: 36em;
}
#footer {
clear: both;
margin: 0;
padding: .5em;
color: #333;
background-color: #ddd;
border-top: 1px solid gray;
}
#sidebar-left p {
margin: 0 0 1em 0;
}
#main h2 {
margin: 0 0 .5em 0;
}se voglio farlo digerire al PHPtemplate engine di drupal rinomino i due file (global.css e index.html) in page.tpl.php e style.css
e nella page sostituico come segue:
<html>
<<head>
<title><?php print $head_title ?></title>
<?php print $styles ?>
</head>
<body>
<div id="container">
<div id="header">
<h1><?php print $site_name ?></h1>
<?php print $header ?>
</div>
<?php if ($sidebar_left): ?>
<div id="sidebar-left">
<?php print $sidebar_left ?>
</div>
<?php endif; ?>
<div id="main">
<?php print $title ?>
<h2><?php print $title ?></h2>
<?php print $content ?>
</div>
<div id="footer">
<?php print $footer_message ?>
</div>
</div>
</body>
</html>DOMANDA: cos'altro devo fare per farlo riconoscere tra i temi di drupal per poi utilizzarlo?
Grazie
Premetto che ho guardato velocissimamente il codice php che hai postato quindi do per scontato sia corretto... per farlo riconoscere a drupal devi innanzitutto sapere su quale versione di Drupal vuoi farlo girare...
i temi per D5,basano tutto su un file template.php,dove vengono dichiarate region,override e funzioni particolari...
in D6 invece,le region e altre info come la versione,l'attivazione o meno di alcuni componenti,vengono dichiarati in un file nometema.info .. e a template.php spettano override e funzioni.
quindi in linea di massima un semplicissimo tema per drupal è composto da:
template.php
page.tpl
style.css
nometema.info (solo su D6)
Intanto parti dalla guida su d.org che ti da le basi per iniziare a capire com'è strutturato un tema drupal (piu semplice di quanto credi :) )..
poi puoi scaricarti temi semplici tipo il glossyblue,oppure lo zen,più complesso ma ricchissimo di documentazione...e cominciare a sezionare file per file,in modo da capire come vengono richiamate region funzioni ecc ecc...
Vedrai che in 1 oretta avrai già creato il tuo primo semplice tema per drupal...
Buon Theming...
Ciao morxe,
Grazie per la tua risposta.
Ho seguito il tuo consiglio e mi sono letto e tradotto la documantazione "drupal 6 theme guide" nel sito drupal.org.
Purtroppo non ho avuto molte risposte. La guida e' abbastanza generale (almeno per me). Si... ..piu' o meno s'intravede la strutura dei temi, ma nulla che chiarisca per bene come modificare gli elementi.
Ho impostato il file .info e cosi ora drupal mi ha riconosciuto il mio tema. Ma ovviamente i nodi sono parzialmente visibili nel layout ... ovvimente bisogna rettificare il codice.
Per es. se voglio spostare il box della ricerca al centro dell'header come faccio? Dove trovo i paramentri e come li posso impostare?
Se voglio impostare lo sfondo con un layout tutto nuovo come faccio?
Il reale contenuto delle variabili es content dove e' depositato?
Sicuramente non essendo un esperto tutto mi sembra complicato per questo volevo chiederti se potevi indicarmi qualcosa di piu' pratico e diretto.....purtroppo ho l'impressione che le info a riguardo sono talmente separate che tutto mi sembra dispersivo e non molto concludente .
Thanks in advance
Cosa intendi con "nodi parzialmente visibili"?
Il box di ricerca lo sposti semplicemente mettendo
<?php print $search_box; ?>dove più ti fa comodo nel page.tpl.phpLe variabili a disposizione in page.tpl.php dovresti trovarle nella theming guide, o, in alternativa, cercando page.tpl.php su drupal.org o su api.drupal.org.
$content visualizza il contenuti di un nodo così come viene salvato. Se hai usato CCK per aggiungere campi, $content obbedirà ai parametri impostati per la visualizzazione dei campi nella relativa pagina di amministrazione del tipo di contenuto.
Grazie Pinolo,
in dupral posso muovere i box solo nelle aree prestabilite:
Se voglio posizionare per es il box della ricerca in un punto diverso dai mensionati devo creare una nuova DIV ma il posizionamento a livello di codice es: top 80 px , left 32 px ecc.. dove lo devo impostare nel CSS o nel template?
Riguardo al content io intendevo: una volta che ho scritto lamia storia o il mio blog dove trovo il vero contenuto della variabile content?Dove trovo le frasi che ho scritto?
Non fare confusione. Quelli di cui parli nelle "aree prestabilite" (che in Drupal si chiamano "regioni") sono i blocchi.
Esiste un blocco con il motore di ricerca, ma puoi inserire anche un box di ricerca che è un'altra cosa, grazie alla variabile $search_box in page.tpl.php Se questa variabile sia disponibile o no, lo decidi nella configurazione dei temi (tra i checkbox disponibili).
Il posizionamento CSS lo puoi inserire indifferentemente nel template o nel CSS, anche se la logica e la "pulizia" consigliano di metterlo nel file CSS.
I contenuti del nodo salvato sono a disposizione di node.tpl.php, grazie alla variabile $content. Attenzione che nell'amministrazione del tipo di contenuti, alla tab "Visualizzazione campi", puoi anche decidere di escludere dalla visualizzazione dei campi, che in tal caso scompariranno da $content.
Se invece vuoi avere un accesso più diretto e personalizzato agli elementi del nodo, puoi provare a fare
<pre><?php print_r($node); ?>
</pre>
all'interno di node.tpl.php. In questo caso, buon divertimento... :)
le "aree prestabilite" sono dette "regions" e possono essere create a piacimento a patto che siano elencate nel file .info e che ovviamente sia presente una variabile nel template (page.tpl.php)
per una infarinata generale su queste e altre info:
http://drupal.org/node/313510
Certified to Rock
ciao bohz,
mi sono andato a leggere il materiale sul link da te consigliato. Seguendo le info e a titolo didattico mi sono ricostruito i files: info-page-css.
Il risultato non e' stato come speravo non e' stata creata la sidebar-sinistra, ne il resto. Come mai?
Tutto e' visualizzato in sequenza in una singola pagina....di seguito posto il codice:
Mi sapresti dire come si possono posizionare in uno specifico punto i div della page.tp.php? Grazie
css:
#sidebar-left,#main,
#sidebar-right {
float: left;
display: inline;
position: relative;
}
#sidebar-left,
#sidebar-right {
width: 20%;
}
body.one-sidebar #main {
width: 80%;
}
body.two-sidebars #main {
width: 60%;
}
body.sidebar-left #main-squeeze {
margin-left: 20px;
}
body.sidebar-right #main-squeeze {
margin-right: 20px;
}
body.two-sidebars #main-squeeze {
margin: 0 20px;
}
page.tp.php
<head><title><?php print $head_title; ?></title>
<?php print $head; ?>
<?php print $styles; ?>
<?php print $scripts; ?>
</head>
<?php print $left; ?>
<?php print $right; ?>
<!--[menu]-->
<?php if ($primary_links): ?>
<div id="primary">
<?php print theme('links', $primary_links); ?>
</div> <!-- /#primary -->
<?php endif; ?>
<?php if ($secondary_links): ?>
<div id="secondary">
<?php print theme('links', $secondary_links); ?>
</div> <!-- /#secondary -->
<?php endif; ?>
<!--[content]-->
<?php if ($breadcrumb): ?><div id="breadcrumb"><?php print $breadcrumb; ?></div><?php endif; ?>
<?php if ($mission): ?><div id="mission"><?php print $mission; ?></div><?php endif; ?>
<div id="content">
<?php if ($title): ?><h1 class="title"><?php print $title; ?></h1><?php endif; ?>
<?php if ($tabs): ?><div class="tabs"><?php print $tabs; ?></div><?php endif; ?>
<?php if ($messages): print $messages; endif; ?>
<?php if ($help): print $help; endif; ?>
<?php print $content; ?>
</div>
<!--[footer]-->
<?php if ($footer_message || $footer) : ?>
<div id="footer-message">
<?php print $footer_message . $footer;?>
</div>
<?php endif; ?>
<!--[botom]-->
<?php print $closure; ?>
</body>
</html>
..le variabili non printano il layout, lo devi mettere tu insieme agli statement condizionali (in effetti non è esplicitato nella pagina cui facevo riferimento):
</head><?php if ($left): ?>
<div id="sidebar-left">
<?php print $left; ?>
</div>
<?php endif; ?>
<?php if ($right): ?>
<div id="sidebar-right">
<?php print $right; ?>
</div><?php endif; ?>
(...)
Certified to Rock
Grazie bohz ............ molto meglio.... solo un problemino con la linea del tab che si sovrappone al menu laterale.
Se volessi ridimensionare il
<div id="content">e spostarlo al centro del layout tutto spostato a destra come va configurato il codice nel CSS?hai dimenticato
<div id="main">tra<!--[menu]-->e<!--[footer]-->attenzione che in questo modo tiri via dal flusso del documento le sidebars e #main, e ti ritrovi #footer-message sopra a tutto.
Se posso permettermi un consiglio, perchè non inizi modificando uno starter theme come http://drupal.org/project/zen ?
è molto più istruttivo ed eviti il 99% dei problemi di compatibilità cross-browser et al
Certified to Rock