-
Posts
-
Hi,
I got some jQuery code from a plugin developer to add to the theme and I have no clue where to put it. I read this thread https://kriesi.at/support/topic/how-to-add-custom-jquery-to-enfold-theme/ which provides instructions, but I can’t figure out where inside the code I shall add my configuration.This is the code from the Enfold thread:
Try adding this at the very end of your child theme functions.php file:function add_customjs() {
wp_enqueue_script( ‘customjs’, get_stylesheet_directory_uri().’/js/custom.js’, array(‘jquery’), 2, true );
}
add_action( ‘wp_enqueue_scripts’, ‘add_customjs’, 100 );And this is the bit I need to add from the plugin developer:
jQuery(‘.fdm-ordering-sidescreen #fdm-ordering-contact-details .fdm-ordering-contact-item’).each((idx, x) => { jQuery(x).find(‘input[name=”fdm_ordering_email”]’).length == 1 || jQuery(x).find(‘input[name=”fdm_ordering_phone”]’).length == 1 ? jQuery(x).hide() : ”; });
I’d really appreciate if you could merge both so I can add this to my child theme functions.php
Thanks!!
Hey nasi,
Is the code supposed to go on every page, and should it be loaded in the header or footer? You can try this code in functions.php, if you want to load it on every page and in the header:
function wedesignshanghai_custom_plugin_jquery(){ ?> YOUR CODE GOES HERE <?php } add_action('wp_head', 'wedesignshanghai_custom_plugin_jquery');Best regards,
RikardHi Rikard,
Thanks for the quick reply and for looking into this.
Code is only to be applied on specific pages and related to the Five Star Restaurant Menu – WordPress Food Ordering Plugin.
The code is supposed to remove 2 sections (phone and email) from the ordering checkout specific to this plugin.
Currently the ordering menu page is https://meepleopolis.com/qr-menu/ but we will have to add more menus in the future creating different pages.
If you could post the code for this specific page, and let me know how to include more pages to it, we shall be able to add other pages in the future ourselves.As you can see, my knowledge on this is basically zero. So your help is much appreciated.
Thanks!!
Hi,
You can use the is_page conditional: https://developer.wordpress.org/reference/functions/is_page/. You can find the page ID in the URL when you edit it.
Best regards,
RikardHi Rikard,
Thanks for the lead. I tried to add your code and the one provided by the plugin to functions.php with no success.
This is way beyond my scope of work, will hire a developer to look into it.You can close the thread.
Thanks!yes – i think that your code above:
jQuery('.fdm-ordering-sidescreen #fdm-ordering-contact-details .fdm-ordering-contact-item').each((idx, x) => {jQuery(x).find('input[name="fdm_ordering_email"]').length == 1 || jQuery(x).find('input[name="fdm_ordering_phone"]').length == 1 ? jQuery(x).hide() : ''; });is your custom.js file
if you have a child theme – you had to upload that custom.js to your enfold-child/js folder ( on default there is no js folder – create one )now this snippet comes to functions.php of your child theme and loads that external script.
function add_customjs() { wp_enqueue_script( 'customjs', get_stylesheet_directory_uri().'/js/custom.js', array('jquery'), 2, true ); } add_action( 'wp_enqueue_scripts', 'add_customjs', 100 );_______
but
1st: in your custom.js file (maybe it is only because you do not use the code function on posting the code) there is a double quote – but it had to be an empty double single quoute:
jQuery('.fdm-ordering-sidescreen #fdm-ordering-contact-details .fdm-ordering-contact-item').each((idx, x) => {jQuery(x).find('input[name="fdm_ordering_email"]').length == 1 || jQuery(x).find('input[name="fdm_ordering_phone"]').length == 1 ? jQuery(x).hide() : ''; });
it is the last:''2nd: for such a small script you can insert this directly via your child-theme functions.php without having an external script to upload.
Try this in your child-theme functions.php:function fdm_ordering_custom_script(){ ?> <script type="text/javascript"> (function($) { $('.fdm-ordering-sidescreen #fdm-ordering-contact-details .fdm-ordering-contact-item').each((idx, x) => {$(x).find('input[name="fdm_ordering_email"]').length == 1 || $(x).find('input[name="fdm_ordering_phone"]').length == 1 ? $(x).hide() : ''; }); })(jQuery); </script> <?php } add_action('wp_footer', 'fdm_ordering_custom_script');btw: maybe that part of your script does not work as expected :
input[name="fdm_ordering_phone"]this is called an attribut selector. the input that has the exact name of …
but if there are f.e. spaces the selector does not fit.
this:input[name*="fdm_ordering_phone"]this asterisk indicates that the value must occur only once – no matter whether other values are also present or e.g. appendices. This here: name= xyz fdm_ordering_phone.jpg would be selected therefore also
PS: same with fdm_ordering_email
Uou!
That worked just fine!
Applied Guenni’s 2nd option directly on the child’s functions.php and the 2 unwanted fields are gone.
:-DThanks a lot @guenni007 !!!
- You must be logged in to reply to this topic.