Mover widgets al tablón de anuncios
Tutorial de Javascript
Hola a todos, he visto que a muchos se les complica el javascript (¡Y es difícil!) por lo que les haré un mini tutorial interactivo, con el objetivo de que puedan realizar en widgets pedazos de su tablón de anuncios y desde allí controlarlos de manera sencilla sin estar tanto en el template. Esto les servirá tanto para mover el de últimos temas como para cualquiera que creen.
Nota: Recuerden haber puesto previamente en el css que no se vean los widgets (si los ponen todos en el izquierdo #left {display:none;} o pueden correrlos de sitio).
Nota 2: En este tutorial les enseñaré a reemplazar una cosa por la otra por lo que deberán tener en el template previamente un div que deba ser reemplazado.
Una vez aclarado todo, comencemos:
El javascript es como un conocido que te encentras en la calle. Lo primero es saludarlo:
- Hola ¿Qué onda?
► Se traduce como:
jQuery(document).ready(function(){
Pero como somos conocidos agregamos el nombre porque somos buena gente:
- ¿Cómo estás Perri?
► Que en javascript sería:
jQuery("NOMBRE DEL DIV NO OLVIDEN PONER ADELANTE UN PUNTO SI ES CLASS O UN # SI ES UN ID")
Además somos chismosos y le contamos algo que paso:
- ¿Te enteraste que ese cambio de novia?
.replaceWith(jQuery("NOMBRE DEL DIV QUE ENCIERRA A TU WIDGET"));
});
La conversación te queda como:
- Hola ¿Qué onda?
¿Cómo estás Perri? ¿Te enteraste que ese cambio de novia?
Que en javascript sería:
jQuery(document).ready(function(){
jQuery("NOMBRE DEL DIV").replaceWith(jQuery("NOMBRE DEL DIV QUE ENCIERRA A TU WIDGET"));
});
Pero ¿Dónde ponemos esto Apolo?
PANEL DE ADMINISTRACION → MÓDULOS → HTML & JAVASCRIPT → Gestión de los códigos Javascript
Ahí pones para Crear un nuevo javascript y lo pegas, si vas a mover más de uno podes usar el mismo. Recuerda ponerlos de acuerdo a si tu tablón estará solo en el índice o en todas las páginas, así como tenerlos activados.
¿Sencillo verdad? ¿Desean más clases simples de javascript? Déjenme en los comentarios si hay algo que les gustaría ver y si les sirvió este tutorial.