I am trying to conditionally include javascript files on specific pages in wordpress. I finally found a snippet of code that does exactly what I want but it doesn't seem to be working. Any thoughts? I didn't include the real page names but I am using the page slug.
<?php if (is_page(array('page-slug','page-slug','page-slug'))) { ?>
<script src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script>
<? } else { ?>
<script src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/conditional-script.js"> </script>
<? } ?>
I Put this code where I call the rest of my scripts in my custom template files.
On third last line and last line, it looks like you are using <? to open the line. Try using <?php instead. So, it should be:
<?php
if (is_page(array('page-slug','page-slug','page-slug')))
{ ?>
<script src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script>
<?php
}
else
{ ?>
<script src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/conditional-script.js"></script>
<?php
}
?>
And as I mentioned, I would recommend enqueuing scripts in the future ;)
Related
This is the code for the script,
but it's not working please help me.
<script>
function loading(){
$("#loading").removeAttr("hidden");
}
$(function () {
//Initialize Select2 Elements
$(".select2").select2();
$("#example1").DataTable();
});
</script>
This is the code for the script, but its not working please help me.
<script src="<?php echo base_url()?>public/jquery-1.12.3.min.js"></script>
<script src="<?php echo base_url()?>public/bootstrap/js/bootstrap.min.js"></script>
<script src="<?php echo base_url()?>public/app.min.js"></script>
<!-- DataTables -->
<script src="<?php echo base_url()?>public/datatables/jquery.dataTables.min.js"></script>
<script src="<?php echo base_url()?>public/datatables/dataTables.bootstrap.min.js"></script>
<!-- Select2 -->
<script src="<?php echo base_url()?>public/plugins/select2/select2.full.min.js"></script>
this image is the console error please click here
I Fix it on my Own..
I have a "colspan= 2" in the view table and i have a extra "td" in my code thanks to all your comment.
i make control panel and there is a problem with jquery (data-toggle) not working and this message appear in console" bootstrap.min.js:6 Uncaught Error: Bootstrap's JavaScript requires jQuery at bootstrap.min.js:6 "
this is footer file
<div calss="footer">
</div>
<script src="<?php echo $js; ?>jquery-3.2.1.min.js"></script>
<script src="<?php echo $js; ?>jquery-ui.min.js"></script>
<script src=" <?php echo $js; ?>bootstrap.min.js"></script>
<script src="<?php echo $js; ?>jquery.selectBoxIt.min.js"></script>
<script src="<?php echo $js; ?>backend.js"></script>
</body>
</html>
and i include footer
include $tpl.'footer.php';
and thats working in main site with the same folders and pathes and names
i dont know whats wrong
Try this
Change the order of files it should be like below..
<script src="<?php echo $js; ?>jquery-3.2.1.min.js"></script>
<script src="<?php echo $js; ?>bootstrap.min.js"></script>
<script src="<?php echo $js; ?>jquery-ui.min.js"></script>
<script src="<?php echo $js; ?>jquery.selectBoxIt.min.js"></></script>
<script src="<?php echo $js; ?>backend.js"></script>
I am making my first steps learning to code. I made some courses on Internet an now I decided to build a Wordpress theme so like this I can continue learning from the practice.
I decided to make an image slider, so for this I decided to install a Jquery plugin. I know that I can install a wordpress plugin but I think that it's convenient to learn how to install a Jquery plugin too for many reasons.
I followed these steps to install the bxSlider plugin, but unfortunately there is something that it's not ok and it makes my plugin doesn't work:
1) Functions.php: I loaded all the files that I need
function loadbxslider() {
wp_enqueue_style('bxstyle', '/jquery.bxslider/jquery.bxslider.css');
wp_enqueue_script('bxscript', '/jquery.bxslider/jquery.bxslider.min.js', array('jquery'));
}
add_action('init', 'loadbxslider');
2) Header.php: I wrote this before <?php wp_head(); ?>:
<!--?php wp_enqueue_script('jquery'); ?-->
<!--?php wp_head(); ?-->
And this inmediately after <?php wp_head(); ?>:
<script type="text/javascript">// <![CDATA[
jQuery(document).ready(function(){
jQuery('#slidebx').bxSlider({
mode: 'horizontal',
infiniteLoop: true,
speed: 2000,
pause: 8000,
auto: true,
pager: false,
controls: true
});
});
// ]]></script>
So the first part of my header.php is like this:
?><!DOCTYPE html>
<html <?php language_attributes(); ?> class="no-js">
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<?php if ( is_singular() && pings_open( get_queried_object() ) ) : ?>
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<?php endif; ?>
<!--?php wp_enqueue_script('jquery'); ?-->
<!--?php wp_head(); ?-->
<?php wp_head(); ?>
<script type="text/javascript">// <![CDATA[
jQuery(document).ready(function(){
jQuery('#slidebx').bxSlider({
mode: 'horizontal',
infiniteLoop: true,
speed: 2000,
pause: 8000,
auto: true,
pager: false,
controls: true
});
});
// ]]></script>
</script>
</head>
3) bxSlider inside my content: using the id slidebx
<div id="slidebx">
<div><?php the_field('image1'); ?></div>
<div><?php the_field('image2'); ?></div>
<div><?php the_field('image3'); ?></div>
<div><?php the_field('image4'); ?></div>
<div><?php the_field('image5'); ?></div>
<div><?php the_field('image6'); ?></div>
<div><?php the_field('image7'); ?></div>
<div><?php the_field('image8'); ?></div>
<div><?php the_field('image9'); ?></div>
<div><?php the_field('image10'); ?></div>
</div>
I have a week trying to discover why this plugin doesn't work. If you have some suggestion would be good for my learning process.
How automatically refresh only one module in joomla?
<?php if ($this->countModules('parite')) : ?>
<section id="parite" >
<jdoc:include type="modules" name="parite" style="xhtml" />
</section>
<?php endif; ?>
That was the answer I was looking for.
<script type="text/javascript" src="https://code.jquery.com/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
var refreshId = setInterval(function()
{
jQuery('#parite').load('<?php echo $this->baseurl ?>/modules/mod_parite/mod_parite.php');
}, 1000);
</script>
<div id="parite"></div>
Hi how can i aces in view model
i saved my css and javascript inside the js folder and css folder inside the application in codeigniter how can i aces it i'm having difficulties to link them
www
application
-jsfolder
-jsfiles
-cssfolder
-cssFiles
<?php
//birds.php
class Birds extends CI_Controller{
function index(){
$this->load->view('birds_view');
}
function get_birds(){
$this->load->model('birds_model');
if (isset($_GET['term'])){
$q = strtolower($_GET['term']);
$this->birds_model->get_bird($q);
}
}
}
<?php
//birds_model.php
class Birds_model extends CI_Model{
function get_bird($q){
$this->db->select('bird');
$this->db->like('bird', $q);
$query = $this->db->get('birds');
if($query->num_rows > 0){
foreach ($query->result_array() as $row){
$row_set[] = htmlentities(stripslashes($row['bird'])); //build an array
}
echo json_encode($row_set); //format the array into json data
}
}
}
}
bird_view.php
<style>
.ui-autocomplete-loading {
background: #fff url('../link/to/ajax-loading-image') right center no-repeat !important;
}
</style>
<link href="<?php echo base_url().'css/' ?>./css/jquery.ui.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo base_url().'js/'?>/js/jquery.js"></script>
<script type="text/javascript" src="<?php echo base_url().'js/'?>/js/jquery.ui.js"></script>
<input type="text" id="birds" />
<script>
$(function(){
$("#birds").autocomplete({
source: "birds/get_birds" // path to the get_birds method
});
});
</script
it only display white screen tnx in advance guys
You should link your css and js file as:-
<link href="<?php echo base_url().'css/jquery.ui.css'; ?>" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo base_url().'js/query.js'; ?>"></script>
<script type="text/javascript" src="<?php echo base_url().'js/jquery.ui.js'; ?>"></script>
do your really need that 'dot' after your closing php tag?
<?php echo base_url(); ?>./
also remove extra leading slashes:
<link href="<?php echo base_url(); ?>css/jquery.ui.css" />
<script type="text/javascript" src="<?php echo base_url(); ?>js/jquery.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>js/jquery.ui.js"></script>
p.s make sure that base_url is set properly in your config file: $config['base_url']='localhost/websitename/'
with a trailing slash