Wordpress : Remove JavaScript code from search result page - javascript

I’m using a slideshow on a wordpress site (Layerslider).
It creates some javascript code inside the source code (like :
<script type="text/javascript">
var lsjQuery = jQuery;</script><script type="text/javascript">
lsjQuery(document).ready(function() {
// code from the slider
}
});
</script>
The issue is that when i search something on the website with the native search field, the javaScript is visible in the result. I've tried with a native theme (Twenty Fourteen) and the issue is still here.
See screenshot :
Do you know how to remove this code from the result ?

Related

Auto Loading HTML in a Div with Javascript

I'm looking to use this code in JS Fiddle http://jsfiddle.net/syE7s/ to load some content into a div.
It's exactly what I need but I want link A to auto load when the page loads. My knowledge of Javascript is fairly minimal so if someone could get it working in jsfiddle I would be very greatful.
I've tried googling everything but I just can't seem to make it work.
It is essential I use the HTML as the links I use parse tokens that use {} to identify them as tokens but it obviously gets confused with Javascript when they are sat together.
enter code here
thanks
Here is a working JS Fiddle, I added a function to load the first link :
function launch() {
var link = $('#A').attr("href");
$('#target').load(link);
}
launch();
http://jsfiddle.net/dhmLjme6/
You can add just one line to your javascript.
It will look like this (line 3):
$(document).ready(function(){
$('#target').load($('.trigger').attr("href"));
$('.trigger').click(function(e){
e.preventDefault();
var link = $(this).attr("href");
$('#target').load(link);
});
});

Javascript code for Div slide down effect?

I've been trying to create a Div 'slide down' effect for quite a while now and I found this JS Fiddle which gives an example of exactly what I want; http://jsfiddle.net/L5P2Y/368/ . It uses this code:
$(document).ready(function() {
var $cont;
function tgl_conts(){
$('.content').stop().animate({height: 0},1200);
$cont.stop().animate({height:210},1200);
}
$('.tab').on('click',function(){
var tabClass=$(this).attr('class').split(' ')[1];
$cont = $('.'+tabClass+':not(.tab)');
var h = ($cont.height() === 0) ? tgl_conts() : ( $cont.stop().animate({height: 0},1200) );
});
});
I've copied all the code, including the HTML and CSS into my own document in the hope that I can just manipulate that into what I want. All I have is this exact code that is on the JS Fiddle, but I still cannot get the JavaScript to work despite it working fine in this example. I've pasted it between the head tags between two script tags but it still does not function. Why isn't it working? Is it in the wrong place? I'm very new to JavaScript.
Thanks
You need to load your code snippet after jQuery 1.7 is loaded on the page
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
// you're code
</script>

JavaScript not Initializing in Drupal Block

I have the following fiddle: http://jsfiddle.net/VYbLX/125/
The purpose is to update a thumbnail with the appropriate selection in the dropdown menu. I'm attempting to implement this piece of code inside of a Drupal block that will be dropped into a specific page.
The page it is implemented on is: http://sulzbachercenter.org/fundraisers/give-a-good-night
In order to implement the code, I've rewritten the JS into a separate file and called it like this:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://sulzbachercenter.org/sites/default/files/ggn_js/dyn.js"></script>
The block can run PHP and HTML fully, so I know that's not an issue - but I'm out of troubleshooting ideas. Can anyone see why this code won't work in the Drupal environment?
The jQuery selector is looking for '#dynSelect', but the combobox in the form does not have an 'id'.
You can either add the id="dynSelect" to the combobox.
or
Change
$('#dynSelect').change(function () {
var val = $('#dynSelect').val();
$('#dynImg').attr("src",pictureList[val]);
});
to something like:
$("select[name='os0']").change(function () {
var val = $("select[name='os0']").val();
$('#dynImg').attr("src",pictureList[val]);
});

wordpress flexslider is not a function

I'm developing custom theme for wordpress and using META SLIDER plugin for that, but in rendering page. in firebug result that says:
$(...).flexslider is not a function
line 242 :
useCSS:false
full attached java script with plugin:
<script type="text/javascript">
var metaslider_99 = function($) {
$('#metaslider_99').flexslider({
slideshowSpeed:3000,
animation:"fade",
controlNav:true,
directionNav:true,
pauseOnHover:true,
direction:"horizontal",
reverse:false,
animationSpeed:600,
prevText:"<",
nextText:">",
easing:"linear",
slideshow:true,
useCSS:false
});
};
var timer_metaslider_99 = function() {
var slider = !window.jQuery ? window.setTimeout(timer_metaslider_99, 100) : !jQuery.isReady ? window.setTimeout(timer_metaslider_99, 100) : metaslider_99(window.jQuery);
};
timer_metaslider_99();
</script>
Is this an issue of the order of the stacking of the javascript files?
LINK:
Please see this link
Your theme looks like it's missing a call to wp_footer() (it looks like its missing the whole footer.php actually).
Meta Slider needs this in place in order to enqueue the correct JavaScript and CSS files.
Please see this page:
http://codex.wordpress.org/Function_Reference/wp_footer

Dynamically change thr URL of the Pin It (Pinterest) button

I'm currently trying to add social networks's buttons to my website but I've encountered an issue with the Pin It button from Pintesrest. I'd like to dynamically change the URL of the pin but unfortunately, it seems to not working. Did I do something wrong?
<script type="text/javascript">
var urlpin = document.location.href;
function buildPinUrl(urlpin, urlmedia, description) {
return '//pinterest.com/pin/create/button/?'+
'url='+encodeURIComponent(urlpin)+
'&media='+encodeURIComponent(urlmedia)+
'&description='+encodeURIComponent(description);
}
$(document).ready(function(){
var urlmedia = $("#stamp1").attr("src");
var description = $("#title").text();
var goodurl = buildPinUrl(urlpin, urlmedia, description);
$('#pinbtn').attr('href', goodurl);
});
</script>
And here the button:
<!-- Pin It Button --><a id="pinbtn" href="//pinterest.com/pin/create/button/?url=http%3A%2F%2Fcollectionnies.com&media=http%3A%2F%2Fcollectionnies.com&description=Next%20stop%3A%20Collectionnies" data-pin-do="buttonPin" data-pin-config="beside"><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /></a><!-- Pin It Button -->
Thanks for your help.
With jQuery 1.6+ (up to edge), this works fine:
http://jsfiddle.net/mmKcR/
Check to make sure that jQuery is loaded before this code appears in the html. Also make sure you are not loading jQuery in noConflict mode, as this will break the use of the $.
If this still fails for you, use the Chrome/Firefox inspector to view any console errors.
If you see an error like:
Uncaught ReferenceError: $ is not defined
One of the two above issues is at fault.

Categories