-
回答 1 已采纳
I've created a child of a WordPress theme and now I'm trying to insert custom JavaScript into the home page by modifying functions.php of the child. However, my script is not being loaded and I'm not sure why. I've inserted 'echo' statements into the php code and it seems like
add_action( 'wp_enque_scripts', 'video_bg', 10);
fails to call
video_bg()
Here's the functions.php of my child:
<?php
add_action( 'after_setup_theme', 'post_theme_setup' );
if ( !function_exists( 'post_theme_setup' )):
function post_theme_setup(){
function video_bg() {
wp_enque_script( 'myVideo', get_stylesheet_directory_uri() . '/JS/filmScript.js', array('jquery'), '1.0.0', false );
echo '<script>console.log("Script added?")</script>';
}
add_action( 'wp_enque_scripts', 'video_bg', 10);
echo '<script>console.log("Loop Entered")</script>';
}
endif;
And here's what the console is telling me:
Loop Entered (index):1
JQMIGRATE: Migrate is installed, version 1.4.1 jquery-migrate.min.js?ver=1.4.1&nocache=1:2
Could anyone please tell me why video_bg() never gets called? Or is the problem in something else?
-
回答 2 已采纳
I have coded myself a little WP-Plugin, where I do
wp_enqueue_script('jquery');
wp_enqueue_script('myapp1', $pluginpath . 'build/js/app.min.js', array('jquery'));
wp_enqueue_style("myapp2", $pluginpath . 'build/css/style.css');
while testing on my localhost, everythink worked fine, so I uploaded everything to my server and there, my plugin works, too, but the app.min.js and the style.css is not included(?)
what could be the cause for this?
-
回答 1 已采纳
I'm trying to load something only after a specific script is done loading. Wordpress provides a method to detect if a script loaded or not via 'wp_script_is'. When I use the jquery handle with "done" it works but when I use a custom script handle, nothing happens. My code:
function my_custom_scripts() {
wp_enqueue_script( 'custom_script_handle', '/stem_plugins/temp.js', array( 'plugins', 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_scripts' );
function include_file() {
if ( wp_script_is( 'custom_script_handle', 'done' ) ) {
include('dependent_file.php');
}
}
add_action( 'wp_footer', 'include_file' );
Interestingly, if I use the 'jQuery' script handle instead of my custom script handle, it works. Or if I use my custom script handle with "enqueued" instead of "done" it also works but I need it to work specifically with "Done".
-
回答 1 已采纳
OK, i'm trying to eliminate all possible variables for troubleshooting purposes. So instead of in my functions.php, I've dropped this code in my header.php file:
<?php $mdgtemplateloc = get_bloginfo( 'template_url' ).'/js/'; ?>
<?php echo '<!-- ' . $mdgtemplateloc . ' --> ?>
<?php wp_enqueue_script( 'hoverIntent', $mdgtemplateloc.'hoverIntent.js', array( 'jquery' ) ); ?>
<?php wp_enqueue_script( 'mdMenuAnimation', $mdgtemplateloc.'mdMenuAnimation.js', array( 'hoverIntent' ) ); ?>
The result is a few white space insertions into the source and the comment appears as requested. My understanding was that this would insert something like
<script type="text/javascript" src="[url]/js/mdMenuAnimation.js"></script>
I want to do this the correct way, but wp_enqueue_script has been giving me NOTHING. I suspect I'm doing something fundamentally wrong, but I can't find it and nothing I find through google or stackoverflow or the wp codex is helping at all.
To clarify, here's what I had before, in the functions.php file:
function mdg_setup_scripts() {
$mdgtemplateloc = get_bloginfo( 'template_url' ).'/js/';
wp_register_script( 'hoverIntent', get_bloginfo('template_url').'/js/hoverIntent.js', array( 'jquery' ));
wp_enqueue_script( 'hoverIntent' );
wp_register_script( 'mdMenuAnimation', $mdgtemplateloc.'mdMenuAnimation.js', array( 'hoverIntent' ));
wp_enqueue_script( 'mdMenuAnimation' );
}
add_action( 'wp_enqueue_scripts', 'mdg_setup_scripts' );
This also produced no output that ever called a script. I understand that this second is more like what is supposed to be, but it isn't doing anything.
-
回答 4 已采纳
I want to add my custom javascript to my wordpress page.
I tried it usign wp_enqueue_script() but its not working. When I tried to add script directly in Inspect element it works properly so my script is correct.
Now I create function in function.php file to add script and its not working. It shows script / file is loaded in page when I check source of page. But it doing nothing.
Below is my script and function.
Javascript -
jQuery(".tp-tab").mouseenter(function() {
jQuery('.tp-tab').removeClass("selected");
});
jQuery(".tp-tab").click(function() {
jQuery(this).addClass("selected");
});
Function in function.php
function mytheme_custom_scripts() {
if ( !is_admin() ) {
$scriptsrc = get_stylesheet_directory_uri() . '/wp-content/themes/circles/js/';
wp_register_script( 'myhandle', $scriptsrc . 'slider_hover_effect.js', 'jquery', '1.0', false );
wp_enqueue_script( 'myhandle' );
}
}
add_action( 'wp_enqueue_scripts', 'mytheme_custom_scripts' );
In /wp-content/themes/circles/js/ directory location my script is palced with file name of slider_hover_effect.js which contain above javascript code.
Please let me know is there any other way I can add this script in my wordpress website. Also I want to add/apply this script only for Homepage. So is this possible.
Thanks,
Update
I am not sure about that I should provide complete path after get_stylesheet_directory_uri() or just /js/ folder.
Or
Can I use like -
function slider_effect() { ?>
<script type="text/javascript">
jQuery(".tp-tab").mouseenter(function() {
jQuery('.tp-tab').removeClass("selected");
});
jQuery(".tp-tab").click(function() {
jQuery(this).addClass("selected");
});
</script>
<?php
}
add_action('wp_head','slider_effect');
-
回答 1 已采纳
I was looking a tutorial to use the customizer on wordpress for a theme from scratch, but I have some issues with get_option, I have no return.
I put my code below.
<?php
//==================================================
//============= Chargement des scripts =============
//==================================================
define('schweitzer_ver', '0.2');
// Chargement front end
function schweitzer_scripts(){
// Chargement des styles
//wp_enqueue_style( 'styles-bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css',
// '', schweitzer_ver, 'all' );
wp_enqueue_style( 'styles', get_template_directory_uri() . '/style.css',
array(), schweitzer_ver, 'all' );
wp_enqueue_style( 'menu', get_template_directory_uri() . '/css/menu.css',
array(), schweitzer_ver, 'all' );
// Chargement des scripts
wp_enqueue_script( 'schweitzer_script', get_template_directory_uri() . '/js/schweitzer.js',
array('jquery'), schweitzer_ver, true );
wp_enqueue_script( 'menu_script', get_template_directory_uri() . '/js/menu.js',
array('jquery'), schweitzer_ver, true );
}
// Intégration et mise en forme du menu
function clean_custom_menus() {
$menu_name = 'primary';
if (($locations = get_nav_menu_locations()) && isset($locations[$menu_name])) {
$menu = wp_get_nav_menu_object($locations[$menu_name]);
$menu_items = wp_get_nav_menu_items($menu->term_id);
// $menu_list = '<nav>' ."
";
$menu_list .= "\t\t\t\t". '<ul>' ."
";
foreach ((array) $menu_items as $key => $menu_item) {
$title = $menu_item->title;
$url = $menu_item->url;
$menu_list .= "\t\t\t\t\t". '<li><a href="'. $url .'">'. $title .'</a></li>' ."
";
}
$menu_list .= "\t\t\t\t". '</ul>' ."
";
$menu_list .= "\t\t\t". '</nav>' ."
";
}
else {
$menu_list = 'Pas de menu défini';
}
echo $menu_list;
}
add_action( 'wp_enqueue_scripts', 'schweitzer_scripts', 'clean_custom_menus');
//==================================================
//================= Configuration ==================
//==================================================
function schweitzer_setup ()
{
// Active gestion des menus (avec plusieurs positions)
register_nav_menus(array('primary'=>'principal'));
// support des vignettes
add_theme_support('post-thumbnails');
// Retire générateur de version (sécurité !)
remove_action('wp_head', 'wp_generator');
// Retire guillemets français
remove_filter ('the_content', 'wptexturize');
// Support du titre géré par WP (meilleur SEO)
add_theme_support('title-tag');
}
add_action( 'after_setup_theme', 'schweitzer_setup' );
//==================================================
//================ Options du theme ================
//==================================================
function schweitzer_customizer()
{
//===== Variables =====
// Couleur du menu
$menu_color = get_option('menu_color','#2a2a2a');
// Transparence du menu
$menu_opacity = get_option('menu_opacity','0.5');
// Nombre d'éléments dans le menu
// $menu_element = get_option( 'menu_element' );
?>
<style>
nav li:nth-of-type(1){background-color: <?php echo $menu_color; ?>; opacity: <?php echo $menu_opacity; ?>}
nav li:nth-of-type(2){background-color: <?php echo $menu_color; ?>; opacity: <?php echo $menu_opacity; ?>}
nav li:nth-of-type(3){background-color: <?php echo $menu_color; ?>; opacity: <?php echo $menu_opacity; ?>}
nav li:nth-of-type(4){background-color: <?php echo $menu_color; ?>; opacity: <?php echo $menu_opacity; ?>}
nav li:nth-of-type(5){background-color: <?php echo $menu_color; ?>; opacity: <?php echo $menu_opacity; ?>}
</style>
<?php
}
add_action( 'wp_head', 'schweitzer_customizer' );
function schweitzer_customize_register( $wp_customize ) {
$wp_customize->add_section( 'menu_options' , array(
'title' => 'Réglage du Menu',
) );
$wp_customize->add_setting( 'menu_color' , array(
'default' => '#000',
'sanitize_callback' => 'sanitize_hex_color',
) );
$wp_customize->add_setting( 'menu_opacity' , array(
'default' => '0.5',
) );
$wp_customize->add_control(
new WP_Customize_Color_Control($wp_customize,
'menu_color_selection',
array('label' => 'Choix de la couleur',
'section' => 'menu_options',
'settings' => 'menu_color',
)
));
$wp_customize->add_control(
'menu_opacity_selection',
array(
'label' => __( 'Transparence', 'schweitzer' ),
'section' => 'menu_options',
'settings' => 'menu_opacity',
'type' => 'radio',
'choices' => array(
'0' => '0% (opaque)',
'0.1' => '10 %',
'0.2' => '20 %',
'0.3' => '30 %',
'0.4' => '40 %',
'0.5' => '50 %',
'0.6' => '60 %',
'0.7' => '70 %',
'0.8' => '80 %',
'0.9' => '90 %',
'1' => '100 % (transparent)',),
)
);
}
add_action( 'customize_register', 'schweitzer_customize_register' );
function schweitzer_register_settings() {
register_setting( 'menu_settings', 'my_option_name', 'intval' );
}
add_action( 'admin_init', 'schweitzer_register_settings' );
This is my functions.php.
The back end seems to work well but there is no trace of my "menu_color" options.
-
回答 2 已采纳
I'm trying to create markers on a map via ajax on a wp theme.
After some struggle I found out that I can't use any php file to get data via ajax, I have to use the admin-ajax.php file.
Accordingly to many examples, this is my code
in functions.php
add_action( 'wp_enqueue_scripts', 'add_frontend_ajax_javascript_file' );
function add_frontend_ajax_javascript_file()
{
wp_localize_script( 'frontend_ajax', 'frontendajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));
wp_enqueue_script( 'ajax_custom_script', get_stylesheet_directory_uri() . '/includes/ajax-javascript.js', array('jquery') );
}
add_action( 'wp_ajax_get_post_information', 'get_post_information' );
add_action( 'wp_ajax_nopriv_get_post_information', 'get_post_information' );
function get_post_information()
{
$get_this= $_GET['this'];
$get_that= $_GET['that'];
...my select...
echo json formatted data
}
The js file is loaded and working, it does other stuff before the ajax call, where it stops for an error in this line:
$.post({
url:frontendajax.ajaxurl,
{
action: 'get_post_information',
data: data
},
success: function(response) {
But I always Have the same error:
Reference Error: frontendajax.ajaxurl is not defined
where is my error?
PS: I use get_stylesheet_directory_uri() because I am in a child theme.
-
回答 1 已采纳
I am developing a plugin where user will submit a form. The form submits to the same page. Form data handling code is implemented by checking the condition-
if ( !empty( $_POST['action'] ) && $_POST['action'] == 'customer_add_new')
Then the data is validated and entered to database using $wpdb->insert.
After that, I want to pass a variable to the URL, so that success message can be displayed and user can be stopped from re-submitting the form by refreshing the page. For that, I used-
$url = add_query_arg( array(
'customer_add_new' => 'success'
) );
wp_redirect( $url );
exit();
But this code is throwing the following error-
Warning: Cannot modify header information - headers already sent by (output started at E:\wamp\www\cp_plugin\wp-includes\class.wp-scripts.php:343) in E:\wamp\www\cp_plugin\wp-includes\pluggable.php on line 1216
I have successfully used the same code in the theme for this very same project. But the functionality was better suited for a plugin, than for a theme.
-
回答 1 已采纳
I'm trying to create customizable checkboxes using buttons. I'm able to differentiate which button class has been selected, but I've been unable to track the button class post form submission. Ideally, instead of reseting the buttons to a default value when the page is loaded or submitted, I can keep whatever input was initially provided. I've tried using the isset() php function, but I don't think it's a valid solution in this circumstance. Are there any alternatives? Find my code below:
<form id="my-form" method="post">
<html>
<body >
<style>
.button {
color: white;
padding: 10px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 12px;
margin: 4px 2px;
cursor: pointer;
}
.button1 {
border-radius: 100%;
background-color: green;
border: none;
}
.button2 {
border-radius: 100%;
background-color: red;
border: none;
}
</style>
<div id="test1"></div>
<div id="test2"></div>
<!-- invalid code?
<?php
echo isset($_POST["t1test"]);
echo isset($_POST["t2test"]);
echo $_POST["t1test"];
echo $_POST["t2test"];
?>
-->
<script type="text/javascript">
function makeButton(div, val) {
var element = document.getElementById(val);
var button = document.createElement("button");
var span = document.createElement("span");
// change to account for submitted settings
if (element == null) {
button.setAttribute("class", "button button1"); }
else {
var cL1 = element.classList.contains("button1");
var cL2 = element.classList.contains("button2");
element.parentNode.removeChild(element);
if (cL2 == true) { button.setAttribute("class", "button button1"); }
if (cL1 == true) { button.setAttribute("class", "button button2"); }
}
button.setAttribute("type", "button");
button.setAttribute("id", val);
button.setAttribute("name", val);
var testDiv = document.getElementById(div);
testDiv.appendChild(button);
button.addEventListener ("click", function() { makeButton(div, val); })
}
window.onload = function() {
makeButton("test1", "t1test");
makeButton("test2", "t2test"); }
</script>
</body>
</html>
<button id="submit">Submit</button>
</form>
-
回答 3 已采纳
I would like to create a form with multiple submit link buttons. I know it can be done by using and specifying the name of <button> or <input type="button"> something like this:
In HTML:
<form action="" method="get">
Other form elements here...
<button type="submit" name="activated">Activated</button>
<button type="submit" name="pending">Pending</button>
<button type="submit" name="suspended">Suspended</button>
</form>
In PHP:
<?php
if(isset($_GET["activated"])) {
Activated codes here...
}
elseif(isset($_GET["pending"])) {
Pending codes here...
}
elseif(isset($_GET["suspended"])) {
Suspended codes here...
}
?>
I want the submit buttons to be done by using link, not <button> or <input type="submit"> something like this:
<a href="#">Activated</a>
<a href="#">Pending</a>
<a href="#">Suspended</a>
I heard that it can be done by using JavaScript or JQuery but I don't know how, anyone knows?
Update: What I want to happen is when I clicked the "Activated" link for example, I want only to process the logic under isset($_GET["activated"]).
The reason behind:
The reason why I want to have a submit link buttons instead of normal submit button tags is that, I want to use this bootstrap dropdown button style to change the status of user(s) on table:
and it is based on links, so that's why.
PS: Sorry for bad English, not my native language.
-
PlayYoung的博客 该函数可以安全地将 javascript 代码加入到 ...用wp_enqueue_scripts引入scripts脚本，可以避免scripts在后台被渲染，当你发现后台的功能出现问题时，很可能是主题或者插件没有正确界定脚本范围引起的，把只在前 -
大任Dren的博客 在 WordPress 中加载 JavaScript 最好使用 wp_enqueue_script() 函数以减少问题提高效率 WordPress 本身以及主题和插件通常需要加载一些 JavaScript 来实现某些特殊功能。为了最大限度地保证兼容性... -
卑微的戏子的博客 描述：用于设置公共变量、加载 WP 的程序和类库（存储 WP 函数、类和核心内容所在文件夹的位置）。用户无需修改此文件，但是可以通过修改 wp-config.php 文件来进行配置。 定义 WPINC 常量，并引入初始化所需文件... -
开发傻屌的博客 在wp-includes\general-template.php function wp_head() { ... * Print scripts or data in the head tag on the front end. * * @since 1.5.0 */ do_action( 'wp_head' ); } -
511遇见的博客 WordPress引入css/js是我们制作主题时首先面对的一个难点，任何一款主题都要加载自己的css,js,甚至很有可能还需要加载Jquery文件,网上方法特多，说法不一，我们今天借鉴wordpress官方最新的twentysixteen主题来学习... -
culi4814的博客 wordpress 漏洞As a developer or design professional, one of the biggest benefits of building your sites on WordPress is that in most cases you are building your code on a proven platform which has ... -
-
TensorFlow学习的博客 WordPress函数 / Function Reference / wp_enqueue_script 描述 使用wp_enqueue_script()函数安全的将JavaScript脚本添加到WordPress生成的页面。wp_enqueue_script()函数会加载未被加载的脚本，并安全的处理... -
黑面狐 sa~的博客 原文：...这篇来介绍下 conent_scripts 的用法。Content_scripts 简介假如你想把访问到的页面里的图片都加上好看的边框你该怎么做？用目前学习的东西，你是无法实现这个功能 -
卑微的戏子的博客 通过 RESTful API 获取信息时，这种认证是不需要的，直接获取就可以了。只有在发送信息(POST)到 API 的时候才需要用户认证，否则将返回HTTP 403 未授权错误。今天我们来介绍一下最简单的 Cookie 认证方式。 认证...