Includere un file con PHP

Includere un file HTML figlio in un file HTML padre con PHP

Questo tipo di inclusione lato-server, permette la ripetizione di uno stralcio di codice in uno o più file padre.

Per includere lo stralcio di codice, utilizzeremo il costrutto include. L'unica accortezza che dovremo rispettare, sarà cambiare l'estensione del file padre in PHP. Il file padre si dovra chiamare ad esempio: example.php.

Vediamo il codice

<?php include("menu.htm"); ?>

Spieghiamo

Grazie al costrutto include possiamo inserire lo stralcio di codice contenuto in menu.htm all'intero del nostro file padre.
Ci sono da notare alcuni aspetti importanti affinché l'inclusione vada a buon fine:

1. l'url del file figlio è relativo rispetto al file padre. Il file riportato nell'esempio menu.htm si troverà nella stessa cartella del file padre.
2. Volendo possiamo inserire codice PHP nel file figlio, ma in questo caso dovremo rinominare il file da menu.htm a menu.php. Inoltre il codice PHP contenuto in menu.php dovrà essere aperto e chiuso con php.

Esempio di contenuto dinamico nel file menu.php:

<?php echo"Ciao"; ?>

In alcuni casi sarà possibile "forzare" l'inclusione con il costrutto require.

<?php require("menu.htm"); ?>

Esiste infine la possibilità di utilizzare il costrutto include_once o require_once, particolarmente utile in script complessi, per evitare l'inclusione multipla indesiderata

<?php include_once("menu.htm"); ?>
<?php require_once("menu.htm"); ?>

Includere file esterno con JavaScript

Includere un file HTML figlio in un file HTML padre con JavaScript

Le inclusioni sono comode per inserire uno stralcio di codice in più pagine, senza doverlo ripeterlo ogni volta uguale.

Esistono sostanzialmente due metodi per includere uno stralcio di codice esterno, in un file HTML: lato-server e lato-client. Quello che vediamo adesso è realizzato con JavaScript e appartiene alle inclusioni lato-client, cioè realizzate dal browser dell'utente.

Per includere lo stralcio di codice, che nell'esempio è un menù, abbiamo bisogno di:

1. Una pagina padre, che chiameremo example.htm 
2. Lo stralcio di codice da includere che scriveremo nel file che chiameremo menu.js

vediamo il codice della pagina padre example.htm

<!DOCTYPE HTML>
<html>
 <head>
  <script type="text/javascript" src="menu.js"></script>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Inclusione con JavaScript</title>
 </head>

 <body>

  <noscript>
   <strong>
    <p style="color:red;">Attenzione: per visualizzare correttamente questa pagina è necessario avere JavaScript attivato.</p>
   </strong>
  </noscript>

 <script type="text/javascript">
  document.write(inclusione);
 </script>

 </body>

</html>

e vediamo anche il codice del menù da includere nella pagina padre menu.js

inclusione="<ul><li><a href='home.htm'><span>Home</span></a></li><li><a href='prodotti.htm'><span>Prodotti</span></a><li><a href='chi.siamo.htm'><span>Chi siamo</span></a></li><li><a href='contatti.htm'><span>Contatti</span></a></li></ul>";

Spieghiamo:

Il primo codice di esempio è il file che chiameremo example.htm. È la nostra pagina padre, nella quale includeremo lo stralcio di codice.

Da notare il codice alla riga 4 che richiama il file esterno menu.js;

Il codice dalla riga 11 alla 15 serve per stampare un alert, nel caso in cui l'utente abbia JavaScript disabilitato sul browser;

Il codice dalla riga 17 alla 19 stampa il contenuto del file incluso;

Il secondo codice di esempio è il file che chiameremo menu.js.
Guardandolo bene ha una stranezza: è scritto tutto su una riga senza andare mai a capo...
Questo perché  la stringa che nell'esempio si chiama inclusione, non permette codice a capo.

Altra cosa che dovremo tenere a mente per evitare che il JavaScript generi un errore, è evitare l'utilizzo dei doppi apici ". Basterà utilizzare l'apice singolo '.

Ad esempio:

