Creazione di testo fittizio in WordPress

Quando si sviluppa un nuovo sito WordPress, spesso si desidera aggiungere del testo fittizio ai propri post e pagine in modo da poter vedere come sarà il sito prima della pubblicazione del contenuto. In questo tutorial, imparerai come velocizzare questo processo sviluppando un plugin che genera un testo fittizio per te.

Il plug-in che creerai aggiungerà un pulsante all'editor WYSIWYG che, una volta fatto clic, aprirà una finestra e chiederà il numero di paragrafi di testo fittizio da creare. L'utente inserirà un numero e il contenuto verrà inserito!

Si prega di notare che questo plugin utilizza la libreria TinyMCE 4.0, che è stata recentemente integrata in WordPress 3.9, il che significa che questo plugin funziona solo in 3.9 e più recenti.

Inizializzazione del plugin

Passo 1

Per iniziare, crea una nuova cartella in wp-content / plugins directory del tuo sito e dargli un titolo. In questo tutorial userò "dummy-text-generator" come titolo, anche se come userete i collegamenti relativi all'interno dei file del plugin, questo potrebbe essere qualsiasi cosa.

Passo 2

Successivamente, aggiungi un nuovo file PHP nella tua nuova directory con il titolo della tua directory, seguito dal file .php estensione. Per esempio, dummy-text-generator.php.

Passaggio 3

Ora devi notificare a WordPress che hai aggiunto un nuovo plug-in al tuo sito e, per fare ciò, devi aggiungere il seguente codice all'inizio del tuo nuovo file.

Semplicemente, questo testo dice a WordPress come viene chiamato il tuo plugin, cosa fa, il suo numero di versione, l'autore e altro. Questa informazione può essere vista nell'amministratore di WordPress, nella pagina Plugin.
Passaggio 4
Dovresti anche creare una nuova directory all'interno della cartella del tuo plugin, chiamata js e creare un nuovo file chiamato TinyMCE-plugin.js. Ne avrai bisogno in seguito, ma per ora, lascia vuoto.
Passaggio 5
Il passaggio finale è attivare il nuovo plug-in, che può essere eseguito tramite plugin pagina nel back-end del tuo sito. Una volta attivato il plugin, sei pronto per passare alla codifica del plugin stesso.
Aggiungere le funzioni
Questo plugin utilizza alcune funzioni principali: una per controllare il tipo di post e includere la funzionalità del plug-in su un post o una pagina, una per aggiungere un pulsante all'editor WYSIWYG, una per includere il file JavaScript necessario per il funzionamento del plugin e uno inizializza le azioni del pulsante.
Passo 1
La prima funzione che dobbiamo includere è quella di verificare che tipo di post abbiamo a che fare, e dire a WordPress che se si tratta di un post o di una pagina, il plugin dovrebbe iniziare a fare il suo lavoro.
Questa funzione aggiunge anche il pulsante all'editor. Questo può essere ottenuto con il seguente codice e dovrebbe essere aggiunto direttamente dopo le nostre informazioni di intestazione.
add_action ('admin_head', 'add_tinymce_dummytext'); function add_tinymce_dummytext () global $ typenow; // solo su Post Type: post e page if (! in_array ($ typenow, array ('post', 'page'))) return;  add_filter ('mce_external_plugins', 'add_tinymce_dummytext_plugin'); // Aggiungi alla riga 1 di WP TinyMCE add_filter ('mce_buttons', 'add_tinymce_dummytext_button'); 
Passo 2
La seconda funzione chiama il file JavaScript che hai creato in precedenza e dice al plugin dove può essere trovato.
// include la funzione js per tinymce add_tinymce_dummytext_plugin ($ plugin_array) $ plugin_array ['dummytext_plugin'] = plugins_url ('/js/tinymce-plugin.js', __FILE__); return $ plugin_array; 
Passaggio 3
La funzione finale che includerai inizializza il tuo nuovo pulsante fittizio di testo nell'editor WYSIWYG e poi dice di stamparlo sull'editor dei post.
// Aggiungi la chiave del pulsante per l'indirizzo tramite la funzione JS add_tinymce_dummytext_button ($ buttons) array_push ($ buttons, 'dummytext_button'); // Stampa tutti i pulsanti // var_dump (pulsanti $); ritorno $ pulsanti; 
Passaggio 4
Ora hai inizializzato tutte le funzioni e le azioni necessarie per il funzionamento del plug-in. Il tuo file PHP ora dovrebbe contenere le informazioni dell'intestazione e tutte e tre le funzioni che hai appena creato.
Generazione del testo fittizio
Il testo fittizio che creerai è nel file JavaScript che hai creato in precedenza, chiamato TinyMCE-plugin.js nel js elenco.
Passo 1
Iniziamo dicendo a WordPress che stiamo aggiungendo una funzione e che "dummyContent" è uguale a un paragrafo HTML contenente un testo fittizio "Lorem ipsum".
(function () dummyContent = '
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
';
Passo 2
Ora inizializzerai la funzione 'dummytext_plugin' nell'editor che hai creato precedentemente nel file PHP.
 tinymce.PluginManager.add ('dummytext_plugin', function (editor, url) 
Passaggio 3
Ora, dirai al plugin di inizializzare il pulsante per poter aggiungere il testo fittizio al post e definirne i campi e le proprietà.
// Aggiungi un pulsante che apre una finestra editor.addButton ('dummytext_button', text: 'Dummy Text Generator', icona: false, onclick: function () // Apri finestra editor.windowManager.open (title: ' Dummy Text Generator ', body: [type:' textbox ', nome:' number ', etichetta:' Number of Paragraphs '],
Passaggio 4
Diciamo al plug-in cosa fare se è inserito un numero non valido e per inserire il contenuto quando viene inviata l'informazione dal modulo della finestra.
 onsubmit: function (e) if (isNaN (e.data.number)) alert ('Prego inserire un numero valido'); return; // Inserisci il contenuto quando viene inviato il modulo della finestra (var i = 0; i < e.data.number; i++)  editor.insertContent( dummyContent );  
Passaggio 5
L'ultimo passo è quello di chiudere tutte le parentesi che sono state aperte durante la creazione del file JavaScript e, una volta fatto ciò, salvare le modifiche su entrambi i file PHP e JS.
 ); ); ); ) ();
Passaggio 6
Infine, il tuo file JavaScript assomiglierà a quello qui sotto, e ora puoi testare e divertirti usando il plugin che hai creato!
(function () dummyContent = '
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
'; tinymce.PluginManager.add ('dummytext_plugin', function (editor, url) // Aggiungi un pulsante che apre una finestra editor.addButton ('dummytext_button', text: 'Dummy Text Generator', icona: false, onclick: function () // Apri finestra editor.windowManager.open (title: 'Dummy Text Generator', corpo: [type: 'textbox', nome: 'number', etichetta: 'Number of Paragraphs'], onsubmit: function (e) if (isNaN (e.data.number)) alert ('Prego inserire un numero valido'); return; // Inserisci contenuto quando viene inviato il modulo finestra (var i = 0; i < e.data.number; i++)  editor.insertContent( dummyContent );    );   );  );  )();
In sintesi
Ecco fatto: ora hai realizzato con successo il tuo plugin di testo fittizio in WordPress usando PHP e JavaScript!
Se hai domande su questo plug-in, ti invitiamo a lasciare un commento qui sotto e sarò sicuro di ricambiarti.



		
			
	   
	




Codice