Permalink: esempio di utilizzo del plugin per lo slug (#slug #permalink #jQuery #plugin)

Come promesso nel post in cui presentavo la modifica per il plugin jQuery per lo slug, di seguito riporto un esempio di come utilizzo io il plugin.

Consideriamo che lavoro con tre file miei:

  1. jquery.slug.js (contenente il codice postato ieri)
  2. progetto.js (file utilizzato per la personalizzazione dello specifico progetto ed importato come ultimo file js all’interno della pagina)
  3. progetto.html (file del progetto)

Ovviamente jQuery… un giorno, magari, approfondirò su jQuery.

Il file progetto.js contiene una semplice riga:

$(function(){
	$("#inputTitolo").slug({ separate: "_" });
});

Il file progetto.html è così strutturato nella parte di body (tralascio tutto ciò che c’è prima, ovvero i richiami dei vari file nell’header, e vari eventuali fronzoli necessari – ad esempio il form).

<label for="inputTitolo">Titolo:</label>
<input type="text" id="inputTitolo" maxlength="255" />
<label for="campoSlug">Indirizzo:</label>
<div id="campoSlug"><span class="slug" /><input type="text" id="inputSlug" class="slug" /></div>

La modifica che ho effettuato allo script originale (jQuery slug plugin di Perry) prevede l’utilizzo di <span class=”slug /> prima del campo di input per comodità mia e per velocizzare la lavorazione (al momento mi serviva che fosse funzionale e funzionante… conoscete quick and dirty… :D?). Mi riprometto di reintrodurre l’automatismo in una prossima versione.

A questo punto è sufficiente copincollare l’esempio e farlo partire 😀

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...