En esta serie, estamos trabajando en un complemento con el simple propósito de introducir un selector de fecha jQuery en el editor de publicaciones mediante un cuadro de meta de publicación y luego mostrarlo en el frente del sitio..
En lugar de hacer una serie extensa y detallada sobre un tema profundo en WordPress, el propósito de esta serie es centrarse en un tema muy específico..
En el primer artículo de la serie, logramos lo siguiente:
En este artículo, reanudaremos el trabajo implementando el Selector de fecha jQuery, almacenando la fecha en la publicación y luego preparando el complemento para su lanzamiento..
Ya hemos completado tres de los seis pasos necesarios para implementar nuestro complemento. Ahora es cuestión de incorporar todo el JavaScript necesario para mostrar el selector de color y recuperar los datos..
Pero gracias a WordPress, esto realmente no es tan difícil, ya que gran parte de lo que necesitamos ya está incluido con la aplicación principal..
Para implementar el selector de fechas de jQuery, necesitamos varias dependencias:
Primero, agregue la siguiente línea a su constructor:
add_action ('admin_enqueue_scripts', array ($ this, 'register_admin_scripts'));
A continuación, necesitamos definir realmente la función que pondrá en cola la biblioteca de jQuery date picker, así como nuestro propio archivo JavaScript personalizado..
Así que adelante y define register_admin_scripts
y la línea para incluir el selector de fecha jQuery:
/ ** * Registra y pone en cola el JavaScript específico del administrador. * * @version 1.0 * @since 1.0 * / public function register_admin_scripts () wp_enqueue_script ('jquery-ui-datepicker'); // finaliza register_admin_scripts
A continuación, introduzca un js directorio en su plugin y luego agregar una admin.js archivar en ese directorio.
El archivo debe contener el siguiente JavaScript:
(function ($) $ (function () // Marque para asegurarse de que exista el cuadro de entrada si (0 < $('#datepicker').length ) $('#datepicker').datepicker(); // end if ); (jQuery));
En pocas palabras, este archivo ejecutará el JavaScript para cada página en la que se cargue el tablero. Ahí es una forma alternativa de manejar esto, pero está fuera del alcance de este artículo.
En su lugar, tenemos nuestra comprobación de JavaScript para la existencia del elemento. Si existe, entonces aplica el selector de fechas
complemento al elemento.
Finalmente, necesitamos registrar la hoja de estilos del Selector de fecha jQuery con nuestro complemento. Para hacer esto, agregue la siguiente línea a su register_admin_styles
función:
wp_enqueue_style ('jquery-ui-datepicker', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/smoothness/jquery-ui.css');
En este punto, actualice el complemento y debería poder hacer clic en entrada
Elemento y ver algo como esto:
Bastante bien, ¿no? Observe que cuando selecciona una fecha, aplicará automáticamente la fecha al elemento de entrada. Si está interesado en personalizar aún más el formato de fecha (u otros aspectos del selector de fecha), asegúrese de revisar sus documentos API.
En este punto, estamos listos para mostrar la fecha en la publicación real. Para el propósito de nuestro complemento, vamos a estar prepagando esto al contenido.
Para hacer esto, defina el siguiente enlace en el constructor de su complemento:
add_action ('the_content', array ($ this, 'prepend_the_date'));
A continuación, necesitamos definir realmente la función. Aunque es muy simple. Compruébelo, luego lo explicaré después del fragmento de código:
/ ** * Guarda los datos de finalización del proyecto para la ID de entrada entrante. * * @param int La actual ID de publicación. * @version 1.0 * @since 1.0 * / public function prepend_the_date ($ content) // Si el meta de la publicación no está vacío para 'the_date', procesarlo en el contenido if (0! = ($ the_date = get_post_meta ( get_the_ID (), 'the_date', true))) $ content = ''. $ the_date. '
'. $ contenido; // termina si devuelve $ contenido; // finalizar prepend_the_date
En esta función, verificamos los metadatos de la publicación para la publicación actual. Dado que esta función se activa dentro del contexto de The Loop, podemos utilizar get_the_ID ()
.
Si la cadena de fecha, es decir, el metadatos de la entrada tecleado por la fecha
- no está vacío, lo envolveremos en una etiqueta de párrafo y lo añadiremos a la $ contenido
; de lo contrario, simplemente devolvemos el $ contenido
como están las cosas.
En este punto, solo quedan dos cosas por hacer:
Crear el archivo de localización es simple. Desde que definimos la plugin.po En el primer artículo, todo lo que tenemos que hacer es abrir el archivo con Poedit, hacer clic en 'Actualizar' y luego guardar el archivo. Esto generará un plugin.mo archivo en el lang directorio.
A continuación, necesitamos crear una Leer Archivo que sigue las convenciones de WordPress Readme. Aunque puedes ser tan creativo como quieras, he compartido el mío a continuación..
=== WordPress jQuery Date Picker === Colaboradores: tommcfarlin Tags: date, post Requiere al menos: 3.5 Probado hasta: 3.5.1 Tag estable: 1.0 Un complemento de muestra que se utiliza para demostrar cómo incluir jQuery Date Picker en el post editor. == Descripción == WordPress jQuery Date Picker es un complemento simple que se utiliza para demostrar cómo aprovechar los meta box personalizados, los metadatos y los complementos de jQuery para permitir a los usuarios seleccionar fechas para mostrar en sus publicaciones. == Instalación == = Usar el Panel de control de WordPress = 1. Navegue hasta el Panel de Complementos 'Agregar nuevo' 2. Seleccione 'wordpress-jquery-date-picker.zip' desde su computadora 3. Cargar 4. Active el complemento en WordPress Panel de control de complementos = Usar FTP = 1. Extraiga 'wordpress-jquery-date-picker.zip' a su computadora 2. Cargue el directorio 'wordpress-jquery-date-picker' en su directorio 'wp-content / plugins' 3. Active el complemento en el panel de Complementos de WordPress == Preguntas frecuentes == = En este momento, la fecha solo aparece en la parte superior de la publicación. ¿Puedo cambiar su posición? = No. == Registro de cambios == = 1.0 = * Lanzamiento inicial
Nada innovador - solo dice exactamente lo que hace.
Si aún no lo ha hecho, asegúrese de obtener la última versión del complemento de GitHub, lea los comentarios y siga la lectura para asegurarse de que comprende todo lo que está sucediendo en el complemento..
Y eso es todo, bastante fácil, ¿verdad??
Como de costumbre, deje sus comentarios y preguntas en el formulario de comentarios a continuación..