Como adicionar corretamente o javascript em funções.php
-
-
Isso é louco: vocênãopodeeditar asflechasno código que osgera?(Ou ébaixado de umafonteexterna?) Em qualquer caso,vocêpodefazer as duas substituições de uma únicafunçãoparaevitar lere escrevertodos os html dentro dobloco de carrinho duas vezes.Não sei umamaneira deinjetar diretamenteissonapágina dofunctions.php,mas vocêpode salvá-loem um arquivo de script separado (se você aindanãotiver um,vocêpode adicioná-lo)e,em seguida,[`wp-enqueue-Script`] (http://codex.wordpress.org/function_reference/wp_enqueue_script).Vocêtambémterá quemudar o `$ 's a`jquery' (vejaessapágina Seção 7)That's crazy: can't you edit the arrows out in the code that generates them? (Or is it downloaded from an external source?) In any case you can do both replaces in a single function to avoid reading and writing all the HTML inside the cart block twice. I don't know a way to directly inject that into the page from functions.php but you can save it in a separate script file (if you don't already have one you can add it to) and then [`wp-enqueue-script`](http://codex.wordpress.org/Function_Reference/wp_enqueue_script) it. You'll also have to change the `$`s to `jQuery` (see that page section 7)
- 0
- 2014-06-25
- Rup
-
Não,tenho certeza quenãopode ser removido antes deinserir.Sepuder,nãofui capaz deencontrar umamaneira defazerisso. Bomponto sobre adicioná-loem uma únicafunção.Pareceria assim? $ (documento) .REady (função () { $ (". Wooocommerce-carrinho"). HTML (função (i,val) { voltar val.replace ("→",""); voltar val.replace ("←" "," "); }); }); Eu vou olharpara o roteiro de Enqueue.Parece umpouco complicado,embora. Obrigado!Nope, I'm pretty sure it can't be removed before inserted. If it can, I haven't been able to find a way to do it. Good point about adding it in a single function. Would it look like this? $(document).ready(function() { $(".woocommerce-cart").html(function(i, val) { return val.replace(" →", ""); return val.replace("← ", ""); }); }); I will look into the enqueue script. Seems a bit complicated, though.. Thanks!
- 0
- 2014-06-25
- user2806026
-
OK.Eutentei essa abordagem; Fez um arquivo chamado 'removearrows.js'e colocou-onaminhapasta deplugin.Issotem omesmo conteúdo do código original,excetojQueryem vez de $. Entãoeu adicionei o seguinteparafunções.php; `função wpb_adding_scripts () { wp_register_script ('my_amazing_script',plugins_url ('removearrows.js',__file__),array ('jquery'),'1.1',true); wp_enqueue_script ('my_amazing_script'); } add_action ('wp_enqueue_scripts','wpb_adding_scripts'); (Desculpe,eunão consigo descobrir comofazer o códigoexibir corretamente) Issonãofuncionou.Vocêpodeme ajudar a consertarisso?Okay. I tried this approach; Made a file named 'removeArrows.js' and placed it in my plugin folder. This has the same content as the original code, except jQuery instead $. then I added the following to functions.php; `function wpb_adding_scripts() { wp_register_script('my_amazing_script', plugins_url('removeArrows.js', __FILE__), array('jquery'),'1.1', true); wp_enqueue_script('my_amazing_script'); } add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts' ); (Sorry, I cant figure out how to make the code display properly) This did not work. Can you help me fix it?
- 0
- 2014-06-25
- user2806026
-
Porfavor,arquive um [edit]e adicionetodas asinformações relevantes ** diretamentepara suapergunta ** Não use a seção de comentáriospara adicionar códigoPlease file an [edit] and add all relevant info **directly to your question** Do not use the comment section to add code
- 1
- 2014-06-26
- Pieter Goosen
-
4 respostas
- votos
-
- 2014-06-26
seu
$scr
no seuwp_register_script()
Afunçãoestáerrada. Dado que o seufunctions.phpestá dentro do seuplugin,e o seu removearrows.jsestána raiz do seuplugin,seu$scr
devepareceresteplugins_url( '/removeArrows.js' , __FILE__ )
Outroponto denota,é sempre umaboapráticapara carregar seus scriptse estilospor último. Issogarantirá queelenão será anuladopor outros scriptse estilos. Parafazerisso,basta adicionar umaprioridademuitobaixa (númeromuito alto) ao seuparâmetroprioritário (
$priority
) deadd_action
.add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 );
e sempre scriptse estilos de carga/fechamento através do
wp_enqueue_scripts
Gancho de ação,comoeste é ogancho adequadopara usar. não carregar scriptse estilos diretamenteparawp_head
ouwp_footer
editar
Paratemas,como vocêindicou que agora vocêmudoutudopara o seutema,seu
$scr
mudariaparaesteget_template_directory_uri() . '/removeArrows.js'
Paratemas dospaise este
get_stylesheet_directory_uri() . '/removeArrows.js'
paratemasinfantis. Seu código completo deve separecer comisso
function wpb_adding_scripts() { wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', array('jquery'),'1.1', true); wp_enqueue_script('my_amazing_script'); } add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 );
Your
$scr
in yourwp_register_script()
function is wrong. Given that your functions.php is inside your plugin, and your removeArrows.js is in the root of your plugin, your$scr
should look like thisplugins_url( '/removeArrows.js' , __FILE__ )
Another point of note, it is always good practice to load your scripts and styles last. This will ensure that it will not get overriden by other scripts and styles. To do this, just add a very low priority (very high number) to your priority parameter (
$priority
) ofadd_action
.add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 );
And always load/enqueue scripts and styles via the
wp_enqueue_scripts
action hook, as this is the proper hook to use. Do not load scripts and styles directly towp_head
orwp_footer
EDIT
For themes, as you've indicated that you now moved everything to your theme, your
$scr
would change to thisget_template_directory_uri() . '/removeArrows.js'
for parent themes and this
get_stylesheet_directory_uri() . '/removeArrows.js'
for child themes. Your complete code should look like this
function wpb_adding_scripts() { wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', array('jquery'),'1.1', true); wp_enqueue_script('my_amazing_script'); } add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 );
-
Muito obrigadopor seus ótimos conselhos.Issoparece ser a abordagem de usar.Umaperguntaembora;Asfunções.phpestãonaminhapastatemática.Comoeu vincularia o arquivo JS seestiver apenasnamesmapasta raiztemática?Thanks a lot for your great advice. This seems like the approach to use. One question though; the functions.php is in my theme folder. How would I link the js-file if it's just in the same, theme root folder?
- 0
- 2014-06-26
- user2806026
-
Você devemantertudoem umplugin ouem umtema,não os divide.Se vocêestiverem umtema,seu `$ Scr` seria`get_template_directory_uri ().'/removearrows.js'`paratemas dospais,e `get_templatestylesheet_directory_uri ().'/removearrows.js'`parafestasYou should keep everything in a plugin or in a theme, don't split them. If you are in a theme, your `$scr` would be `get_template_directory_uri() . '/removeArrows.js'` for parent themes, and `get_templatestylesheet_directory_uri() . '/removeArrows.js'` for childthemes
- 0
- 2014-06-26
- Pieter Goosen
-
Tenteinovamente,desta vez adicionando o removearrows.js diretamentenapastatemáticae usando o seguintenasfunções.php; função wpb_adding_scripts () { wp_register_script ('my_amazing_script',get_template_directory_uri (). '/removearrows.js',__file__),array ('jquery'),'1.1',true); wp_enqueue_script ('my_amazing_script'); } add_action ('wp_enqueue_scripts','wpb_adding_scripts',999); Issome dá Erro Parse:erro de sintaxe,inesperado ','na linha WP_REGISTER_SCRICT.Tried again, this time adding the removeArrows.js directly in theme folder and using the following in functions.php; function wpb_adding_scripts() { wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', __FILE__), array('jquery'),'1.1', true); wp_enqueue_script('my_amazing_script'); } add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); this gives me Parse error: syntax error, unexpected ',' on the wp_register_script line.
- 0
- 2014-06-26
- user2806026
-
`get_template_directory_uri ().'/removearrows.js',arquivo) `deve ser apenas 'get_template_directory_uri ().'/removearrows.js'``get_template_directory_uri() . '/removeArrows.js', FILE)` should just be `get_template_directory_uri() . '/removeArrows.js'`
- 0
- 2014-06-26
- Pieter Goosen
-
Não.Usou o seu código completamente que vocêeditounaparteinferior do seupost original.A única coisa quefaz é congelar apágina do carrinho ao visualizar o conteúdo.Eu acho que vou desistir :-) Um último recursoembora;Você começoumencionando queget_template_directory_uri () éparatemas dospaise,em seguida,no códigofinalfinal que éparatemasinfantis.Qual é?Meutema épai :-)Nope. Used your completely code you edited into the bottom of your original post. Only thing it does is to freeze the cart page when viewing the contents. I think I'll just give up :-) One last resort though; you started by mentioning that get_template_directory_uri() is for parent themes, and then in the final complete code that it's for child themes. Which is it? My theme is a parent :-)
- 0
- 2014-06-27
- user2806026
-
Desculpe,fez uma cópiae coleerro lá.A últimaparte do código completo épara otemapai.Seissonãofuncionar,vocêprecisará dar uma olhadano seu scriptSorry, made a copy and paste error there. The last piece of complete code is for parent theme. If this doesn't work, you will need to have a look at your script
- 0
- 2014-06-27
- Pieter Goosen
-
- 2014-06-25
Eunão adicionaria outro arquivo JSexterno,é apenas um recursoextrae desnecessárioparabuscare isso é algo que queremos reduzirem termos de horários de carregamento dapágina.
Eu adicionariaeste snippetjQueryem sua cabeça de sites usando ogancho
wp_head
. Você colaria o seguinteem seu arquivo defunções do seutema ouplugins. Eutambémgaranti que ojQueryestejanomodo sem conflito,como vocêpode ver abaixo.add_action('wp_head','woocommerce_js'); function woocommerce_js() { // break out of php ?> jQuery(document).ready(function($) { $(".woocommerce-cart").html(function(i, val) { return val.replace(" →", ""); }); $(".woocommerce-cart").html(function(i, val) { return val.replace("← ", ""); }); }); <?php } // break back into php
Depois deterfeitoissoe atualizou suapágina,verifique afonte dapáginaparagarantir queeste snippetjQueryesteja sendo carregadoem suapágina. Se éentão,devefuncionar amenos que seja algoforanotrechojquery real que vocêestá usando.
I would not add another external js file, its just an extra and unnecessary resource to fetch and that is something we want to cut down on in terms of page loading times.
I would add this jQuery snippet in your websites head using the
wp_head
hook. You would paste the following in your theme or plugins functions file. I have also made sure jQuery is in no-conflict mode as you can see below.add_action('wp_head','woocommerce_js'); function woocommerce_js() { // break out of php ?> jQuery(document).ready(function($) { $(".woocommerce-cart").html(function(i, val) { return val.replace(" →", ""); }); $(".woocommerce-cart").html(function(i, val) { return val.replace("← ", ""); }); }); <?php } // break back into php
Once you have done this and refreshed your page, check the page source to make sure this jQuery snippet is in fact being loaded into your page. If it is then it should work unless their is something off in the actual jQuery snippet you are using.
-
Essanão é amaneira do WordPresspara carregar o Javascript,noentanto.Veja [`wp_enqueue_script ()`] (https://codex.wordpress.org/function_reference/wp_enqueue_script)paramaisinformações.That's not the WordPress way to load Javascript, though. See [`wp_enqueue_script()`](https://codex.wordpress.org/Function_Reference/wp_enqueue_script) for more information.
- 0
- 2014-06-25
- Pat J
-
Oi @PatJ,eu concordo,para carregar um arquivo JSexterno ou arquivo JS comtodas as suasfunções JavaScriptnele,então sim absolutamenteessa seria amaneira correta.Noentanto,se vocêestiver carregando umtrecho de JavaScript,elenãofaz sentido criar umnovo arquivo JSinteiroe adicionar uma solicitação HTTP adicional apenasparaisso.Leve o Google Analyticsporexemplo,em 99% dostemas ou construçõespersonalizadas,o JS será adicionado ao cabeçalho ou rodapé via opções detema ou arquivo defunções.Suaprática comumincluir JS ou atémesmo ostrechos CSS dessamaneira.Hi @PatJ, I agree, for loading an external JS library or JS file with all your Javascript functions in it, then yes absolutely that would be the correct way. However if you are loading a snippet of Javascript it does not make sense to create a whole new JS file and add an additional HTTP request just for that. Take Google Analytics for example, in 99% of themes or custom builds, the JS will be added into the the header or footer via theme options or functions file. Its common practice to include JS or even CSS snippets this way.
- 2
- 2014-06-25
- Matt Royal
-
"Prática comum"não atorna correta,noentanto.Os documentos [`wp_enqueue_script ()` https://codex.wordpress.org/function_reference/wp_enqueue_script) atémesmoestado ** Este é ométodo recomendado de vincularjavascript a umapáginagerada wordpress."Common practice" doesn't make it correct, though. The [`wp_enqueue_script()` docs](https://codex.wordpress.org/Function_Reference/wp_enqueue_script) even state **This is the recommended method of linking JavaScript to a WordPress generated page**.
- 1
- 2014-06-26
- Pat J
-
Se vocêfizer o WordPresspadrão,ele carrega html5.jsno cabeçalho.php.Concedeu a sua doe dessamaneirapor ummotivo,demodo a verificar onavegador atende a condição de ser <9,mas omeuponto é que compreensivelmente,oenquedor é ométodo recomendadoe preferido,mas dependendo detodas as outras variáveis/circunstânciasem torno do que vocêEstãotentando conseguir quenem sempre seja omaispráticoe acho que alguma discrição deve ser usada.Olha,eupoderiaestar completamenteerradonesta visãotambém,estouinteressadoem ouvir o que alguns dos caras realmenteexperientestêm a dizer :-)If you take WordPress default twentyfourteen theme, it loads html5.js in the header.php. Granted its doe this way for a reason so as to check of the browser meets the condition of being IE < 9, but my point is that understandably, enqueuing is the recommended and preferred method but depending on all the other variables/circumstances surrounding what you are trying to achieve it may not always be the most practical and I think some discretion should be used. Look, I could be completely wrong in this view as well, I'm interested to hear what some of the really experienced guys have to say :-)
- 0
- 2014-06-26
- Matt Royal
-
Obrigadopela suagrande sugestão.Eunão consigofazerissoparafuncionar;Seeu adicionar seu código dentro daThanks for your great suggestion. I can't get it to work though; if I add your code inside the
- 0
- 2014-06-26
- user2806026
Quando você colá-loem seu arquivofunctions.php - Remova oprimeiro ` Php` do código queeuforneceu como vocêjátem aetiqueta de abertura` Php`na linha 1 do arquivofunctions.php.Euediteiminha resposta originale removi-a de látambém.When you paste it in your functions.php file - remove the first `- 0
- 2014-06-26
- Matt Royal
Este código JSprecisaembrulhadoem .Estemétodopara renderizar JSno WPnão é recomendado,masem alguns casos soluções rápidas sãomaisimportantes do que asmelhorespráticas.This JS code needs to wrapped in . This method to render JS in WP is not recommended, but in some cases quick solutions are more important than best practices.- 0
- 2020-01-09
- Tahi Reu
- 2018-08-24
Como a respostajá é aceita,eu só quero dizer que há outramaneira deenqueue o código JavaScriptno rodapé queeufizmuitas vezes.
no arquivo Functions.php:
function load_script_to_remove_arrow(){ ?> <script> $(document).ready(function() { $(".woocommerce-cart").html(function(i, val) { return val.replace(" →", ""); }); $(".woocommerce-cart").html(function(i, val) { return val.replace("← ", ""); }); }); </script> <?php } add_action( 'wp_footer', 'load_script_to_remove_arrow' );
Vocêpode carregareste scriptpara omodelo depáginaespecífico somente usando a condição
if( is_page_template( 'page-template.php' ) ): //put above code (or just add_action part) inside this condition to load file only if the condition is true endif;
se apágina-template.phpestiverno diretório (digamos diretóriotemplatesno dirijo raiz do seutema,vocêpodeescrever como:
is_page_template( 'templates/page-template.php' );
As the answer is accepted already so, I just want to say there's another way to enqueue javascript code in footer which I have done many times.
in functions.php file:
function load_script_to_remove_arrow(){ ?> <script> $(document).ready(function() { $(".woocommerce-cart").html(function(i, val) { return val.replace(" →", ""); }); $(".woocommerce-cart").html(function(i, val) { return val.replace("← ", ""); }); }); </script> <?php } add_action( 'wp_footer', 'load_script_to_remove_arrow' );
you can load this script to particular page template only by using condition
if( is_page_template( 'page-template.php' ) ): //put above code (or just add_action part) inside this condition to load file only if the condition is true endif;
if the page-template.php is in directory ( say templates directory in your theme's root dir ) you can write like:
is_page_template( 'templates/page-template.php' );
-
Eunão recomendaria "assar" ojavascriptpara o rodapé comoeste.Impede que seja absolutável oumodificável (pelomenosfacilmente),que éextremamenteimportanteno desenvolvimento deplugine tema.Se você é o usuáriofinal de um sitee precisar de um script rápido ou algo assim,váparaele -mas atémesmo "WP_ENQUEUE_SCRICT ()" é quase sempre universalmentemelhore maisflexível.I would not recommend "baking" the JavaScript into the footer like this. It prevents it from being unhookable or modifiable (at least, easily) which is extremely important in plugin and theme development. If you're the end-user of a site and need a quick script or something, go for it - but even still `wp_enqueue_script()` is almost always universally better and more flexible.
- 0
- 2018-08-24
- Xhynk
- 2018-08-24
Para responder apergunta,devemosprimeirofazer uma distinçãoentre JavaScripte jQuery.
indicar de umaforma simples:
- javascript ébaseadonoecmascript
- jquery é umabibliotecapara JavaScript
Então,na realidade,vocêfaz duasperguntas diferentes:
- Seutítulofala sobre uma soluçãoparaimplementar JavaScript
- Suaperguntafala sobre uma soluçãoparaimplementarjQuery
Porque os resultados do Googlemostram seutítuloe todo o conteúdo dapáginafala sobrejQuery,issopode setornarmuitofrustrantepara aspessoas queprocuram uma solução JavaScript.
e agorapara a soluçãojquery:
wp_enqueue_script ('script-id',get_template_directory_uri (). '/js/script.js',array ('jquery'),1.1,true);
e a solução JavaScript:
WP_ENQUEUE_SCRIPT ('ID de script',get_template_directory_uri (). '/js/script.js',array (),'1.0.0',true);
Este códigopode ser adicionado às suasfunções.php A localização dos scriptsem ambos os casos é
WP-Conteúdo/Temas/Nome do Tema/JS/Script.js Codificaçãofeliz!
To answer the question we must first make a distinction between javascript and JQuery.
To state it in a simple fashion:
- Javascript is based on ECMAScript
- JQuery is a library for Javascript
So in reality you ask two different questions:
- Your title speaks about a solution for implementing javascript
- Your question speaks about a solution for implementing JQuery
Because the Google results show your title and all the content of the page talks about JQuery this can become very frustrating to people that search for a javascript solution.
And now for the JQuery solution:
wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);
And the javascript solution:
wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array(), '1.0.0', true );
This code can be added to your functions.php The location of the scripts in both cases is
wp-content/themes/theme-name/js/script.js
Happy coding!
-
Na épocaem que o OPpostou,Devs usou JQuerye JavaScript deformaintercambiável.Não é detodoexato,masfoi como JQuerypopularfoie quantojavascriptestavafaltando características.Around the time when OP posted, devs did use jquery and javascript interchangeably. It's not at all accurate, but it was how popular jquery was and how much javascript was missing features.
- 0
- 2020-04-29
- Rocky Kev
Eugostaria de remover algumas setas de aparênciafeia que sãopadrãoem botões de carrinhoem WooCommerce. Para conseguirisso,encontrei umaponta de adicionar o seguinte código,que deve remover as setas quando o documentofor carregado.
Eu suponho que vou colocá-loem minhasfunções.php? Comoexatamenteeufariaisso?
editar
Ok. Eutentei esta abordagem:
fez um arquivo chamado 'removearrows.js'e colocou-onaminhapasta deplugin. Issotem omesmo conteúdo do código original,excetojQueryem vez de $. Entãoeu adicionei o seguinteparafunções.php:
Não consigo descobrir comofazer o códigoexibir corretamente. Issonãofuncionou. Quaisquer sugestõesparatornarestetrabalho?
JQuery Snippet Source