Sito di Artem Grebenyuk
Ho deciso di raccogliere tutte le questioni relative alla tematizzazione del mio sito in un unico tema.
Mi hanno mandato qui per un consiglio da Vkontakte.
Passiamo subito al sodo:
Sto tematizzando Drupal, ho creato Page.tpl.php senza problemi.
Ho avuto dei blocchi in Node.tpl.php
Quindi, ecco i dati:
Css
.node#wrapper{width:720px; margin:0 auto;}
.node#title{height:20px; width:720px; font-size:20px; font-family:Arial, Helvetica, sans-serif; color:#37B700;}
.node#title::first-letter{text-transform:uppercase}
.node#title a{color:#37B700; text-decoration:none;}
.node#title a:hover{color:#37B700; text-decoration:underline;}
.node#posttitle{height:10px; width:720px; font-size:9px; font-family:Arial, Helvetica, sans-serif; color:#AAA;}
.node#posttitle::first-letter{text-transform:uppercase}
.node#posttitle a{text-decoration:none}
.node#posttitle a:hover{text-decoration:underline}
.node#img{float:left; margin-right:5px;margin-bottom:5px; border:ridge 2px #CCC}
.node#comments{display:block; width:50px; height:60px; float:right; margin-left:5px; margin-bottom:5px; background:url(images/comment.png); font-family:Arial, Helvetica, sans-serif; color:#FFF; font-size:24px; text-decoration:none; text-align:center;}
.node#comments p{ margin-top:13px;}
.node#more{background-image:url(images/more.png);display: block;float: right;height: 28px;line-height: 24px;margin-left: 5px;font-family:Arial, Helvetica, sans-serif; color:#FFF; font-size:14px;text-decoration:none; text-align:center;width: 85px;}
.node#content{width:720px; font-family:Arial, Helvetica, sans-serif; font-size:12px; text-align:justify;}
.node#post{width:738px; height:8px; margin-left:-8px; background:url(../images/postnode.png); clear:both; margin-top:35px; background-repeat:repeat-x; margin-bottom:6px;}
.node#tagsnode{float:left; margin-top: 5px; font-family:Arial, Helvetica, sans-serif; font-size:12px;}
.node#tagsnode a{color:#37B700; text-decoration:none;}
.node#tagsnode a:hover{color:#37B700; text-decoration:underline;}
Html
<div class="node" id="wrapper"> <div class="node" id="title">testo semplice <a href="#">link</a></div> <div class="node" id="posttitle">testo semplice <a href="#">link</a></div> <hr width="100%" size="3"> <div class="node" id="img"><img src="logo.png" /></div> <a href="#" class="node" id="comments"><p>56</p></a> <div class="node" id="content">La rete mondiale è composta da milioni di server web situati in tutto il mondo. Un server web è un programma che viene eseguito su un computer connesso alla rete e utilizza il protocollo HTTP per la trasmissione dei dati. In forma più semplice, tale programma riceve una richiesta HTTP per una risorsa specifica, trova il file corrispondente sul disco rigido locale e lo invia attraverso la rete al computer richiedente. Server web più complessi sono in grado di distribuire dinamicamente le risorse in risposta a richieste HTTP. Per identificare le risorse (spesso file o parti di essi) nella rete mondiale vengono utilizzatori identificatori uniformi delle risorse URI (Uniform Resource Identifier). Per determinare la posizione delle risorse in rete si utilizzano localizzatori uniformi delle risorse URL (Uniform Resource Locator). Questi localizzatori URL combinano la tecnologia di identificazione URI e il sistema dei nomi di dominio DNS (Domain Name System) — il nome di dominio (o direttamente l'indirizzo IP in notazione numerica) fa parte dell'URL per indicare il computer (più precisamente — uno dei suoi interfacce di rete) che esegue il codice del server web necessario. Per visualizzare le informazioni ricevute dal server web, si utilizza un programma speciale sul computer client — il browser web. La funzione principale del browser web è quella di visualizzare il ipertesto. La rete mondiale è indissolubilmente legata ai concetti di ipertesto e hyperlink. Gran parte delle informazioni nel Web è proprio ipertesto. Per facilitare la creazione, memorizzazione e visualizzazione dell'ipertesto nella rete mondiale, si utilizza tradizionalmente il linguaggio HTML (HyperText Markup Language), un linguaggio di markup per l'ipertesto. Il lavoro di markup dell'ipertesto è chiamato impaginazione, e i maestri del markup sono chiamati webmaster o web master (senza trattino). Dopo il markup HTML, l'ipertesto risultante viene inserito in un file, tale file HTML è la risorsa principale della rete mondiale. Una volta che il file HTML diventa accessibile al server web, viene chiamato "pagina web". Un insieme di pagine web forma un sito web. Negli ipertesti delle pagine web vengono aggiunti hyperlink. Gli hyperlink aiutano gli utenti della rete mondiale a navigare facilmente tra le risorse (file) indipendentemente dal fatto che le risorse siano su un computer locale o su un server remoto. Gli hyperlink del web si basano sulla tecnologia URL.</div> <div><div class="node" id="tagsnode">Tag: <a href="#">Un tag</a>, <a href="#">Due tag</a>, <a href="#">Tre tag</a></div><a href="#" id="more" class="node">Maggiore dettagli</a></div> <div class="node" id="post"></div> </div>
Ecco come appare

Ora integrerò in Drupal: il Css è lo stesso, ma ecco il Node.tpl.php (non sono ancora arrivato al punto di visualizzare i commenti e tutto il resto)
<div class="node" id="wrapper"> <div class="node" id="title"><?php if ($page == 0): ?><a href="<?php print $node_url; ?>"><?php endif; ?><?php print $title ?><?php if ($page == 0): ?></a><?php endif; ?></div> <div class="node" id="posttitle"><?php print $submitted ?></div> <hr width="100%" size="3"> <?php if ($content[field_image]): ?> <div class="node" id="img"><?php print render($content['field_image'])?></div> <?php endif; ?> <a href="<?php print $node_url; ?>" class="node" id="comments"><p><?php print $comment_count ?></p></a> <div class="node" id="content"><?php print render($content['body'])?></div> <div><div class="node" id="tagsnode"><?php print render($content['field_tags']) ?></div><a href="<?php print $node_url; ?>" id="more" class="node">Ulteriori informazioni</a></div> <?php print render($content['comments']); ?> <div class="node" id="post"></div></div>
Ed ecco come appare sul sito

Quindi, domanda numero uno! Come posso eliminare i div aggiuntivi che causano questo margine?
Domanda numero due! Come fare affinché invece della parola "tags" ci sia la parola "tègi", disposti in riga e con una virgola dopo ciascuno?
P.s. Nei vostri riscontri vi prego di spiegare quali azioni vengono eseguite nel codice modificato, così da poter comprendere meglio simili problemi in futuro!
P.p.s. Durante la registrazione c'è un captcha carino, potete dirmi dove trovarlo?
P.p.p.s. Come posso tornare a scrivere testo normale dopo aver inserito il codice nel tema, dato che ho dovuto disattivare l'editor visuale e spostare i tag?
P.p.p.p.s. Amministratori, per favore correggete leggermente il campo "Salve, Login", mettete uno spazio dopo la virgola!
Distinti saluti, Grebenyuk Artem
- Accedi o registrati per poter commentare