Ulteriori configurazioni: Difference between revisions

From rejetto wiki
Jump to navigation Jump to search
m (Reverted edits by 195.8.8.1 (Talk); changed back to last version by Rejetto)
 
(48 intermediate revisions by 6 users not shown)
Line 1: Line 1:
===Editor HTML Editor e i Templates (Modelli)===
===HTML Editor ed i Templates (Modelli)===
-----
-----
'''Attenzione''': alcuni utenti hanno incontrato problemi a visualizzare, nel loro browser web,  i cambiamenti apportati. Questi malfunzionamenti possono, solitamente, essere risolti resettando la cache del browser (In molti sistemi è sufficiente utilizzare il tasto "F5").
'''Attenzione''': alcuni utenti hanno incontrato problemi a visualizzare, nel loro browser web,  i cambiamenti apportati.<br>Questi malfunzionamenti possono, solitamente, essere risolti resettando la cache del browser; (in molti sistemi è sufficiente utilizzare il tasto '''F5''' ).


Sebbene il modello predefini to di HFS template soddisfi in maniera completa la maggior parte degli utenti, è anche possibile effettuare delle variazioni che consentono di cambiare l'aspetto del tuo sito.<br>Puoi provare liberamente e senza problemi in quanto HFS è munito di una utility, presente nell'editor dei modelli e chiamata: "Restore default"  che permette il ripristino dei valori originale riferiti al template predefinito (default *.tpl) fornito da HFS al momento ella prima installazione.
Sebbene il modello predefinito di HFS soddisfi in maniera completa la maggior parte degli utenti, è anche possibile effettuare delle variazioni che consentono di cambiare l'aspetto del tuo sito.<br>Puoi provare liberamente e senza problemi in quanto HFS è munito di una utility, presente nell'editor dei modelli e chiamata '''''"Restore default"''''', che permette il ripristino dei valori originali del template predefinito (default *.tpl) fornito da HFS al momento della prima installazione.


For example, here is the basic look of the "example site" viewed in Firefox:
Di seguito, si può vedere l'aspetto di base di un  sito di esempio visualizzato con Firefox:


[[Image:064.png]]
[[Image:064.png]]


And here is the same site after applying a new template:
Nella figura successiva, lo stesso sito dopo aver apportato alcune variazioni al template originale (o averne inserito uno completamente nuovo):


[[Image:066.png]]
[[Image:066.png]]


(Note that the above pictures have been shrunk and truncated so that they are easy to view. In reality, the graph in the "black" template for example, displays (and works) perfectly.)
Considera che le figure sovrastanti sono state troncate e ridotte per consentirne una migliore visualizzazione. In realtà, il grafico di '''''"Server Status"''''' è visibile nella sua interezza (ed è anche perfettamente funzionante).


=====Modifying Templates=====
=====Cambio dei Templates=====
-----
-----


