Is there a way to wp_enqueue_script() and use it inside the Customizer Panel in Wordpress? Something like :
function myTheme_enqueue_script_admin() {
wp_enqueue_script( 'custom-admin-js', get_template_directory_uri() . '/js/admin.min.js', array(), '1.0', true );
}
add_action('--ENQUEUE SCRIPT TO CUSTOMIZER--', 'myTheme_enqueue_script_admin');
Thank you!
yes, just use this hook
add_action( 'admin_enqueue_scripts', 'func' );
read more from codex
Related
I'm working on a project that I have a child-theme on which I'm running specific functions from the function.php file.
My problem is that when I try to add an if condition to only run the script on a specific page, it doesn't work.
I'm using the functions.php from the child theme.
In other words... I need to be able to get the current page on the child theme.
What am I doing wrong?
add_action(
'init', function() {
if (is_page('contact')) {
wp_register_script( 'my-func', get_stylesheet_directory_uri() . 'my-func.js', '', '', false );
wp_enqueue_script( 'my-func' );
}
}
);
Thanks
for theme code will go to your functions.php file and for plugin code will go to the public functions.
add_action( 'wp_enqueue_scripts', 'my_assets' );
function my_assets()
{
if (is_page('booking')) {
/* for plugin */
wp_enqueue_style($this->plugin_name, plugin_dir_url(__FILE__) . 'css/custom.css', array(), $this->version, 'all');
/*for theme */
wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}
}
I want to call a jQuery from my functions.php in WordPress.
I'm using Divi Theme. When I add the script directly into Divi theme it works. But I want to add it to the functions.php form my child theme and this is where the problem start.
Functions.php
function coolbanner_enqueue() {
wp_enqueue_script( 'custom-scripts', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery' ));
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );
Script:
jQuery(document).ready(function(){
jQuery('#cta-section').waypoint(function() {
jQuery('#cta-section').toggleClass('animate-cta');
}, {offset: '80%'});
});
Can somebody point out what I'm doing wrong?
Seems like you're missing the jQuery Waypoint JS file
Try enqueueing the jquery waypoint js file BEFORE using your custom script
function coolbanner_enqueue() {
wp_enqueue_script( 'jquery-waypoint', 'https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js', [ 'jquery' ] );
wp_enqueue_script( 'custom-scripts', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery-waypoint' ));
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );
you can find the jquery waypoint github repo here...
https://github.com/imakewebthings/waypoints
Additionally the url I used below is from a cdn which you can find here:
https://cdnjs.com/libraries/waypoints
if you feel more comfortable using the github's url
then just substitute the cdn url with the following...
https://raw.githubusercontent.com/imakewebthings/waypoints/master/lib/jquery.waypoints.min.js
Solution:
function coolbanner_enqueue() {
wp_enqueue_script( 'custom-scripts-js', get_stylesheet_directory_uri() . '/js/coolbanner.js', array( 'jquery' ), '1.0', false);
}
add_action( 'wp_enqueue_scripts', 'coolbanner_enqueue' );
I am making my first custom wordpress theme and am running into problems with functions.php
I am using bootstrap too so i want to include bootstrap stylesheets to wp i currently do it this way-:
style.css
#import url('css/bootstrap.css');
#import url('css/font-awesome.css');
I understand that i can use functions.php to do the same, so i wrote a custom function and tried to do it like this-:
functions.php
<?php
/* Theme setup */
require_once('wp_bootstrap_navwalker.php');
/* Add bootstrap support to the Wordpress theme*/
function theme_add_bootstrap() {
wp_enqueue_style( 'bootstrap-css', get_template_directory_uri().'/css/bootstrap.css' );
wp_enqueue_style( 'style-css', get_template_directory_uri().'/css/font-awesome.css' );
wp_enqueue_script( 'bootstrap-js', get_template_directory_uri().'/js/bootstrap.js', array(), '3.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'theme_add_bootstrap' );
?>
This does not seem to work. Neither does functions.php load the wp jquery or the bootstrap.js
Can anyone shed some light onto this matter for me? I would be ever grateful. This is not a child theme its a custom theme.
Try registering your scripts before you enqueue them. For example:
function my_enqueue_scripts() {
// Register Bootstrap JS.
wp_register_script( 'bootstrap-js', get_template_directory_uri() . '/js/bootstrap.min.js', array( 'jquery' ), NULL, true );
// Enqueue Bootstrap JS.
wp_enqueue_script( 'bootstrap-js' );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
For my website, I am trying to include my own stylesheet for icons other than font-awesome. However, no matter what I do with "wp_enqueue_style", I can only end up using one of the stylesheets (either mine or font-awesome) but not both. Only one would be working. I was wondering what I am doing incorrectly with my coding here:
wp_enqueue_style( 'vantage-fontawesome', get_template_directory_uri().'/fontawesome/css/font-awesome.css', array(), '3.2.1' );
wp_enqueue_style( 'Mystyle', get_template_directory_uri().'/fontawesome/css/Mystyle.css', array());
What can I do so that both 'font-awesome.css' and 'mystyle.css' can be used? Thanks
You should wrap wp_enqueue_style() in a function and hook that function to wp_enqueue_scripts. For example:
function theme_name_scripts() {
wp_enqueue_style( 'style-name', get_stylesheet_uri() );
// Enqueue more style sheets here.
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );
Ref: http://codex.wordpress.org/Function_Reference/wp_enqueue_style
You're code should look like this.
function my_scripts() {
// Add Mystyle
wp_enqueue_style( 'Mystyle', get_template_directory_uri().'/fontawesome/css/Mystyle.css',array());
// Add Font Awesome
wp_enqueue_style( 'vantage-fontawesome', get_template_directory_uri().'/fontawesome/css/font-awesome.css', array(), '3.2.1' );
}
//Push to wordpress all files
add_action( 'wp_enqueue_scripts', 'my_scripts' );
I am trying to en-queue css in WordPress.
Here is my code:
function adding_styles()
{
wp_register_script( 'jquery-ui-css', 'http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css');
// Register the style like this for a plugin:
wp_register_style( 'custom-style', plugins_url( '/css/custom-style.css', __FILE__ ), array(), '20120208', 'all' );
// For either a plugin or a theme, you can then enqueue the style:
wp_enqueue_style( 'jquery-ui-css' );
// For either a plugin or a theme, you can then enqueue the style:
wp_enqueue_style( 'custom-style' );
}
add_action( 'wp_enqueue_scripts', 'adding_styles' );
However, jquery-ui.css doesn't load. Can anybody guess the error here??
I believe you need to add path to the CSS file -
wp_enqueue_style( 'jquery-ui-css',get_stylesheet_uri() );
EDIT -
It will clearly works with the URL -
wp_enqueue_style( 'jquery-ui-css', http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css );
Reference - wp_enqueue_style
Look for$src parameter
Try this:
You can add javascript & css in wordpress like this
function load_custom_wp_admin_js() {
wp_enqueue_script('custom_wp_admin_js', plugins_url() . '/dynamic-headers/dynamic-header.js');
}
add_action('admin_enqueue_scripts', 'load_custom_wp_admin_js');
Add this code in function.php file.
-
Thanks