So, I'm a novice at WordPress. I've got this in functions.php which loads the script on every page that gets the footer:
// flexslider custom settings
add_action('wp_footer', 'aplace_flexslider_settings');
function aplace_flexslider_settings() {
?>
<script>
jQuery(document).ready(function($){
$('.flexslider').flexslider();
});
</script>
Is there a way to customized this so that its called only on the static front page? For example, can I make a custom hook that I'd add_action to and then just get_customHook on the front page? That would disassociate it with the footer, right? I'm so confused...
Just wrap your function in an if statement:
function aplace_flexslider_settings() {
if(is_front_page()) { ?>
<script>
jQuery(document).ready(function($){
$('.flexslider').flexslider();
});
</script>
<?php } } ?>
Related
I wrote a code to add a js to specific pages in wordpress. but if I want to:
1- run the code in specific pages how can I change the code?
2- or run the code in everywhere except in some page IDs?
how can I cahnge that?
thanks in advance to everyone! :D
function wpb_hook_javascript() {
if (is_page ('727')) {
?>
<script type="text/javascript">
my script
</script>
<?php
}
}
add_action('wp_head', 'wpb_hook_javascript');
I think this would be as easy as
function wpb_hook_javascript() {
if (!is_page(array('the', 'excepted', 'pages'))) {
wp_enqueue_script('script_name', 'script_path.js')
}
}
add_action( 'wp_enqueue_scripts', 'wpb_hook_javascript' );
I used wp_enqueue_script because I like it more, but obviously you can stay with injecting it into the head directly, depending on what it does.
Edit: Pretty sure it would work like this:
add_action( 'wp_head', function() {
if (!is_page(array('the', 'excepted', 'pages'))) {
?>
<script type="text/javascript">
my script
</script>
<?php
}
}
Compare logical operators in php, is_page, arrays in php and wp_enqueue_script.
I need to make all html links of my wordpress website dont end in "?amp=1".
For example the link:
Page 1
It should change to:
Page 1
I have added the following code to my functions.php file but unfortunately it doesn't work.
function remove_amptoamp_links(){
?>
<script type="text/javascript">
jQuery(document).ready(function($){
$('a').each(function(){
if(this.href.indexOf("?amp=1") != -1)
{
var href=this.href.split("?amp=1")[0];
this.href = href;
}
});
});
</script>';
<?php
}
add_action('wp_footer', 'remove_amptoamp_links');
Some help? Thanks!
I have finally discovered that AMP does not allow Javascript to be executed.
I want to add inline script to just a single page, so trying to add in the page template file. However, both placements of the code above or below the footer call results in nothing being outputted in the source.
I can't figure out how this is supposed to work, can anyone help?
** Page Template **
<?php
get_footer('blank');
function cardpay_demo_script() {
wp_add_inline_script(
'jquery',
'$(".btn-next").click(function() {
$(".nav-pills .active").parent().next("li").find("a").removeClass("disabled").trigger("click");
});'
);
}
add_action('wp_enqueue_scripts', 'cardpay_demo_script');
** Footer File **
<?php wp_footer(); ?>
</body>
</html>
You are placing the function on the wrong file.
The function should go on the theme's functions.php file and not any default template file or your custom template file.
The reason for this is that in WordPress; an Action is a PHP function that is executed at specific points throughout the WordPress Core and since your custom templates will be called way after the hook has been triggered the function will never actually run, so it won't print anything.
You can use is_page() or is_page_template() to determine if it is the page or page template you're looking for.
Here is some additional information on action hooks: https://codex.wordpress.org/Glossary#Action
add_action( 'wp_enqueue_scripts', function () {
if( !is_page_template('My Template') ) return;
if ( ! wp_script_is( 'jquery', 'done' ) ) {
wp_enqueue_script( 'jquery' );
}
wp_add_inline_script( 'jquery', '$(".btn-next").click(function() { $(".nav-pills .active").parent().next("li").find("a").removeClass("disabled").trigger("click");
});' );
});
or you can just print your scripts on the footer using the wp_footer hook. Just put this on your theme's functions.php file
add_action('wp_footer', function (){
if( !is_page_template('My Template') ) return;
?>
<script type="text/javascript">
jQuery(".btn-next").click(function() { jQuery(".nav-pills .active").parent().next("li").find("a").removeClass("disabled").trigger("click");
});
</script>
<?php
});
I have a codeigniter project, where I want to use some js.
I have file with my js:
<script type='text/javascript' src='/utilities/assets/js/main.js'> and jquery
<script type='text/javascript' src='/utilities/assets/js/jquery.js'>
The both are availaible from my site, I can look it's content.
I have such code at main.js
$(document).ready(function ()
{
alert('Javascipt works');
}
When I load page, nothing happens.
I tried load javascript class of codeigniter, but when I tried in my view:
<?php echo $library_src;?>
<?php echo $script_head;?>
It says that that libraries are undefined. How can I use js there?
You are missing ); at the end. The function is never closed.
Try
$(document).ready(function ()
{
alert('Javascipt works');
});
instead of
$(document).ready(function ()
{
alert('Javascipt works');
}
I am relatively new to Javascript/jQuery so please bear with me.
I'm designing a custom WordPress theme and I have been using jQuery to make some changes to the main navigation menu that is generated in my header file (header.php). I have been adding code like this inside the head tag:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script>
$(document).ready(function(){
$('nav').mouseover(function() {
// my mousecode here...
}); // end mouseover
}); // end ready
</script>
My question is simple really. My scripts have gotten so long that I want to move them to their own file (perhaps nav-mouse-events.js) and call them from within header.php. How do I do this? Is it as simple as putting the code inbetween the second script tags into a file named nav-mouse-events.js and then adding this to the head tag?
<script src="nav-mouse-events.js"></script>
Or do I need to do something more complicated? Do I need to call jQuery from the new external file or header.php?
You would put the scripts in a .js file and use wp_enqueue_script in functions.php to include them the proper way.
From the wordpress site:
<?php
function my_scripts_method() {
wp_enqueue_script(
'custom-script',
get_template_directory_uri() . '/js/custom_script.js',
array( 'jquery' )
);
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
?>
Add this line:
<script src="<?php echo get_bloginfo('template_url ');?>/nav-mouse-events.js"></script>
and save nav-mouse-events.js file with code:
$(document).ready(function(){
$('nav').mouseover(function() {
// my mousecode here...
}); // end mouseover
}); // end ready
in your template folder.