Uso de AJAX con PHP en su sitio web de WordPress con su propio complemento

En este artículo estamos hablando de Ajax con PHP para su sitio de WordPress. AJAX es una técnica de desarrollo web que ayuda a los usuarios a desarrollar aplicaciones interactivas en el sitio. Proporcionar a los usuarios una experiencia web más rápida y fluida. Permite a los usuarios realizar cambios o actualizar el contenido de la página web sin recarga o actualizar las páginas. Necesita conocer diferentes lenguajes de programación para trabajar con AJAX. ¿Qué es Ajax? Ajax significa “JavaScript Asincron y XML”. Como se mencionó anteriormente, se utiliza para crear aplicaciones web que sean divertidas, constantemente cambiantes e interactivas.
Algunos de los ejemplos populares de aplicaciones web desarrolladas con la ayuda de AJAX y tecnologías relacionadas son Google Maps, la búsqueda automática de Google, comentarios y apreciaciones en diferentes publicaciones en redes sociales y más. Las bases AJAX AJAX utilizan varios lenguajes de programación como JavaScript, HTML, CSS y XML desarrolla aplicaciones web y sitios web más rápidos y mejorados. Además de estos lenguajes de programación, para el desarrollo de aplicaciones web, también se utilizan AJAX con PHP y otros idiomas en el lado del servidor. Utiliza JavaScript para mostrar contenido, mientras que CSS ayuda a presentar y modelar el objeto de documento. A continuación, use XHTML para contenido.
En las aplicaciones web o páginas web tradicionales, la información cambia con el servidor de manera síncrona.Por otro lado, en aplicaciones web, que han sido diseñadas para usar AJAX, cuando un evento, como presionar un formulario, JavaScript crea una solicitud XMLHTTP y lo envía al servidor XML.El servidor procesa la demanda crea una respuesta en el lado del servidor y la devuelve al navegador.JavaScript luego procesa la respuesta, y el contenido en la pantalla actual se actualiza.Debido a que la recarga o las páginas refrescantes no son necesarias, los usuarios no estarán al tanto de la transferencia de información al servidor.
Las habilidades necesarias para trabajar con AJAX en WordPress, como se entiende en la discusión anterior, los usuarios necesitan las siguientes habilidades para usar AJAX correctamente. • Conocer lenguajes de programación como JavaScript, HTML y CSS • Conocer lenguajes del lado al lado, como PHP y otros • Bases XML o JSON AJAX beneficia las diferentes ventajas de AJAX se analizan a continuación • Casi apoyan todos los navegadores utilizados en los tiempos actuales • implica un tiempo de respuesta más rápido, lo que significa que una experiencia de usuario mejorada en velocidad y rendimiento • Las bibliotecas de código abierto de JavaScript, como Prototype, JQuey, etc. Tanto los usuarios, y el servidor, se guarda • Debido a que el servidor no está obligado a procesar muchos datos, ayuda a reducir el uso del ancho de la banda y a optimizar el funcionamiento de la red. • Como la solicitud XMLHTTP se utiliza para tomar datos, los usuarios pueden realizar múltiples tareas simultáneamente.
AJAX en WordPress Ajax se usa en la Backdow de WordPress, como resultado, cada vez que se realizan cambios en publicaciones o categorías, o cuando el modo Administrador, las actualizaciones se realizarán instantáneamente. Ajax se usa principalmente con jQuery en WordPress. El proceso en el que WordPress usa AJAX es el siguiente • Cuando se realiza una solicitud, pasa a través del archivo “Admin-AJAX.PHP” en la carpeta “WP-Admin”. • Estas solicitudes son necesarias para proporcionar al menos una pieza de datos, también llamada “acción” en general, utilizando el método “Get” o “Post”. • Esta acción pide al código en el archivo “admin-ajax.php” para crear dos ganchos, a saber, “wp_ajax_my_action” y “wp_ajax_nopriv_my_action”. “My_action” en estos ganchos indica el valor de la variable “Acción” del método “Get” o “Post”. • Si bien el primer gancho está destinado a las acciones tomadas por usuarios conectados, el segundo gancho está destinado exclusivamente a los usuarios desconectados. • Las funciones hoced deben planificarse para una degradación elegante, lo que garantiza que incluso si JavaScript está deshabilitado en los navegadores, los códigos continuarán funcionando.
Cree un complemento Ajax WordPress en esta sección, tomemos el ejemplo de un complemento básico de WordPress llamado “Post Like Counter”. Este complemento incluye las siguientes características: • Se actualiza instantáneamente en el front-end • Los usuarios autenticados pueden apreciar las publicaciones. • Si los usuarios desconectados intentan apreciar la publicación, aparecerá un mensaje de error en la pantalla. . Para crear un complemento, debe tomar los siguientes pasos. Los depósitos de complemento se pueden verificar para garantizar que el nombre propuesto del complemento no se use. Por lo general, los desarrolladores de complementos seleccionan el nombre de un complemento de acuerdo con la función que deben realizar. Paso 2: En el siguiente paso, se requiere un archivo PHP para crear utilizando el nombre del complemento seleccionado. Debido a que los usuarios que instalarán este complemento deberán colocar el archivo PHP en el directorio de complementos de WordPress “WP-Content/Plugins-” para su instalación, los complementos no pueden compartir el mismo nombre para los archivos PHP.
Por lo tanto, el nombre del archivo del complemento también debe ser exclusivo para evitar conflictos con otro complemento en el almacén. El nombre o el nombre de la empresa en prefijo se puede utilizar para crear un nombre único para el archivo PHP. Paso 3: Cabe señalar que el complemento de WordPress debe contener al menos un archivo PHP con JavaScript, CSS, idiomas y archivos de imagen. Si están presentes varios archivos, seleccione un nombre único para el directorio y un nombre favorito para el archivo PHP principal. Coloque todos los archivos de complemento en el directorio creado y solicite a los usuarios de complementos que carguen todo el directorio en el director “WP-Context/Plugins/”. La instalación de WordPress se puede configurar para cambiar el estándar “WP-Content/Plugins/” estándar ” Por lo tanto, debe usar Plugin_Dir_Patch () y Plugin_Url () o la ruta absoluta y las URL en su código PHP. Publicar plantilla del tema Después de la creación del complemento, debe encontrar la plantilla de publicación “single.php”. Se puede encontrar en el director raíz del tema activo. Se usa cuando se interroga una sola publicación; Donde alguien quiere colocar su complemento “Post Like Counter”. El archivo debe mantenerse abierto para la edición. Prepare la plantilla de trabajo lista para la llamada AJAX es necesario crear un enlace para que los usuarios puedan apreciar las publicaciones. Si los usuarios han activado JavaScript, pueden usar archivos JavaScript (que se crearán más adelante) o seguir el enlace directamente. Para este fin, ingrese el siguiente código en el archivo “singido.php”. Este código también se puede agregar a cualquiera de las partes de la plantilla contenida en el archivo “single.php”.
// La “apreciación” del valor del metal almacenará el número total de apreciaciones para una determinada publicación, mostrará 0 si es una cadena de meta, “apreciación”, verdadero);
$ me gusta = ($ me gusta == “”)? 0: $ me gusta;
? & gt;
Esta publicación tiene Apreciación
// Conectando al archivo admin-ajax.php. La verificación no está incluida para la seguridad adicional. Recuerde la clase “User_like” para clientes JS.
Id. ‘& Amp; nonce =’. $ Nonce);
echo ‘ id. ‘”href =”‘. $ enlace. “” & Gt; aprecio esta publicación “;
? & gt;
Al dirigirse a la llamada Ajax sin JavaScript haciendo clic en el enlace creado en el paso anterior, uno se redirigirá al script “Admin-AJAX.PHP”; Sin embargo, no encontrarán ningún resultado útil, porque la función no está creada para ejecutar la acción. Para crear la función en el archivo de complemento y agregarla a los ganchos creados por WordPress, ingrese el siguiente código.
& lt;? Deje esto de lado si ya está incluido en su archivo de complemento.
// Defina las acciones para los dos ganchos creados, primero para usuarios conectados y siguiente para usuarios desconectados
add_action (& quot; wp_ajax_my_user_like “,” my_user_like “);
add_action (& quot; wp_ajax_nopriv_my_user_like & quot;, “por favor_login”);
// Define la función que se activará para usuarios conectados
Función my_user_like () {
// verifica una capa de seguridad adicional, la función saldrá si falló (! Wp_verify_nonce ($ _request [' nonce '], & quot; my_use_like_nonce & quot;) {) {
salida (& quot; woof woof woof & quot;);
}
// tomar como_count para una publicación, configúrelo en 0 si está vacío, aumente en 1 cuando se registre un clic
$ como_count = get_post_meta ($ _ solicitud [& quot; post_id & quot;], & quot; me gusta & quot;, true);
$ como_count = ($ like_count == ‘)? 0: $ como_count;
$ New_like_count = $ like_count + 1;
// actualizar el valor ' apreciación ' Meta clave para la publicación especificada, crea nuevos metadatos para publicar si no
$ me gusta = update_post_meta ($ _ solicitud [& quot; post_id & quot;], & quot; agradecimiento & quot;, $ new_like_count);
// Si la acción anterior falla, el tipo de resultado se establece en ' error ' y como_count establecido en Old Value, si tiene éxito, actualizado a New_Like_Count
if ($ me gusta === falso) {
$ resultado [' type '] = & quot; Error & quot ;;
$ resultado [' como_count '] = $ como_count;
}
más {
$ resultado [' type '] = & quot; éxito & quot ;;
$ resultado [' como_count '] = $ new_like_count;
}
// Compruebe si la acción ha sido activada por AJAX Call. En caso afirmativo, el código JS se activará; de lo contrario, el usuario se redirige a la página de la publicación
If (?
$ result = json_encode ($ resultado);
Echo $ resultado;
}
más {
antet (& quot; ubicación: & quot ;. $ _ servidor [& quot; http_referer & quot;]);}
// No olvide terminar sus scripts con una función di () – muy importante
morir();
}
// Define la función de activación para usuarios desconectados
Función por favor_login () {
echo & quot; debe iniciar sesión para apreciar “;
morir();
}
Si todo va bien, cuando un usuario conectado hará clic en el enlace “Apreciar esta publicación”, el número de agradecimiento se actualizará automáticamente. Por otro lado, si JavaScript está deshabilitado, la página se actualizará mostrando el número actualizado de “Me gusta”.
Agregar soporte de JavaScript para agregar soporte de JavaScript puede aliviar las cosas. Para usar AJAX con PHP en WordPress, debe hacer cola la biblioteca JQuey con el archivo JavaScript personalizado del complemento. Para este propósito, escriba el siguiente código en el complemento. admin_url (‘admin-ajax.php’)));
// Ponga la biblioteca de jquey en la cola y el script que grabó anteriormente
wp_enqueue_script (‘jquey’);
wp_enqueue_script (‘liker_script’);
}

