Feliz Navidad 2011

El Mejor Regalo de Navidad es una sonrisa.. X eso Aqui esta la Mia !!!

Feliz Navidad para todos nuestros Fans, Amigos, Clientes y todos los seres que aman.

Añadir script en entradas especificas

Nov 10, 2015   //   by Diseño Web Roger Soto   //   Blog, Programacion  //  No Comments

A pedido del publico, muchas veces queremos que un efecto o función se muestre solo en determinado post o page, pero este se carga en todas las pagina y post de nuestro wordpress comprometiendo los dichosos tiempos de carga, y esto muchas veces desanima de usar ciertos scripts.

Pero todo tienen solución ahora podemos usar un script en una pagina o post y que este no se cargue en ningún otra entrada, así el incremento de carga solo se daría en ese post o page especifico.

Para ello nos van a ayudar

wp_register_script
wp_enqueue_script
is_single()

Primero tenemos que saber el id de la página o entrada en la que queremos cargar el script, si no sabes cómo hacerlo sigue este link. Y ahora abrimos el témplate de la pagina o en el caso de una entrada seria el single.php donde queremos cargar nuestro script, en este caso el script que vamos a usar como muestra y a pedido del público es jrumble

En nuestro caso vamos a cargar el script en un post asi que abrimos nuestro single.php e ingresamos estas líneas de código
Si lo que quisiéramos seria de una página seria page.php o el nombre de la página customizada que estés usando.


if (is_single(1981)) { // 1981 es el id de la entrada reemplazalo por tu propio id
    wp_register_script( 'jrumble', get_template_directory_uri() . '/js/jquery.jrumble.1.3.min.js');
    wp_enqueue_script('jrumble'); // con estas lineas le
    wp_register_script( 'jspersonalizado', get_template_directory_uri() . '/js/js_personalizado.js');
    wp_enqueue_script('jspersonalizado');
}

Como han podido apreciar cargamos dos scripts uno el de jrumble y el otro las acciones que queremos realizar con jrumble que este caso seria las siguientes:


jQuery(document).ready(function(){

$('#demo20').jrumble();
var demoStart = function(){
	$('#demo20').trigger('startRumble');
	setTimeout(demoStop, 300);
};

var demoStop = function(){
	$('#demo20').trigger('stopRumble');
	setTimeout(demoStart, 300);
};

demoStart();
});

bueno ahora solo queda escribir el codigo en tu post que seria algo asi como esto


<div id="demo20" style="width: 180px;">
<img src="http://blog.rogersoto.com/wp-content/uploads/2015/11/latest.png" alt="latest" class="aligncenter size-full wp-image-1988" height="150" width="180">
</div>

latest

Si les gusto compartan denle like y hablen con sus colegas de esto sino les gusto igual compartan denle like y hablen con sus colegas de esto

Que opinas de esto?

Publicidad

Siguenos en Facebook

Siguenos en Google+

Youtube