{"id":5772,"date":"2013-01-12T11:10:21","date_gmt":"2013-01-12T11:10:21","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=5772"},"modified":"2013-01-12T21:58:10","modified_gmt":"2013-01-12T21:58:10","slug":"anadir-basic-jquery-slider-plantilla-wordpress","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/","title":{"rendered":"A\u00f1adir Basic jQuery Slider a una plantilla WordPress"},"content":{"rendered":"<p>El objetivo principal de este art\u00edculo es observar la posibilidad que existe de a\u00f1adir scripts jQuery a tu WordPress sin necesidad de a\u00f1adir plugins extras que pueden hacer que tu p\u00e1gina vaya m\u00e1s lenta y que adm\u00e1s la mayor\u00eda no te acaban de satisfacer. Adem\u00e1s, vamos a ver como a\u00f1adir un slider en la p\u00e1gina principal de una plantilla WordPress utilizando esta metodolog\u00eda.<\/p>\n<p><a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/jquery-wordpress.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5773\" alt=\"jquery-wordpress\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/jquery-wordpress.jpg\" width=\"553\" height=\"174\" srcset=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/jquery-wordpress.jpg 553w, https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/jquery-wordpress-300x94.jpg 300w\" sizes=\"auto, (max-width: 553px) 100vw, 553px\" \/><\/a><\/p>\n<p>Desde que conoc\u00ed el plugin jQuery Basic Slider no he dejado de utilizarlo por su facilidad de instalaci\u00f3n, por su simplicidad de adaptaci\u00f3n y porque jam\u00e1s me ha generado problemas con otros plugins jQuery.<\/p>\n<p>Antes de leer este tutorial es necesario que est\u00e9s familiarizado con el plugin <a href=\"https:\/\/www.jose-aguilar.com\/blog\/basic-jquery-slider\/\" target=\"_blank\">jQuery Basic Slider<\/a>. Te dar\u00e1s cuenta que no es m\u00e1s que un simple slider como su nombre indica.<\/p>\n<p>Lo primero que tendremos que hacer es editar el archivo \u00abfunctions.php\u00bb a\u00f1adi\u00e9ndole la librer\u00eda jQuery de la siguiente forma:<\/p>\n<pre>function my_init_method() {\r\n\u00a0\u00a0 \u00a0if (!is_admin()) {\r\n\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0wp_deregister_script('jquery');\r\n\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0wp_register_script( 'jquery', '\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.8.3\/jquery.min.js');\r\n\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0wp_enqueue_script( 'jquery' );\r\n\u00a0\u00a0\u00a0 \u00a0}\r\n}\r\nadd_action('init', 'my_init_method');<\/pre>\n<p>En este caso estamos registrando una librer\u00eda minimizada de jQuery obtenida desde el servidor de google.<\/p>\n<p>Estamos condicionando la inclusi\u00f3n por el simple hecho de que en la administraci\u00f3n ya se utiliza jQuery y podr\u00eda dar conflicto.<\/p>\n<p>Ahora en el footer.php vamos a a\u00f1adir el plugin jQuery Basic Slider junto con su llamada, justo antes del cierre de la etiqueta &lt;\/body&gt;, como por ejemplo:<\/p>\n<pre>&lt;script type=\"text\/javascript\" src=\"&lt;?php bloginfo('template_url'); ?&gt;\/js\/basic-jquery-slider.js\"&gt;&lt;\/script&gt;\r\n&lt;script type=\"text\/javascript\"&gt;\r\n$(document).ready(function(){\u00a0\u00a0 \u00a0\r\n\u00a0\u00a0 \u00a0$('#slider').bjqs({\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'animation' : 'fade',\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'showControls': false,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'showMarkers' : false,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'centerMarkers' : false,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'useCaptions': true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'rotationSpeed': 5000,\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'width' : 940,\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'height' : 350\r\n\u00a0\u00a0\u00a0 });\r\n}); \r\n&lt;\/script&gt;<\/pre>\n<p>Ahora deber\u00edamos volver a editar el archivo functions.php estableciendo las dimensiones del slider, en este caso le vamos a asignar 940px de ancho y 350px de alto para ocupar todo el ancho de la p\u00e1gina.<\/p>\n<pre>add_theme_support('post-thumbnails');\r\nadd_image_size('homeslider', 940, 350, true);<\/pre>\n<p>Ahora para a\u00f1adirle un efecto m\u00e1s profesional ofreciendo m\u00e1s facilidades al cliente vamos a crear un nuevo item de men\u00fa en el panel de administraci\u00f3n mostrando el siguiente aspecto:<\/p>\n<p><a href=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/slider-menu.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5775\" alt=\"slider-menu\" src=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2013\/01\/slider-menu.png\" width=\"164\" height=\"263\" \/><\/a><\/p>\n<p>Este efecto lo podemos conseguir a\u00f1adiendo en el archivo \u00abfunctions.php\u00bb de la plantilla la siguiente funci\u00f3n:<\/p>\n<pre>function ts_post_type_slider() {\r\n\u00a0\u00a0 \u00a0register_post_type( 'slider',\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 array( \r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'label' =&gt; __('Slider', 'templatesquare'), \r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'public' =&gt; true, \r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'show_ui' =&gt; true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'show_in_nav_menus' =&gt; true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'rewrite' =&gt; true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'hierarchical' =&gt; true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'menu_position' =&gt; 5,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'exclude_from_search' =&gt;true,\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0'supports' =&gt; array(\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'title',\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0 'editor',\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'thumbnail',\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'excerpt',\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 'revisions')\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0) \r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0);\r\n\u00a0\u00a0 \u00a0register_taxonomy('category_slider', __('slider', 'templatesquare'),array('hierarchical' =&gt; true, 'label' =&gt;\u00a0 __('Slider Categories', 'templatesquare'), 'slidercat' =&gt; __('Category', 'templatesquare'))\r\n\u00a0\u00a0 \u00a0);\r\n}<\/pre>\n<p>Ahora podemos acceder a este nuevo apartado de administraci\u00f3n de sliders y podemos crear categor\u00edas de sliders y entradas (que representar\u00e1n items del slider) con su respectivo t\u00edtulo, contenido y una imagen que tenga como m\u00ednimo 940px de ancho por 350px alto. Esta imagen la deberemos marcar como destacada, no ser\u00e1 necesario que las insertemos en la entrada.<\/p>\n<p>Ahora tan solo tienes que maquetar en el index.php de la plantilla el slider. En el caso del ejemplo lo vamos a hacer de la siguiente forma:<\/p>\n<pre>&lt;div id=\"slider\"&gt;\r\n\u00a0\u00a0 \u00a0&lt;!-- start Basic Jquery Slider --&gt;\r\n\u00a0\u00a0\u00a0 &lt;ul class=\"bjqs\"&gt;\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0&lt;?php query_posts('post_type=slider&amp;category_slider=Home');\r\n\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0while (have_posts()): the_post(); ?&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0&lt;li&gt;\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0&lt;?php the_post_thumbnail('homeslider'); ?&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;div class=\"bjqs-info\"&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;div class=\"bjqs-html-caption\"&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;span class=\"bjqs-heading\"&gt;&lt;?php the_title(); ?&gt;&lt;\/span&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;span class=\"bjqs-linea\"&gt;&amp;nbsp;&lt;\/span&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;span class=\"bjqs-description\"&gt;&lt;?php the_content(); ?&gt;&lt;\/span&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;\/div&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;\/div&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;\/li&gt;\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 &lt;?php endwhile; wp_reset_query(); ?&gt;\r\n\u00a0\u00a0\u00a0 &lt;\/ul&gt;\r\n\u00a0\u00a0 \u00a0&lt;!-- end Basic jQuery Slider --&gt;\r\n&lt;\/div&gt;<\/pre>\n<p>Como puedes observar estamos utilizando la estructura de la maquetaci\u00f3n que trae el plugin Basic jQuery Slider pero iterando din\u00e1micamente los elementos de la lista desordenada obteniendo de la base de datos los posts de tipo slider que est\u00e1n asignados a la categor\u00eda que hemos creado previamente llamada \u00abhome\u00bb.<\/p>\n<p>Cada post estar\u00e1 compuesto por su imagen destacada teniendo las dimensiones que le hemos asignado 940x350px y hemos creado un contenedor dentro que estar\u00e1 posicionado por encima de la imagen flotando a la izquierda con posici\u00f3n absoluta. Si te fijas con m\u00e1s detalle, dentro del contenedor estamos mostrando tambi\u00e9n el t\u00edtulo del post y el contenido.<\/p>\n<p>Ahora solo falta ver los estilos de esta maquetaci\u00f3n que podr\u00edamos incluir dentro de la hoja de estilos de la plantilla.<\/p>\n<pre>.bjqs-info {\r\n\u00a0\u00a0\u00a0 background-image: url(\"\/wp-content\/themes\/YOUR_THEME\/images\/fondo_azul.png\");\r\n\u00a0\u00a0\u00a0 height: 290px;\r\n\u00a0\u00a0\u00a0 padding: 30px;\r\n\u00a0\u00a0\u00a0 position: absolute;\r\n\u00a0\u00a0\u00a0 top: 0;\r\n\u00a0\u00a0\u00a0 width: 290px;\r\n}\r\n.bjqs-html-caption {\r\n\u00a0\u00a0\u00a0 border: 1px solid #FFFFFF;\r\n\u00a0\u00a0\u00a0 float: left;\r\n\u00a0\u00a0\u00a0 height: 100%;\r\n\u00a0\u00a0\u00a0 width: 100%;\r\n}\r\n.bjqs-heading {\r\n\u00a0\u00a0\u00a0 clear: both;\r\n\u00a0\u00a0\u00a0 color: #FFFFFF;\r\n\u00a0\u00a0\u00a0 float: left;\r\n\u00a0\u00a0\u00a0 font-family: Georgia,\"Times New Roman\",Times,serif;\r\n\u00a0\u00a0\u00a0 font-size: 40px;\r\n\u00a0\u00a0\u00a0 padding-bottom: 10px;\r\n\u00a0\u00a0\u00a0 padding-top: 10px;\r\n\u00a0\u00a0\u00a0 text-align: center;\r\n\u00a0\u00a0\u00a0 width: 290px;\r\n}\r\n.bjqs-linea {\r\n\u00a0\u00a0\u00a0 background-color: #FFFFFF;\r\n\u00a0\u00a0\u00a0 clear: both;\r\n\u00a0\u00a0\u00a0 display: block;\r\n\u00a0\u00a0\u00a0 height: 2px;\r\n\u00a0\u00a0\u00a0 margin: 10px auto;\r\n\u00a0\u00a0\u00a0 width: 100px;\r\n}\r\n.bjqs-description {\r\n\u00a0\u00a0\u00a0 clear: both;\r\n\u00a0\u00a0\u00a0 color: #B1B0B1;\r\n\u00a0\u00a0\u00a0 float: left;\r\n\u00a0\u00a0\u00a0 font-family: Verdana,Geneva,sans-serif;\r\n\u00a0\u00a0\u00a0 font-size: 12px;\r\n\u00a0\u00a0\u00a0 padding: 0 15px;\r\n\u00a0\u00a0\u00a0 width: 260px;\r\n}<\/pre>\n<p>Igual que hemos podido incluir Basic jQuery Slider en una plantilla de WordPress, tambi\u00e9n podr\u00edamos a\u00f1adir cualquier plugin jQuery existente dando una potencialidad increible a tu plantilla WordPress.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>El objetivo principal de este art\u00edculo es observar la posibilidad que existe de a\u00f1adir scripts jQuery a tu WordPress sin necesidad de a\u00f1adir plugins extras que pueden hacer que tu p\u00e1gina vaya m\u00e1s lenta y que adm\u00e1s la mayor\u00eda no te acaban de satisfacer. Adem\u00e1s, vamos a ver como a\u00f1adir un slider en la p\u00e1gina [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":5354,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[32],"tags":[],"class_list":["post-5772","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog\" \/>\n<meta property=\"og:description\" content=\"El objetivo principal de este art\u00edculo es observar la posibilidad que existe de a\u00f1adir scripts jQuery a tu WordPress sin necesidad de a\u00f1adir plugins extras que pueden hacer que tu p\u00e1gina vaya m\u00e1s lenta y que adm\u00e1s la mayor\u00eda no te acaban de satisfacer. Adem\u00e1s, vamos a ver como a\u00f1adir un slider en la p\u00e1gina [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Jose Aguilar Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/joseaguilarblog\" \/>\n<meta property=\"article:published_time\" content=\"2013-01-12T11:10:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2013-01-12T21:58:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"320\" \/>\n\t<meta property=\"og:image:height\" content=\"320\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Jose Aguilar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:site\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jose Aguilar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/\",\"name\":\"A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png\",\"datePublished\":\"2013-01-12T11:10:21+00:00\",\"dateModified\":\"2013-01-12T21:58:10+00:00\",\"author\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png\",\"contentUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png\",\"width\":320,\"height\":320},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.jose-aguilar.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"A\u00f1adir Basic jQuery Slider a una plantilla WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/\",\"name\":\"Jose Aguilar Blog\",\"description\":\"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\",\"name\":\"Jose Aguilar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"caption\":\"Jose Aguilar\"},\"description\":\"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.\",\"sameAs\":[\"https:\/\/plus.google.com\/114357189801512615537\"],\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"es_ES","og_type":"article","og_title":"A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog","og_description":"El objetivo principal de este art\u00edculo es observar la posibilidad que existe de a\u00f1adir scripts jQuery a tu WordPress sin necesidad de a\u00f1adir plugins extras que pueden hacer que tu p\u00e1gina vaya m\u00e1s lenta y que adm\u00e1s la mayor\u00eda no te acaban de satisfacer. Adem\u00e1s, vamos a ver como a\u00f1adir un slider en la p\u00e1gina [&hellip;]","og_url":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/","og_site_name":"Jose Aguilar Blog","article_publisher":"https:\/\/www.facebook.com\/joseaguilarblog","article_published_time":"2013-01-12T11:10:21+00:00","article_modified_time":"2013-01-12T21:58:10+00:00","og_image":[{"width":320,"height":320,"url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png","type":"image\/png"}],"author":"Jose Aguilar","twitter_card":"summary_large_image","twitter_creator":"@JoseAguilarBlog","twitter_site":"@JoseAguilarBlog","twitter_misc":{"Escrito por":"Jose Aguilar","Tiempo de lectura":"5 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/","url":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/","name":"A\u00f1adir Basic jQuery Slider a una plantilla Wordpress - Jose Aguilar Blog","isPartOf":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png","datePublished":"2013-01-12T11:10:21+00:00","dateModified":"2013-01-12T21:58:10+00:00","author":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11"},"breadcrumb":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#primaryimage","url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png","contentUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/11\/wordpress1.png","width":320,"height":320},{"@type":"BreadcrumbList","@id":"https:\/\/www.jose-aguilar.com\/blog\/anadir-basic-jquery-slider-plantilla-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.jose-aguilar.com\/blog\/"},{"@type":"ListItem","position":2,"name":"A\u00f1adir Basic jQuery Slider a una plantilla WordPress"}]},{"@type":"WebSite","@id":"https:\/\/www.jose-aguilar.com\/blog\/#website","url":"https:\/\/www.jose-aguilar.com\/blog\/","name":"Jose Aguilar Blog","description":"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11","name":"Jose Aguilar","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","caption":"Jose Aguilar"},"description":"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.","sameAs":["https:\/\/plus.google.com\/114357189801512615537"],"url":"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/"}]}},"_links":{"self":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/5772","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/comments?post=5772"}],"version-history":[{"count":0,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/5772\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media\/5354"}],"wp:attachment":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media?parent=5772"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/categories?post=5772"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/tags?post=5772"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}