Entonces es necesario crear el archivo JavaScript “liker_script.js”, que se cargará en la carpeta raíz del complemento. El siguiente código se usa para crear el archivo “liker_script.js”.
JQuery (“. User_like”). Haga clic (Función (s) {
E. PreventDefault ();
post_id = jQuery (this) .attr (“data-pos_id”);
nonce = jQuery (this) .Attr (“Data-Nonce”);
JQuery.AJAX ({
Tipo: “Publicar”,
DataType: “JSON”,
URL: Myajax.AJAXURL,
Datos: {Acción: “my_user_like”, post_id: post_id, nonce: nonce},
Éxito: function (respuesta) {
if (respuesta.type == “éxito”) {
JQuery (“#like_counter”). Html (respuesta.ike_count);
}
más {
Alerta (“No se pudo agregar tu como”);
}
}
});
});
});
Cómo implementar AJAX en WordPress Los siguientes pasos ayudará a implementar AJAX con PHP en WordPress. Por ejemplo, supongamos que nuestro trabajo es mostrar las categorías en un menú desplegable y, haciendo clic en la “categoría principal”, los subcategores aparecerán en otra caída. Esta tarea se realizará con los siguientes pasos Paso 1: Seleccione “Categorías” en el lado izquierdo del tablero e ingrese los nombres de las categorías en el cuadro que aparece a la derecha e ingrese la categoría Slug a continuación. Si se crea la categoría principal, seleccione “Ninguno” o, si se crean subcategorías, seleccione la categoría principal de las opciones. Paso 2: En este paso, se creará una plantilla de WordPress en la que se implementará la funcionalidad AJAX. Abra un nuevo archivo PHP y guárdelo. Ingrese el siguiente código en la página creada.
En el código anterior, “Nombre de la plantilla: implementar AJAX”, es el nombre de la plantilla de WordPress, y las funciones “get_heada” y “get_footer ()” se usan para mostrar el contenido y el sótano de la página. En primer lugar, es necesario que el archivo de la biblioteca de jquey se incluya en la página, lo que ayudará a agregar AJAX. AJAX con PHP se puede usar cualquier biblioteca JavaScript o puede llamar a Ajax con Gross JavaScript. En el siguiente ejemplo, la biblioteca JavaScript jquey se usa para la implementación de AJAX. Paso 3: Agregue el archivo jQuery a la plantilla y llame a la función “wp_dropdown_categories” para que se puedan tomar las categorías principales en el querido menú.
#Content {ancho: car; Altura: 400px; borde: 50px;}
& lt;?
Paso 4: Escriba el código jQuery para obtener la ID de categoría principal que se selecciona. Envíelo al archivo “Functions.php” para obtener subcategorías bajo esa ID de padre seleccionada. Los resultados se pueden enviar de regreso a la página sin actualizarla. $ (Function () {
$ (‘#main_cat’). Change (function () {
Var $ maincat = $ (‘#main_cat’). Val ();
// llamadas AJAX
$ (“#sub_cat”). vacía ();
$ .AJAX ({
URL: “/wp-admin/admin-ajax.php”,
Tipo: ‘Post’,
Fecha: ‘Action = my_special_action & amp; main_catid =’ + $ maincat,
Éxito: función (resultados)
{
// alerta (resultados);
$ (“#sub_cat”). RemoveAtTR (“desactivado”);
$ (“#sub_cat”). append (resultados);
}
});
}
);
});
En este código anterior, el código se agrega al evento para cambiar las categorías principales con la ID “#main_cat”.
La función .val () ayuda a obtener el valor de la opción seleccionada del menú desplegable y almacenamiento en la variable “$ maincat” (“#sub_cat”). Vacía ();
La subcategoría del desplegable “#sub_cat” debe liberarse, si contiene algún valor anterior, antes de llamar a AJAX. La próxima línea de jQuey ayudará a llamar a las funciones de Ajax jquey. Verifique los parámetros de la función AJAX que proporciona en la sección a continuación.URL: “BlogInfo (‘wpurl’);? & Gt; /wp-admin/admin-ajax.php”,
Tipo: ‘Post’,
Para que AJAX funcione en WordPress, se utiliza el parámetro “URL”. Por lo tanto, las solicitudes se enviarán al archivo “Admin-AJAX.PHP”. Luego, se llamarán a los ganchos en el archivo “functions.php” para obtener los datos publicados que se han enviado a la URL: “/wp-admin/admin-ajax.php” para enviar los valores con la solicitud, El parámetro se usa datos ”. En este ejemplo, se utilizan dos argumentos con el parámetro de datos: acción y main_catid. Paso 5: En el archivo “functions.php”, el siguiente código se usa para conectar una acción.add_action (‘wp_ajax_my_special_actic’, ‘my_action_callback’); en esta acción anterior, el gancho tiene dos argumentos. En el primer argumento ‘wp_ajax_my_special_action’, ‘wp_ajax_’ es el valor que se envía junto con el parámetro de datos ‘acción’. En el segundo argumento “my_action_callback”, los datos se procesarán y los resultados se enviarán de regreso. Este gancho de acción anterior es para usuarios conectados. Para los usuarios desconectados, la siguiente acción se puede conectar (‘wp_ajax_nopriv_my_special_ction’, ‘my_action_callback’);
El código final después de agregar ganchos tanto para usuarios como para viceversa es el siguiente implement_ajax () {
if (isset ($ _ post [‘main_catid’]))
{
$ category = get_categories (‘child_of =’. $ _ post [‘main_catid’]. ‘& amp; hide_empty = 0’);
Foreach ($ categorías como $ cat) {
$ opción. = ‘Termin_id.’ “& gt; ‘;
$ opción. = $ cat- & gt; cat_name;
$ opción. = ‘(‘. $ cat- & gt; number_categorii. ‘)’;
$ opción. = ”;
}
Echo ‘sceGli …’. $ Opción;
morir();
} // termina si}
add_action (‘wp_ajax_my_special_ajax_call’, ‘implement_ajax’);
add_action (‘wp_ajax_nopriv_my_special_ajax_call’, ‘implement_ajax’); // para usuarios que no están autenticados.
Paso 6: En este paso, cree una nueva página en el tablero y asigne su plantilla.Después de cargar la página en el navegador, el primer desplegable con las categorías principales se cargará en ella.Debido a que el segundo desplegable está vacío, seleccione la opción en el primer desplegable para verificar cómo funciona.Por lo tanto, AJAX con PHP se puede usar en el sitio web de WordPress con la ayuda de un complemento recién creado.