En algunas ocasiones queremos hacer nuestras propias plantillas webs, usando WordPress y lenguaje PHP. El detalle que WordPress procesa de forma distintas loe eventos de javascript y sobre todo las cargas asíncronas. El uso de AJAX en tus páginas webs es posible más no es igual que antes.
En la programación habitual tendríamos que invocar la función de AJAX. Supongamos que estemos usando la librería JQuery, la cual recomiendo firmemente. En la vieja escuela utilizaríamos la siguiente sección de código.
<script type="text/javascript">
$("#buscar").click(function(){
s.ajax({
url:url,
cache:false,
success:function(html)
{
$(“div”).html(html)
}
})
});
</script>Con ese código hacíamos una carga de una página de manera asíncrona y sin problema alguno en WordPress es un poco más complejo, a menos que uses el plugin Script n style, el cual te permite incrustar código css. En este caso nos mantendremos con puro codigo, sin usar plugin.
Lo primero que vamos a hacer es ingresar al administrador de archivos de nuestro hosting o servidor. Estando aquí iremos wp-content >themes >carpeta de tu tema. Crea un respaldo del archivo functions.php. Lo primero que haremos es colocar estos códigos en nuestra plantilla.
function my_carga_js() {
wp_enqueue_script( 'my_js', get_theme_file_uri( 'js/prueba.js'), array('jquery') );
wp_localize_script( 'my_js', 'ajax_var', array(
'url' => admin_url( 'admin-ajax.php' ),
'nonce' => wp_create_nonce( 'my-ajax-nonce' ),
'action' => 'event-list'
) );
}
add_action( 'wp_enqueue_scripts', 'my_carga_js' );Estos códigos se encarga de enviarle una solicitud al fichero admin-ajax-php, para que proceda a ejecutar es script. Es necesario que tengas el archivo en la carpeta Js el archivo que estás especificando. Puedes encontrar la carpeta dentro de la carpeta asset de tu tema.
Luego solamente debes pegar estos código en el fichero functions.php, si ya lo respaldaste pégalo sin guardarlo:
function cargar_eventos() {
// Check for nonce security
$nonce = sanitize_text_field( $_POST['nonce'] );
if ( ! wp_verify_nonce( $nonce, 'my-ajax-nonce' ) ) {
die ( 'Busted!');
}
$args = array(
'post_type' => 'evento',
'meta_query' => array(
array(
'key' => 'destacado',
'value' => 1,
'compare' => '=',
),
),
);
$query = new WP_Query( $args );
if ( $query->have_posts() ) {
echo '<ul>';
while ($query->have_posts()) {
$query->the_post();
echo '<li>' . get_the_title() . '</li>';
}
echo '</ul>';
}
wp_die();
}
add_action( 'wp_ajax_nopriv_event-list', cargar_eventos' );
add_action( 'wp_ajax_event-list', ' cargar_eventos ' );Así podrás crear efecto dinámico, permitido tanto para personas que están logueadas como para las que no.
Espero que te haya servido, cualquier cosa contacta con nosotros ! ?