inclusione"<a href="http://www.example.com" title="Example">pippo</a>";

diventerà:

inclusione"<a href='http://www.example.com' title='Example'>pippo</a>";

oppure potrebbe diventare...:

inclusione"<a href=\"http://www.example.com\" title=\"Example\">pippo</a>";

Download

Per chiarezza è possibile scaricare i due file example.htm e menu.js (ZIP)

Includere un file con SSI

Includere un file HTML figlio in un file HTML padre, con SSI

Questo metodo di inclusione lato server, è molto utile quando si vuole utilizzare una parte di codice, ripetuto in più pagine di un sito internet, come ad esempio un menù, il logo in alto o gli indirizzi di solito in basso nella pagina.
Vediamo prima di tutto il codice:

<!--#include virtual="menu.htm"-->

Spieghiamo:

la sintassi del Server Side Include (SSI) è molto semplice: comando parametro e valore, dove valore è l'url del nostro spezzone di codice da includere.

Nell'esempio ho riportato l'url relativo riferito al menù che voglio inserire nella mia pagina. Se il menù si trovasse in una cartella chiamata INC l'esempio cambierebbe in:

<!--#include virtual="INC/menu.htm"-->

Nel file menu.htm non ci devono essere i tag strutturali della pagina HTML ma soltanto lo spezzone di codice da includere.

Un esempio completo di pagina padre e inclusione di spezzone potrebbe essere questo:

file padre example.shtml

<!DOCTYPE HTML>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Inclusione con SSI</title>
 </head><body>
  <p>Contenuto della pagina padre parte superiore della pagina</p>

  <!--#include virtual="menu.htm"-->

  <p>Contenuto della pagina padre parte inferiore della pagina</p>
 </body>
</html>

file figlio menu.htm

  <ul>
    <li><a href='#'><span>Home</span></a></li>
    <li><a href='#'><span>Prodotti</span></a>
    <li><a href='#'><span>Chi siamo</span></a></li>
    <li><a href='#'><span>Contatti</span></a></li>
  </ul>

Nota:

Affinché l'inclusione vada a buon fine dobbiamo rispettare due vincoli:

1. Il nostro server deve avere SSI attivato
2. La nostra pagina padre deve avere l'estensione shtml. Si dovrà chiamare ad esempio: example.shtml.
   Va invece bene qualsiasi estensione per il file figlio che può essere nominato, come riportato nell'esempio: menu.htm. Nel file figlio sarà possibile inserire solo codice HTML.

Includere un filmato flash

Vediamo come includere un filmato in Flash nella nostra pagina HTML

Diamo per scontato che il filmato sia già pronto per essere pubblicato sul web.
Significa che abbiamo già realizzato il nostro filmato con Flash, lo abbiamo salvato in formato .FLA e abbiamo già esportato il file che nell'esempio riportato sotto ho chiamato miofile.swf dove .SWF è il file compilato da visualizzare nella nostra pagina HTML.

Con questo semplice codice posso includere un file con estensione SWF in una pagina HTML

<p>
 <object 
  type="application/x-shockwave-flash" 
  data="http://www.example.com/miofile.swf" 
  width="800" 
  height="650">

 <param 
  name="movie" 
  value="http://www.example.com/miofile.swf "/>

 </object>
</p>

Spieghiamo:

Da notare che ho inserito <object...> all'interno di un tag paragrafo.
Questa accortezza serve solo a non "infastidire" il validatore, nel caso in cui utilizziamo un DTD Strict, altrimenti possiamo tranquillamente fare a meno del tag <p>.

In pratica se non utilizzo un DTD Strict potrò avere un codice validato anche cancellando la prima e l'ultima riga dell'esempio.

Consiglio:

Sarebbe meglio non scalare il filmato importato, questo per evitare che la grafica venga ricampionata dal browser. Per fare questo, basta realizzare il filmato flash direttamente delle dimensioni che verranno utilizzate nella pagina HTML.

Nell'esempio ho ipotizzato un filmato con width="800" ed height="650", in questo caso il foglio di lavoro del filmato flash dovrà essere creato base 800px e altezza 650px.