Ouroboros

Questo è un approfondimento di un precedente snippet in cui creiamo le classi per evidenziare i collegamenti interni o esterni al sito.

Usando il PHP possiamo assegnare queste classi ai link automaticamente. Vediamo la funzione:

<?php
function getLinks($buffer) { preg_match_all("/<a[^>]*href=['\"]?([^\"'\s]*)[^>]*>.*<\/a>/i”,$buffer,$url); #1
$tot = sizeof($url[0]);
$p = array(”file”,”http”,”ftp”,”rss”); #2
for($i=0;$i<$tot;$i++) { #3
$href = $url[1][$i];
$string = $url[0][$i];
list($protocol,) = explode(”:”,$href,2); #4
#5
if (in_array($protocol,$p)) $class = “ext”; #6
else $class = “int”; #7
#8
if (strstr($string,”class=”)) $newlink = preg_replace(”/class=[\"']?([^\"']+)['\"]/i”,”class=\”$1 “.$class.”\”",$string); #8.1
else $newlink = preg_replace(”/(<a[^>]*)(>)(.*)/i”,”$1 class=\”{$class}\”$2$3”,$string); #8.2
$buffer = str_replace($string,$newlink,$buffer);
}
return $buffer;
}
?>

Esaminiamo meglio il codice:
1. Tramite la funzione preg_match_all() di PHP andiamo a salvare sull’array $url tutti i link che sono trovati nel buffer della nostra pagina.
2. In questo array ho messo tutti i possibili protocolli che indicano che il collegamento punta al di fuori del nostro sito (potete aggiungerne quanti ne volete).

3. Scorro l’array

4. Mi ricavo l’estenzione del link

5. Controllo se il protocollo del link è presente nell’array - del punto 3 - (e quindi esterno).

6-7. Assegno la classe al link a seconda della tipologia

8. Controllo se nella sorgente HTML del link c’è già l’attributo class;

8.1 L’attributo class è presente, aggiungo a quest’ultimo anche questa subclasse;

8.2 l’attributo class non è presente, l’aggiungo.

Fatto ciò, dobbiamo richiamare questa funzione tramite la funzione di PHP ob_start() ; Apriamo quindi la nostra pagina (main) e inseriamo:

ob_start("getLinks");

Ora aggiornate la vostra pagina, e se tutto va bene guardando la sorgente html noterete che in ogni link della pagina avrà l’attributo class uguale a int o ext magicamente;

Ovviamente ora stà a voi gestire come visualizzare i vostri link via CSS se non vi serve in un particolare box, ul o div il menu marcato come interno o esterno, basterà fare una cosa del genere:

CSS
a#int { color: red; }
a#ext { color: blue; }
a.simple {
color:yellow !important;
background-image: none !important; /* importante: è bene specificare il background-image per evitare di visualizzare l'icona */
}

index.html

<a href="index.html">locale #1</a>
<br />
<a href="#anchor">locale #2 (visualizzazione normale)</a>
<br />
<br />
<a href="http://www.linkesterno.tld">ext #1</a>
<br />
<a href="http://www.linkesterno.tld">ext #2 (visualizzazione normale)</a>

In questo modo escluderemo i link che hanno la classe simplelink dalla visualizzazione “avanzata”.

Spero di esser stato chiaro :P.
Alla prossima!