INDICE INTERNO
righe HTML da inserire all’inizio di ogni capitolo:
Indice
Etichetta da mettere col tag id
righe HTML da inserire alla fine di ogni capitolo:
Indice dei capitoli e delle pagine di altri argomenti
BOX
ALTRI MANUALI con indice interno: PDF, AUDIO, FILMATI CON SONORO, FORMATTAZIONE DEL TESTO
Codici formattazione testo sperimentati
Il testo che segue contiene 3 link diversi (conviene mettere in corsivo i link) e mettere un blanc ai lati del link per facilirtare il puntamento.
Il testo può mettersi sotto una foto usando il tag div (vedi avanti).
Può comparire su una sola riga evitando di spezzare il codice in più righe, i ritorni a capo della pagina html in questo caso sembra siano riprodotti nella visualizzazione:
eppure soffia ancora from
Centro Popolare Experia
on Vimeo.
riga intera:
eppure soffia ancora from Centro Popolare Experia on Vimeo .
uso di SPAN: consente di usare l’attributo style
testo dentro tag span
uso di div per mettere syle nelle scritte, ma anche attributi con altre funzioni come title.
NOTA:
il contenuto del TITLE compare sotto il cursore quando si passa sopra la riga di testo anche se non è un link o una immagine.
inizio CAPTION che racchiude il link a zshare.
Nota:
il tag Caption racchiude il link e l’immagine. Quando si usa questo tag l’attributo di allineamento dell’immagine è messo in caption e non dentro img usando l’attributo align=”alignnone”.
vi sono alcuni attributi non impiegati, ma pronti all’uso
fine esempio CAPTION
esempio di tag p con style
post con foto di lancio – testo interno al tag p
questo testo è fuori dal tag p
Testo interno al tag span per cercare di andare sotto l’immagine non ha funzionato. Ho messo NESSUNO come allineamento dell’immagine sovrastante. L’immagine resta allineata a sinistra come il default del testo
foto inserita dentro l’ancora per il lancio di un filmato.
NOTA 1:
l’URL del link al filmato è posto dentro il tag ancora href=”http: Dopo la chiusura della prima parte del tag ancora vi è inserita l’immagine su cui cliccare per andare al filmato, in pratica tutto quanto è inserito fra a e /a, sia un semplice testo, sia una immagine, costituisce il link.
Nota 2
In questo caso non si è usato il caption e quindi l’attributo per l’allineamento si mette dentro il tag img con class=”alignright”:
Il codice di embedding proposto da Vimeo non funziona perchè usa il tag iframe e WP lo cancella (vedi meglio alla fine), occorre quindi fare ricorso ad immagine di lancio, ricavabile dallo stesso filmato Vimeo.
Per ottenere il lancio di filmato a pieno schermo conviene estrarre l’ URL da mettere nel link della foto dai codici di embedding di Vimeo: usare il primo href, quello che contiene la parola player, esempio:
http://player.vimeo.com/video/21488906 anzichè il semplice indirizzo:
http://vimeoDOTcom/21488906
DOT evita qui che venga visualizzato il riquadro Vimeo (vedi le osservazioni sulla prova di embedding col solo indirizzo alla fine di questo post).
Nell’inserire questa immagine si è messo nel tag img l’attributo title: quello che si scrive in questo attributo viene visualizzato al passaggio del cursore sulla immagine (ma anche sui testi e sui link – vedi anche più avanti).
Questo testo è fuori dal tag p.
Nota:
Il tag p deve aprirsi sopra e chiudersi sotto la foto se si vuole che il testo della didascalia risalga alla stessa altezza della foto.
Se piace si può allineare il testo del paragrafo a fianco della foto a sinistra quando la foto è a sinistra, a destra quando è a destra.
segue il link dentro l’ancora a (ricordarsi di chiuderla con /a altrimenti scompare): queste parole sono un link: guarda il filmato
Con vimeo sembra non occorrano codici particolari per fare l’embedding, basta il solo indirizzo messo senza ancore o altro. Il filmato scorre dentro una finestra di 600 px: sembra una cosa molto semplice. Proviamo a vedere se resta stabile nei prossimi giorni
Ho provato senza successo ad arricchirlo inserendolo in un div e title che compaia sotto il cursore, ma non ha funzionato (vedi sotto il filmato) quello che segue è l’indirizzo del filmato che, in anteprima, viene visualizzato come immagine
fa un ritorno a capo completo e visualizza una riga lunga quanto tutto il frame. Ammette altri parametri, ma alcuni non sono accettati, per esempio size, altri li devo sperimentare.
Non è accettato
serve a creare una ritorno a capo con entrambi i lati liberi, sembra accettato, ma non con i parametri left , right che dovrebbe liberare solo il lato sinistro o destro
fissando la larghezza dello show a 800 pixel la freccina viene posta in alto a sx. Prima del printscreen conviene ingrandire la schermata con ctrl+
Nel video del nuovo singolo la ‘cantantessa’ indossa ………poichè l’immagina è larga 600 px, il testo compare sotto di essa, altrimenti comparirebbe a fianco
eventuale testo sopra l’immagine 02
testo posizionato sotto l’immagine con comando br clear all – se non viene cancellato da wordpress
02 – occhiello o sottotitolo e 3 modi per inserire i link a PDF in sito di file hosting
________________________________________________________________
Sono ragazzi del Liceo Spedalieri e del Principe Umberto e sono stati coinvolti dai loro insegnanti . Hanno apprezzato soprattutto il carattere insolito e
INSERIMENTO PDF CON HOSTING SU www.box.net
Inserimento con link nel testo ed apertura in finestra separata
La coppia di parole in grassetto e colore contiene il link titolo articolo Si fa come con qualsiasi link ad un sito. Occorre copiare il codice di link al file PDF depositato in Box.net
Inserimento con link in una icona di lancio in finestra separata
Una variante è quella di creare una icona di lancio creato col PrintScreen (si può usare sempre la stessa icona).
Le modalità sono le stesse di quelle usate per le immagini di lancio dei filmati o delle gallerie su Picasa
Inserimento embedded
una alternativa pesante è questa con i codici di embedding fornita da box.net : il caricamento richiede tempo e l’utente deve scoprire il pulsante in basso a destra per ingrandire la finestra. Si deve usare di rado. La larghezza della finestra si può modificare e porre uguale a 600 e l’altezza a 200.
Inserimento di slideshow su Picasa accanto a filmato su Youtube:
Si può fare solo con le immagini/icone di lancio, dopo averle generate nel post, ricavato l’ultima immagine col PrintScreen, caricate in varie di picasa, caricata nel post ed insritu l’URL link a Youtube. …
Con semplicità, senza pretese di eccellenza o di perfezionismo, quella di ieri sera, al numero 40 di via Crociferi, è stata una serata piacevole e partecipata.
Il paradosso più incredibile: questi docenti, svalutati, irrisi, marginalizzati, dimostrano di saper essere creativi, di avere ancora carisma e forza
Gallerie foto , filmato di apertura della serata, pagina Facebook dell’iniziativa
——————————————————————————
03 – Box interno con table e block
sullo stesso argomento:
con BLOCK
ENTRO TABLE con BLOCK senza numeri nel testo – il problema è che gli articoli più vecchi hanno il numero più alto, occorre a meno di non riportarli in ordine inverso
articoli su argo.catania.it
Inizio testo dopo tabella , ottenuto il wrap around del testo con con il comando align=right.
mettendo border=0 spariscono le linee che delimitano le colonne della tabella…
04 – Box interno con table e senza block, vari coloriblock
tentativo di avere dei link inseriti in un riquadro. ma il posizionamento della tabella riquadro nel frame non è risolto ben, devo studiare la parte che riguarda le tabelle e quella dei frame se accettati da wordpress
Sugli argomenti trattati leggi alcuni approfondimenti pubblicati su Argo:
!<— altri colori: grigio bgcolor=”silver” , grigio molto leggero BGCOLOR=”#F1EFE2″ , grigio pesante BGCOLOR=”#D4D0C8″ //–>
| ENTRO TABLE senza block – numeri nel titolo – articoli su argo.catania.it 01- Il dottor Stranamore a Sigonella |
Inizio testo dopo tabella , ottenuto il wrap arounsd del testo con con il comando align=right. mettendo border=0 spariscono le linee che delimitano le colonne della tabella.
RIPETO IL Testo
Inizio testo dopo tabella , ottenuto il wrap arounsd del testo con con il comando align=right. mettendo border=0 spariscono le linee che delimitano le colonne della tabella. Inizio testo dopo tabella , ottenuto il wrap arounsd del testo con con il comando align=right.
mettendo border=0 spariscono le linee che delimitano le colonne della tabella. Inizio testo dopo tabella , ottenuto il wrap arounsd del testo con con il comando align=right. mettendo border=0 spariscono le linee che delimitano le colonne della tabella.
SCHEDA interna con sfondo e testo colorato
1 – testo sottolineato con tag SPAN“.
##### Questa è l’ultima riga che sta sopra il BOX. E’ LA RIGA SOTTO LA QUALE SI INSERISCE IL CODICE HTML DEL BOX #####
BOX
testo centrato con i tag p style – testo interno al tag p
box di testo per Maria Grazia
Questo è testo generico dentro il box, ma non è inserito fra i 2 codici li delle liste. La lista può riprendere sotto il testo libero, basta rimettere i 2 codici li.
Il testo viene mostrato solo se segue un tag di lista o lo precede senza soluzione di righe vuote.
Questa riga di testo è la prima riga sotto il codice HTML del box e risale a fianco dell BOX ==== ==== == ===
Si esprimono perplessità sulla tensione di lavoro considerata per i fili utilizzati e si mette in guardia circa la possibilità che tutti i fili possano non lavorare allo stesso tasso, per le particolari situazioni in cui vengono a trovarsi sulla sella di appoggio sopra i piloni [ndr la flessione del cavo di sospensione, del diametro di 1,24 m, sulle selle di appoggio causa tensioni molto maggiori sui fili esterni del cavo ].
articoli correalti su argo.catania.it
17 gennaio 2011
I dubbi irrisolti (1)
I dubbi irrisolti (2)
Se gli articoli precedenti sono pochi si può usare questa veste grafica.
Nota 01:
le righe: “Il ponte che divide”; “17 gennaio 2011”; “I dubbi irrisolti…” etc, e tutto quel che segue sono scritte sotto il codice del box indice e fanno il wrap attorno ad esso (alla sua sinistra, inclusa l’immagine che segue.
E ANCORA: IL TESTO SCRITTO SOTTO IL CODICE DELL’IMMAGINE FA IL WRAP AROUND SU DI ESSA, ANZI FRA ESSA ED IL BOX L’INDICE.
. . .
Tutto rimodulato dal ministro Fitto che ha assegnato 4 miliardi al solo ponte sullo stretto (ma non doveva essere a totale carico dei privati?) e 2,5 miliardi a Regioni del Nord, mentre per le 29 opere cantierabili sono stati previsti 2,5 miliardi di fondi FAS (disponibili solo dal 2012) che comportano – però – un cofinanziamento regionale di pari importo (non previsto dalla nostra Regione).
torna all’indice generale
torna all’indice del Dossier Ponte
7 febbraio 2011
Non si conoscono i dettagli del progetto definitivo, ma pare confermi impostazioni tecniche e previsioni di spesa di quello preliminare. Diciamo che questo non ci rassicura per niente, perchè i problemi rimasti irrisolti erano ancora molti e notevoli. Abbiamo già detto dei dubbi espressi dall’ing Michetti e dal prof Calzona. Adesso proviamo a trattare altre argomentazioni.
.. .. ..
…….
….
torna all’indice
torna all’indice del Dossier Ponte
MINERALI DI SICILIA
Questo è un modo per creare una etichetta con un link dentro: inizia col comando a href e termina col comando /a e nel mezzo si mette come “stringa” di link un image src
Sugli argomenti trattati leggi alcuni approfondimenti pubblicati su Argo: Il dottor Stranamore a Sigonella, Muos, preoccupanti i dati ARPA, Bugie a microonde, Niscemi, tremila in piazza contro il MUOS, Sigonella si espande e Ciancio ci guadagna, Guerre stellari a Sigonella, Sigonella, il Grande Fratello
Inizio testo dopo tabella , cercare di fare fare il wrap arounsd con il comando align
tentativo di avere dei link inseriti in un riquadro.
ma il posizionamento della tabella riquadro nel frame non è risolto ben, devo studiare la parte che riguarda le tabelle e quella dei frame se accettati da wordpress
Sugli argomenti trattati leggi alcuni approfondimenti pubblicati su Argo:
articoli su Argo
Inizio testo dopo tabella , ottenuto il wrap arounsd del testo con con il comando align=right.
i comandi td width=5 creano delle colonne strette ai lati e, mettendo border=0 spariscono le linee che delimitano le colonne della tabella.Così si ottiene ai lati la distanza voluta dal testo del post.
TABLE03 – tabella con indice dinamico
SVUOTATA
torna all’indice da TABELLA DINAMICA
TABLE05 – 3 COLONNE X 6 LIVELLI
WIDGET01 – indirizzo del lettore
vengono allineati a sinistra:
non è possibile fare scorrere il testo ai lati
su tale lista si può usare il comando indenta – seconda icona dopo l’omega – anche ripetuto più volte, esempio
per indentare i testi semplici si usa il tag padding
QUesto esempio di codice risolve anche il problema dell’elenco degli Articoli correlati
di Giulio Bilotta – 5 Aprile 2009 – da Antimafia
All’interno del tag table vi sono questi comani di formattazione:
cellpadding varia l’interlinea dentro il riquadro del menù
cellspacing sembra aumentare sia la distanza di inizio della scritta sia l’interlinea
align per assegnare la posiszione della table nella pagina
tr tra i comandi tr e /tr è compresa una riga della tabella
td fra td e /td si mette il link e la relativa etichetta da visualizzare, con i soliti codici di formattazione e con l’eventuale rinvo ad aprire il link in altra pagina
larghezza tabella viene variata in funzione della lunghezza del testo dell’etichetta !! fino ad occupare tutto lo spazio della “pagina”. Quindi la lunghezza delle etichette va mantenuta artificialmente corta, eventualmente ripetendo il link in una secona riga
TOOLTIP01 – foto con legende on hover
testo da scrivere: didascalia lunga che compare quando si passa su una immagine. Si è ottenuta usando sempre la class big, ma mettendo il testo invece di src di una immagine. In pratica la class big fa in modo che venga visualizzato, insieme all’immagine small quanto contenuto entro lo span oppure entro img. Col doppio span si mantiene la linea della legenda lunga quanto la foto.
Occorre rendere parzialmente trasparente o opaco lo sfondo, ed ingrandire leggermente il font, o cambiarlo
testo da scrivere: didascalia lunga che compare quando si passa su una immagine. Si è ottenuta usando sempre la class big, ma mettendo il testo invece di src di una immagine. In pratica la class big fa in modo che venga visualizzato, insieme all’immagine small quanto contenuto entro lo span oppure entro img. Col doppio span si mantiene la linea della legenda lunga quanto la foto.
Occorre rendere parzialmente trasparente o opaco lo sfondo, ed ingrandire leggermente il font, o cambiarlo
articoli correalti su argo.catania.it
FORMATTAZIONE:testo sottolineato col comando span
FORMATTAZIONE: Testo colorato col tag span.
Lista formattata e indentata con lo stile di paragrafo p
In questo elenco di semplice testo il comando indent (l’icona dopo l’omega lo toglie, la successiva lo mette, anche sulle liste numerate) inserisce la formattazione di paragrafo (tag p): con il parametro padding che permette di variare l’indent a piacere(guarda l’html)
01 Immagini, album, slideshow: ImageShack – Bozza
01.01 – Immagini, gallerie, slideshow: IMAGESHACK
01.02 – Immagini, gallerie, slideshow: FLICKR – PICASA etc
01.03 – Slideshow musicale a pieno schermo con YOUTUBE
01.04 – modifica snippet PICASA
03.01 – Musica e parole: Widget musicali con grooveshark e Youtube (i gufi)
FORMATTAZIONE: Inserimento di una scheda col comando BLOCKQUOTE:
Ogni tag blockquote crea un scheda nested
- 00.00 – Grafica, video, gallerie, slideshow
- 1.00 formattazione testi
- 2.00 PDF
- 3.00 Tabelle
- 4.00 Link e riferimenti interattivi interni
- 5.00 musiche
- 6.00 frames
- 7.00 widgets
Si può fare un template con excel per inserire i codici ai titoli degli articoli, ma resta comunque una cosa da usare con parsimonia.
Non riesco a staccare l’inizio della riga dentro il riquadro: gli spazi iniziali immessi nella pagina HTML non vengono visualizzati, fors occorre un codice di harda space. In Visualizza sembra vengono immessi, ma poi spariscono e tutto torna senza spazio iniziale. Il fonte del menù viene ridotto in funzione della lunghezza della label, in modo che sia contenuta in una sola riga.
sono da risolvere diverse questioni: 1 – l’aspetto non è esattamente quello di Antimafia, forse per questo li si usa una doppia tabella; 2-lo sfondo sarebbe meglio se fosse bianco per distinguerlo dal resto
MECCANISMO PER PAGINA PRECEDENTE PAGINA SEGUENTE
Prec. – Pross.
vengono allineati a sinistra:
su tale lista si può usare il comando indenta – seconda icona dopo l’omega – anche ripetuto più volte, esempio
per indentare i testi semplici si usa il tag padding
All’interno del tag table vi sono questi comandi di formattazione:
cellpadding varia l’interlinea dentro il riquadro del menù
cellspacing sembra aumentare sia la distanza di inizio della scritta sia l’interlinea
align per assegnare la posiszione della table nella pagina
tr tra i comandi tr e /tr è compresa una riga della tabella
td fra td e /td si mette il link e la relativa etichetta da visualizzare, con i soliti codici di formattazione e con l’eventuale rinvo ad aprire il link in altra pagina
larghezza tabella viene variata in funzione della lunghezza del testo dell’etichetta !! fino ad occupare tutto lo spazio della “pagina”. Quindi la lunghezza delle etichette va mantenuta artificialmente corta, eventualmente ripetendo il link in una secona riga
+++++++++++++++++++++++++++++
