{"id":18848,"date":"2013-12-19T17:29:56","date_gmt":"2013-12-19T17:29:56","guid":{"rendered":"https:\/\/es.wordpress.org\/support\/topic\/anadir-javascript-en-mi-tema-de-wordpress\/"},"modified":"2016-08-06T00:23:01","modified_gmt":"2016-08-06T00:23:01","slug":"anadir-javascript-en-mi-tema-de-wordpress","status":"closed","type":"topic","link":"https:\/\/es.wordpress.org\/support\/topic\/anadir-javascript-en-mi-tema-de-wordpress\/","title":{"rendered":"A\u00f1adir javascript en mi tema de WordPress"},"content":{"rendered":"<p>Hola! estoy intentando a\u00f1adir en mi tema 3 javascripts internos y uno externo pero no funciona,<br \/>\nlos cargo en el archivo funtions.php de esta forma:<\/p>\n<pre><code>function load_scripts() {\n  wp_register_script( &#039;scrollto&#039;, get_template_directory_uri() . &#039;\/js\/jquery.scrollTo.js&#039;, array( &#039;scriptyouwillwaittobeloaded&#039; ) );\n  wp_enqueue_script( &#039;scrollto&#039; );\n\n    wp_register_script( &#039;scrolltomin&#039;, get_template_directory_uri() . &#039;\/jquery.scrollTo.min.js&#039;, array( &#039;scriptyouwillwaittobeloaded&#039; ) );\n  wp_enqueue_script( &#039;scrolltomin&#039; );\n\n  wp_register_script( &#039;serialscroll&#039;, get_template_directory_uri() . &#039;\/jquery.serialScroll&#039;, array( &#039;scriptyouwillwaittobeloaded&#039; ) );\n  wp_enqueue_script( &#039;serialscroll&#039; );\n}\n\nadd_action(&#039;wp_enqueue_scripts&#039;, &#039;load_scripts&#039;);\n\nfunction load_myscripts()\n{\nwp_register_script( &#039;my_script&#039;, &#039;http:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.3.1\/jquery.min.js&#039;);\nwp_enqueue_script(&#039;my_script&#039;);\n}\nadd_action(&#039;init&#039;, &#039;load_myscripts&#039;);<\/code><\/pre>\n<p>y en el head cargo el siguiente script<\/p>\n<pre><code>&lt;script type=&quot;text\/javascript&quot;&gt;\n\t\t\/\/ Easing equation, borrowed from jQuery easing plugin\n\t\t\/\/ http:\/\/gsgd.co.uk\/sandbox\/jquery\/easing\/\n\t\tjQuery.easing.easeOutQuart = function (x, t, b, c, d) {\n\t\t\treturn -c * ((t=t\/d-1)*t*t*t - 1) + b;\n\t\t};\n\n\t\tjQuery(function( $ ){\n\t\t\t\/**\n\t\t\t * Most jQuery.serialScroll&#039;s settings, actually belong to jQuery.ScrollTo, check it&#039;s demo for an example of each option.\n\t\t\t * @see http:\/\/flesler.demos.com\/jquery\/scrollTo\/\n\t\t\t * You can use EVERY single setting of jQuery.ScrollTo, in the settings hash you send to jQuery.serialScroll.\n\t\t\t *\/\n\n\t\t\t\/**\n\t\t\t * The plugin binds 6 events to the container to allow external manipulation.\n\t\t\t * prev, next, goto, start, stop and notify\n\t\t\t * You use them like this: $(your_container).trigger(&#039;next&#039;), $(your_container).trigger(&#039;goto&#039;, [5]) (0-based index).\n\t\t\t * If for some odd reason, the element already has any of these events bound, trigger it with the namespace.\n\t\t\t *\/\t\t\n\n\t\t\t\/**\n\t\t\t * IMPORTANT: this call to the plugin specifies ALL the settings (plus some of jQuery.ScrollTo)\n\t\t\t * This is done so you can see them. You DON&#039;T need to specify the commented ones.\n\t\t\t * A &#039;target&#039; is specified, that means that #screen is the context for target, prev, next and navigation.\n\t\t\t *\/\n\t\t\t$(&#039;#screen&#039;).serialScroll({\n\t\t\t\ttarget:&#039;#sections&#039;,\n\t\t\t\titems:&#039;li&#039;, \/\/ Selector to the items ( relative to the matched elements, &#039;#sections&#039; in this case )\n\t\t\t\tprev:&#039;img.prev&#039;,\/\/ Selector to the &#039;prev&#039; button (absolute!, meaning it&#039;s relative to the document)\n\t\t\t\tnext:&#039;img.next&#039;,\/\/ Selector to the &#039;next&#039; button (absolute too)\n\t\t\t\taxis:&#039;xy&#039;,\/\/ The default is &#039;y&#039; scroll on both ways\n\t\t\t\tnavigation:&#039;#navigation li a&#039;,\n\t\t\t\tduration:700,\/\/ Length of the animation (if you scroll 2 axes and use queue, then each axis take half this time)\n\t\t\t\tforce:true, \/\/ Force a scroll to the element specified by &#039;start&#039; (some browsers don&#039;t reset on refreshes)\n\n\t\t\t\t\/\/queue:false,\/\/ We scroll on both axes, scroll both at the same time.\n\t\t\t\t\/\/event:&#039;click&#039;,\/\/ On which event to react (click is the default, you probably won&#039;t need to specify it)\n\t\t\t\t\/\/stop:false,\/\/ Each click will stop any previous animations of the target. (false by default)\n\t\t\t\t\/\/lock:true, \/\/ Ignore events if already animating (true by default)\n\t\t\t\t\/\/start: 0, \/\/ On which element (index) to begin ( 0 is the default, redundant in this case )\n\t\t\t\t\/\/cycle:true,\/\/ Cycle endlessly ( constant velocity, true is the default )\n\t\t\t\t\/\/step:1, \/\/ How many items to scroll each time ( 1 is the default, no need to specify )\n\t\t\t\t\/\/jump:false, \/\/ If true, items become clickable (or w\/e &#039;event&#039; is, and when activated, the pane scrolls to them)\n\t\t\t\t\/\/lazy:false,\/\/ (default) if true, the plugin looks for the items on each event(allows AJAX or JS content, or reordering)\n\t\t\t\t\/\/interval:1000, \/\/ It&#039;s the number of milliseconds to automatically go to the next\n\t\t\t\t\/\/constant:true, \/\/ constant speed\n\n\t\t\t\tonBefore:function( e, elem, $pane, $items, pos ){\n\t\t\t\t\t\/**\n\t\t\t\t\t * &#039;this&#039; is the triggered element\n\t\t\t\t\t * e is the event object\n\t\t\t\t\t * elem is the element we&#039;ll be scrolling to\n\t\t\t\t\t * $pane is the element being scrolled\n\t\t\t\t\t * $items is the items collection at this moment\n\t\t\t\t\t * pos is the position of elem in the collection\n\t\t\t\t\t * if it returns false, the event will be ignored\n\t\t\t\t\t *\/\n\t\t\t\t\t \/\/those arguments with a $ are jqueryfied, elem isn&#039;t.\n\t\t\t\t\te.preventDefault();\n\t\t\t\t\tif( this.blur )\n\t\t\t\t\t\tthis.blur();\n\t\t\t\t},\n\t\t\t\tonAfter:function( elem ){\n\t\t\t\t\t\/\/&#039;this&#039; is the element being scrolled ($pane) not jqueryfied\n\t\t\t\t}\n\t\t\t});\n\n\t\t\t\/**\n\t\t\t * No need to have only one element in view, you can use it for slideshows or similar.\n\t\t\t * In this case, clicking the images, scrolls to them.\n\t\t\t * No target in this case, so the selectors are absolute.\n\t\t\t *\/\n\n\t\t\t$(&#039;#slideshow&#039;).serialScroll({\n\t\t\t\titems:&#039;li&#039;,\n\t\t\t\tprev:&#039;#screen2 a.prev&#039;,\n\t\t\t\tnext:&#039;#screen2 a.next&#039;,\n\t\t\t\toffset:-230, \/\/when scrolling to photo, stop 230 before reaching it (from the left)\n\t\t\t\tstart:1, \/\/as we are centering it, start at the 2nd\n\t\t\t\tduration:1200,\n\t\t\t\tforce:true,\n\t\t\t\tstop:true,\n\t\t\t\tlock:false,\n\t\t\t\tcycle:false, \/\/don&#039;t pull back once you reach the end\n\t\t\t\teasing:&#039;easeOutQuart&#039;, \/\/use this easing equation for a funny effect\n\t\t\t\tjump: true \/\/click on the images to scroll to them\n\t\t\t});\n\n\t\t\t\/**\n\t\t\t * The call below, is just to show that you are not restricted to prev\/next buttons\n\t\t\t * In this case, the plugin will react to a custom event on the container\n\t\t\t * You can trigger the event from the outside.\n\t\t\t *\/\n\n\t\t\tvar $news = $(&#039;#news-ticker&#039;);\/\/we&#039;ll re use it a lot, so better save it to a var.\n\t\t\t$news.serialScroll({\n\t\t\t\titems:&#039;div&#039;,\n\t\t\t\tduration:2000,\n\t\t\t\tforce:true,\n\t\t\t\taxis:&#039;y&#039;,\n\t\t\t\teasing:&#039;linear&#039;,\n\t\t\t\tlazy:true,\/\/ NOTE: it&#039;s set to true, meaning you can add\/remove\/reorder items and the changes are taken into account.\n\t\t\t\tinterval:1, \/\/ yeah! I now added auto-scrolling\n\t\t\t\tstep:2 \/\/ scroll 2 news each time\n\t\t\t});\t\n\n\t\t\t\/**\n\t\t\t * The following you don&#039;t need to see, is just for the &quot;Add 2 Items&quot; and &quot;Shuffle&quot;&quot; buttons\n\t\t\t * These exemplify the use of the option &#039;lazy&#039;.\n\t\t\t *\/\n\t\t\t$(&#039;#add-news&#039;).click(function(){\n\t\t\t\tvar\n\t\t\t\t\t$items = $news.find(&#039;div&#039;),\n\t\t\t\t\tnum = $items.length + 1;\n\n\t\t\t\t$items.slice(-2).clone().find(&#039;h4&#039;).each(function(i){\n\t\t\t\t\t$(this).text( &#039;News &#039; + (num + i) );\n\t\t\t\t}).end().appendTo($news);\n\t\t\t});\n\t\t\t$(&#039;#shuffle-news&#039;).click(function(){\/\/don&#039;t shuffle the first, don&#039;t wanna deal with css\n\t\t\t\tvar shuffled = $news.find(&#039;div&#039;).get().slice(1).sort(function(){\n\t\t\t\t\treturn Math.round(Math.random())-0.5;\/\/just a random number between -0.5 and 0.5\n\t\t\t\t});\n\t\t\t\t$(shuffled).appendTo($news);\/\/add them all reordered\n\t\t\t});\n\t\t});\n\t&lt;\/script&gt;<\/code><\/pre>\n<p>estoy intentando que me cargue en una p\u00e1gina donde tengo el html pero aunque carga bien los estilos no hace el efecto del javascript, alguien puede ayudarme?<br \/>\nno se si hay algun conflicto, tengo todos los plugin desactivados y el tema es el _S muchas gracias<\/p>\n","protected":false},"template":"","class_list":["post-18848","topic","type-topic","status-closed","hentry","topic-tag-js","topic-tag-javascript"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/18848","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic"}],"about":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/types\/topic"}],"version-history":[{"count":0,"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/topic\/18848\/revisions"}],"wp:attachment":[{"href":"https:\/\/es.wordpress.org\/support\/wp-json\/wp\/v2\/media?parent=18848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}