It is much easier to modify an existing template, rather than attempting to create one from scratch. You can find good examples of templates to use at the user [http://www.rejetto.com/forum/index.php?board=27.0 Forum] and at this [http://ledufe.no-ip.info:2222/HFS-templates site].
E' molto più facile modificare un modello esistente, piuttosto che crearne uno ex novo.<br>Puoi trovare ottimi esempi di templates da utilizzare nel [http://www.rejetto.com/forum/index.php?board=27.0 Forum] come pure in questo [http://ledufe.no-ip.info:2222/HFS-templates sito].


You should be aware that an HFS template ( a *.tpl file) contains the raw elements from which HFS builds the final HTML. Strictly speaking, it is not actually HTML, but you'll find that the HFS editor seamlessly handles verified HTML files from the above sites if you change the extension to *.tpl.
Il modello di HFS (un file con estensione *.tpl) contiene gli elementi da cui HFS costruisce l'HTML finale.<br>In senso stretto, un *.tpl non è un HTML vero e proprio, ma noterai che l'editor presente in HFS potrà usare i files prelevati dai siti succitati, sempre che tu sostituisca l'estensione *.htm o *.html con *.tpl.


Before starting, it is good practice to make a folder named "Templates" under your "HFS" folder. Eg. C:\HFS\Templates.
Prima di iniziare, sarà meglio creare una cartella denominata Templates nella tua cartella di  "HFS". Es. C:\HFS\Templates.


Follow this procedure to apply the "black" template illustrated above.
Segui questa procedura per inserire il modello denominato '''"black"'''.
# Download the file named "Beta Black Template v3.htm" from [http://ledufe.no-ip.info:2222/HFS-templates/ Templates], and copy (or move) it to "Templates". If necessary, rename this file to "Beta Black Template v3.tpl" (ie. change the file extension) so the HTML editor can recognize it.
# Effettua il download del file chiamato '''"Beta Black Template v3.htm"''' da [http://ledufe.no-ip.info:2222/HFS-templates/ Templates] e copialo (o muovilo) nella cartella Templates precedentemente creata.<br>Se necessario, rinomina il file in "Beta Black Template v3.tpl" (es. cambia l'estensione del file) così da permettere all'editor HTML di HFS di riconoscerlo.
# In HFS, select  "Edit HTML template" which opens the editor and automatically loads the current template (the default if you haven't made any changes).
# In HFS dal menù principale, seleziona la voce '''''"Edit HTML template"''''' .<br>Si aprirà l'editor che, automaticamente, caricherà il template corrente (quello di default se tu non hai apportato ancora alcuna modifica).
#Click "Import" and, if necessary, navigate to C:\HFS\Templates. Select "Beta Black Template v3.tpl" and click Ok.  
#Clicca '''''"Import"''''' e, se necessario, naviga verso C:\HFS\Templates. <br>Seleziona "Beta Black Template v3.tpl" e clicca Ok.  
#When the new template is loaded into the editor, click "Apply", and then "Ok" (to dismiss the editor).
#Quando il nuovo modello è stato caricato nell'editor, clicca su '''''"Apply"''''' e quindi su '''''"Ok"''''' (l'ultima azione chiude l'editor).
#In the HFS window, select root (/), right-click and  then click "Browse it" to see the effect of your changes. Remember to refresh the browser cache ("F5" on most systems), if necessary.
#Nella finestra di HFS, seleziona la radice del sito ((root (/)), clicca con il tasto destro del mouse e scegli il comando '''''"Browse it"''''' per visualizzare gli effetti delle modifiche che hai apportato.<br>Ricorda, se necessario, di aggiornare la cache del browser (tasto '''F5''' in molti sistemi).


====Changing Templates====
====Modifica dei Templates====
-----
-----


You may now choose to make some small changes to the template to see their effects. To do this:
Ora puoi inserire alcune piccole modifiche al template per variare il suo aspetto.<br>Per fare questo:


# In HFS, select  "Edit HTML template" which opens the editor and automatically loads the current template ("Beta Black Template v3.tpl" if you haven't made any changes).
# In HFS, seleziona ''''' "Edit HTML template"''''' per aprire l'editor che caricherà, in automatico, il modello corrente ("Beta Black Template v3.tpl" se non hai apportato alcuna modifica).
# Navigate to the style section of the template, and find this line: "<nowiki>body, .row { color: #000000 }</nowiki>"
# Trova (con''''' "find"''''') la sezione style section e cerca questa riga:<br> "<nowiki>body, .row { color: #000000 }</nowiki>"
# In HTML, colors are normally identified by their hex value. <br>"0D8BE9" represents a reasonably classic blue. Change the above line to this: "<nowiki>body, .row { color: #0D8BE9 }</nowiki>" and click "Apply".
# Nel codice HTML, i colori sono normalmente identificati con i loro valori hex. <br>"0D8BE9" rappresenta il classico colore blu.<br>Sostituisci la riga suddetta con questa: "<nowiki>body, .row { color: #0D8BE9 }</nowiki>" e clicca '''''"Apply"'''''.
# Go back to the main HFS window, select root (/), right-click and  then click "Browse it" to see the effect of your changes.
# ritorna alla finestra principale di HFS window, seleziona root (/), clicca con il tasto destro del mouse e seleziona l'opzione ''''' "Browse it"''''' per visualizzare gli effetti del tuo cambiamento.
# You'll notice that the entries in this part of the site are now displayed in blue. Remember to refresh the browser cache ("F5" on most systems), if necessary.
# Ora noterai che il colore riferito a questa parte del sito è blu.<br> Ricorda, se necessario, di aggiornare la cache del browser (tasto '''F5''' in molti sistemi).
# If you wish to keep this change permanent in the template, click "Ok" in the HTML editor. If you don't want to keep the change, click "Undo".
# Se desideri rendere permanenti queste variazioni del template, clicca '''''"Ok"''''' nell'editor HTML.<br>Se preferisci scartare i cambiamenti, clicca su '''''"Undo"'''''.
[[Image:067.png]]
[[Image:067.png]]


The above illustrates the principles of a method for safely editing an HTML template. The main alternative is to save ("Export") the different template versions as you apply and verify changes.
Le figure precedenti illustrano i principi del metodo per editare e salvare, con relativa sicurezza un modello HTML. Un'alternativa può essere quella di salvare, tramite la funzione '''''"Export"''''', le differenti versioni del template, man mano che tu inserisci delle modifiche.


====Background color====
====Colore di sfondo====
-----
-----


One of the most dramatic visual changes is to change the background color. This is controlled by this line in the style section:
Una delle variazioni più richieste è la variazione del colore di sfondo della pagina.<br>Questo aspetto è controllato da questa linea presente nella sezione style:<br>
body { margin:0; background-color:#51595B; padding:10px; color:#FFFFFF; }. Try changing the color value here to "#0D8BE9".
body { margin:0; background-color:#51595B; padding:10px; color:#FFFFFF; }.<br>Prova a sostituire il valore del colore con #0D8BE9".


[[Image:068.png|thumbnail|left|100px|]] <br>  
[[Image:068.png|thumbnail|left|100px|]] <br>  
Click to enlarge
Clicca per ingrandire
<br>  
<br>  
<br>  
<br>  
Line 59: Line 59:
<br>  
<br>  
<br><br>
<br><br>
Not everybody is familiar with hex color codes. You may care to download the free [http://www.veign.com/download_app.asp?app=107 Pixeur] application. This "pick" tool allows you to click anywhere on your screen and display the corresponding hex value (among other things).
Non tutti hanno famigliarità con il codice hex dei colori, perciò può essere utile scaricare l'applicazione gratuita [http://www.veign.com/download_app.asp?app=107 Pixeur].<br>Questo strumento consente, cliccando in qualsiasi parte della schermata, la visualizzazione del corrispondente valore hex per il colore considerato (e può svolgere moltre altre mansioni).


====Advanced example====
====Esempio di template avanzato====
-----
-----


The following illustration shows the template called "!!!ledufe.tpl".<br>
La seguente illustrazione visualizza il template chiamato '''"!!!ledufe.tpl"'''.<br>


[[Image:071.PNG|thumbnail|left|100px|]] <br>  
[[Image:071.PNG|thumbnail|left|100px|]] <br>  
Line 74: Line 74:
<br>
<br>
<br>
<br>
At first glance it may just look like a fairly clean variation of the default template, but it actually uses some very advanced features.<br>
Alla prima occhiata potrebbe sembrare una semplice variazione del tema di default, in realtà presenta alcune caratteristiche molto avanzate.<br>
If you click on the "Google" logo towards the bottom of the screen for example, your browser goes directly to the Google site where you can immediately perform Internet searches.<br>
Se, per esempio, clicchi sul logo di Google, posto nella parte inferiore della pagina, sarai reindirizzato alla home page del sito di Google dove potrai immediatamente effettuare ricerche su Internet.<br><br>
The central part of this webpage:
La parte centrale di questa pagina web:
* Shows whether you are logged into the "Hamachi" network, (and permits autologin if you're offline).
* Visualizza se sei loggato nella rete di Hamachi, consentendoti, inoltre, di accedere a questa qualora tu sia disconnesso.
* Allows you to invoke and sign-in to Skype messenger and use Skype phone.
* Ti consente di richiamare il VOIP di Skype, come pure di inserirti nel suo sistema di messaggistica.
* Lets you sign into Windows messenger.
* Ti consente di accedere a Windows messenger.
* Lets you access other Microsoft services.
* Ti consente di accedere ad altri servizi di Microsoft.


The toolbar across the top allows access to further features, including "Site" navigation, further "Hosted Sites", and to change the type of "CSS" that actually constructs this webpage within the HFS browser, a site "Search" box, and this:<br>
La barra degli strumenti, posta in alto e trasversalmente alla pagina, consente di usufruire di altre caratteristiche come: Navigazione del sito ('''"Site"'''), Siti ospitati ('''"Hosted Sites"'''), variazione del tipo di CSS ('''"CSS"''') che attualmente è presente in questa pagina, un box per effettuare ricerche nel sito ('''"Search"''') e questo:<br><br>
[[Image:072.png]]  
[[Image:072.png]]  
<br>
<br>
This lets you use a self-made set of "HFS Tools", manipulate your browser's bookmarks or "Favorites", and lets you stream music files to site visitors using your favorite MP3 player.
Questo ti consente di creare una raccolta personalizzata di '''strumenti per HFS''' o riordinare i tuoi '''segnalibri''' ed i '''Favoriti'''.<br>Permette, inoltre, ai visitatori del tuo sito di ascoltare brani musicali in streaming usando un player MP3 di tua scelta.


There are many examples of good templates, together with notes about their construction, in  the [[Template Examples]] Gallery.
Nella raccolta dei modelli ,denominata [[Template Examples]], esistono molti esempi di ottimi templates completi di note e spiegazioni circa la loro messa in uso.
 
=== Funzionamento di HFS come servizio di Windows ===
-----
Esistono molte buone ragioni per impostare HFS come servizio di Windows.<br>
Questo assicura che HFS:
 
* Parta prima del login e sia attivo, in modo continuativo, anche nel caso di sessioni multiple.
* Sia protetto da interruzzioni inattese o intenzionalmente provocate da altri.
* Possa essere riavviato automaticamente in caso di malfunzionamenti.
* Possa essere avviato ad un'ora specifica.
* Possa essere eseguito con specifici diritti e priorità dell'utente.
 
Esistono diversi metodi per ottenere questo.<br>Sotto XP, il sistema più semplice viene fornito dall'eseguibile di '''ledufe''' che puoi reperire al seguente indirizzo: [http://www.rejetto.com/forum/index.php?action=dlattach;topic=4084.0;attach=494 tray-icon utility].<br>
Il prerequisito per il corretto funziomento di questo programma, è la presenza nel tuo pc di Microsoft .NET Framework 2.0, liberamente disponibile all'indirizzo Microsoft: http://www.microsoft.com/downloads/details.aspx?familyid=0856eacb-4362-4b0d-8edd-aab15c5e04f5&displaylang=en
 
Estrai il file e inseriscilo in una cartella disponibile, per esempio: '''''''C:\HFS''''''' .<br>Lanciando ''''hfs2Service.exe'''' sarà visualizzabile una finestra come nella seguente figura:<br><br>
[[Image:087.png]]<br><br>
Nella cartella in cui hai inserito ''''hfs2Service.exe'''' esistono ora due nuovi files denominati rispettivamente '''''''HFS-Service.exe''''''' e '''''''HFS-Service.ini'''''''. <br><br>
Clicca su '''''"Create"''''' per installare il servizio e poi su '''''"Start"''''' <br>Verrà quindi visualizzato il messaggio di conferma '''''"RUNNING"''''' e l'icona di HFS sarà mostrata nell'area di notifica di Windows.<br>
In Xp è possibile verificare il corretto funzionamento andando in:<br>'''''"Impostazioni->Pannello di controllo->Strumenti di amministrazione->Servizi"'''''.<br><br>
[[Image:091.png]]

Latest revision as of 02:40, 9 November 2007

HTML Editor ed i Templates (Modelli)


Attenzione: alcuni utenti hanno incontrato problemi a visualizzare, nel loro browser web, i cambiamenti apportati.
Questi malfunzionamenti possono, solitamente, essere risolti resettando la cache del browser; (in molti sistemi è sufficiente utilizzare il tasto F5 ).

Sebbene il modello predefinito di HFS soddisfi in maniera completa la maggior parte degli utenti, è anche possibile effettuare delle variazioni che consentono di cambiare l'aspetto del tuo sito.
Puoi provare liberamente e senza problemi in quanto HFS è munito di una utility, presente nell'editor dei modelli e chiamata "Restore default", che permette il ripristino dei valori originali del template predefinito (default *.tpl) fornito da HFS al momento della prima installazione.

Di seguito, si può vedere l'aspetto di base di un sito di esempio visualizzato con Firefox:

Error creating thumbnail: Unable to save thumbnail to destination

Nella figura successiva, lo stesso sito dopo aver apportato alcune variazioni al template originale (o averne inserito uno completamente nuovo):

Error creating thumbnail: Unable to save thumbnail to destination

Considera che le figure sovrastanti sono state troncate e ridotte per consentirne una migliore visualizzazione. In realtà, il grafico di "Server Status" è visibile nella sua interezza (ed è anche perfettamente funzionante).

Cambio dei Templates

E' molto più facile modificare un modello esistente, piuttosto che crearne uno ex novo.
Puoi trovare ottimi esempi di templates da utilizzare nel Forum come pure in questo sito.

Il modello di HFS (un file con estensione *.tpl) contiene gli elementi da cui HFS costruisce l'HTML finale.
In senso stretto, un *.tpl non è un HTML vero e proprio, ma noterai che l'editor presente in HFS potrà usare i files prelevati dai siti succitati, sempre che tu sostituisca l'estensione *.htm o *.html con *.tpl.

Prima di iniziare, sarà meglio creare una cartella denominata Templates nella tua cartella di "HFS". Es. C:\HFS\Templates.

Segui questa procedura per inserire il modello denominato "black".

  1. Effettua il download del file chiamato "Beta Black Template v3.htm" da Templates e copialo (o muovilo) nella cartella Templates precedentemente creata.
    Se necessario, rinomina il file in "Beta Black Template v3.tpl" (es. cambia l'estensione del file) così da permettere all'editor HTML di HFS di riconoscerlo.
  2. In HFS dal menù principale, seleziona la voce "Edit HTML template" .
    Si aprirà l'editor che, automaticamente, caricherà il template corrente (quello di default se tu non hai apportato ancora alcuna modifica).
  3. Clicca "Import" e, se necessario, naviga verso C:\HFS\Templates.
    Seleziona "Beta Black Template v3.tpl" e clicca Ok.
  4. Quando il nuovo modello è stato caricato nell'editor, clicca su "Apply" e quindi su "Ok" (l'ultima azione chiude l'editor).
  5. Nella finestra di HFS, seleziona la radice del sito ((root (/)), clicca con il tasto destro del mouse e scegli il comando "Browse it" per visualizzare gli effetti delle modifiche che hai apportato.
    Ricorda, se necessario, di aggiornare la cache del browser (tasto F5 in molti sistemi).

Modifica dei Templates


Ora puoi inserire alcune piccole modifiche al template per variare il suo aspetto.
Per fare questo:

  1. In HFS, seleziona "Edit HTML template" per aprire l'editor che caricherà, in automatico, il modello corrente ("Beta Black Template v3.tpl" se non hai apportato alcuna modifica).
  2. Trova (con "find") la sezione style section e cerca questa riga:
    "body, .row { color: #000000 }"
  3. Nel codice HTML, i colori sono normalmente identificati con i loro valori hex.
    "0D8BE9" rappresenta il classico colore blu.
    Sostituisci la riga suddetta con questa: "body, .row { color: #0D8BE9 }" e clicca "Apply".
  4. ritorna alla finestra principale di HFS window, seleziona root (/), clicca con il tasto destro del mouse e seleziona l'opzione "Browse it" per visualizzare gli effetti del tuo cambiamento.
  5. Ora noterai che il colore riferito a questa parte del sito è blu.
    Ricorda, se necessario, di aggiornare la cache del browser (tasto F5 in molti sistemi).
  6. Se desideri rendere permanenti queste variazioni del template, clicca "Ok" nell'editor HTML.
    Se preferisci scartare i cambiamenti, clicca su "Undo".
Error creating thumbnail: Unable to save thumbnail to destination

Le figure precedenti illustrano i principi del metodo per editare e salvare, con relativa sicurezza un modello HTML. Un'alternativa può essere quella di salvare, tramite la funzione "Export", le differenti versioni del template, man mano che tu inserisci delle modifiche.

Colore di sfondo


Una delle variazioni più richieste è la variazione del colore di sfondo della pagina.
Questo aspetto è controllato da questa linea presente nella sezione style:
body { margin:0; background-color:#51595B; padding:10px; color:#FFFFFF; }.
Prova a sostituire il valore del colore con #0D8BE9".

Error creating thumbnail: Unable to save thumbnail to destination


Clicca per ingrandire





Non tutti hanno famigliarità con il codice hex dei colori, perciò può essere utile scaricare l'applicazione gratuita Pixeur.
Questo strumento consente, cliccando in qualsiasi parte della schermata, la visualizzazione del corrispondente valore hex per il colore considerato (e può svolgere moltre altre mansioni).

Esempio di template avanzato


La seguente illustrazione visualizza il template chiamato "!!!ledufe.tpl".

Error creating thumbnail: Unable to save thumbnail to destination








Alla prima occhiata potrebbe sembrare una semplice variazione del tema di default, in realtà presenta alcune caratteristiche molto avanzate.
Se, per esempio, clicchi sul logo di Google, posto nella parte inferiore della pagina, sarai reindirizzato alla home page del sito di Google dove potrai immediatamente effettuare ricerche su Internet.

La parte centrale di questa pagina web:

  • Visualizza se sei loggato nella rete di Hamachi, consentendoti, inoltre, di accedere a questa qualora tu sia disconnesso.
  • Ti consente di richiamare il VOIP di Skype, come pure di inserirti nel suo sistema di messaggistica.
  • Ti consente di accedere a Windows messenger.
  • Ti consente di accedere ad altri servizi di Microsoft.

La barra degli strumenti, posta in alto e trasversalmente alla pagina, consente di usufruire di altre caratteristiche come: Navigazione del sito ("Site"), Siti ospitati ("Hosted Sites"), variazione del tipo di CSS ("CSS") che attualmente è presente in questa pagina, un box per effettuare ricerche nel sito ("Search") e questo:

Error creating thumbnail: Unable to save thumbnail to destination


Questo ti consente di creare una raccolta personalizzata di strumenti per HFS o riordinare i tuoi segnalibri ed i Favoriti.
Permette, inoltre, ai visitatori del tuo sito di ascoltare brani musicali in streaming usando un player MP3 di tua scelta.

Nella raccolta dei modelli ,denominata Template Examples, esistono molti esempi di ottimi templates completi di note e spiegazioni circa la loro messa in uso.

Funzionamento di HFS come servizio di Windows


Esistono molte buone ragioni per impostare HFS come servizio di Windows.
Questo assicura che HFS:

  • Parta prima del login e sia attivo, in modo continuativo, anche nel caso di sessioni multiple.
  • Sia protetto da interruzzioni inattese o intenzionalmente provocate da altri.
  • Possa essere riavviato automaticamente in caso di malfunzionamenti.
  • Possa essere avviato ad un'ora specifica.
  • Possa essere eseguito con specifici diritti e priorità dell'utente.

Esistono diversi metodi per ottenere questo.
Sotto XP, il sistema più semplice viene fornito dall'eseguibile di ledufe che puoi reperire al seguente indirizzo: tray-icon utility.
Il prerequisito per il corretto funziomento di questo programma, è la presenza nel tuo pc di Microsoft .NET Framework 2.0, liberamente disponibile all'indirizzo Microsoft: http://www.microsoft.com/downloads/details.aspx?familyid=0856eacb-4362-4b0d-8edd-aab15c5e04f5&displaylang=en

Estrai il file e inseriscilo in una cartella disponibile, per esempio: ''C:\HFS'' .
Lanciando 'hfs2Service.exe' sarà visualizzabile una finestra come nella seguente figura:

Error creating thumbnail: Unable to save thumbnail to destination



Nella cartella in cui hai inserito 'hfs2Service.exe' esistono ora due nuovi files denominati rispettivamente ''HFS-Service.exe'' e ''HFS-Service.ini''.

Clicca su "Create" per installare il servizio e poi su "Start"
Verrà quindi visualizzato il messaggio di conferma "RUNNING" e l'icona di HFS sarà mostrata nell'area di notifica di Windows.
In Xp è possibile verificare il corretto funzionamento andando in:
"Impostazioni->Pannello di controllo->Strumenti di amministrazione->Servizi".

Error creating thumbnail: Unable to save thumbnail to destination