Is there a way to stop WordPress plugin assets like CSS and JS files from loading on every single page?

Currently, I am utilizing a wordpress slider plugin called Master Slider (https://wordpress.org/plugins/master-slider) on the homepage of my website - http://lanarratrice-al-rawiya.com/lanarratrice

However, I have noticed that even though the slider is only used on the home page, the css and js files associated with the slider are being loaded on all pages, resulting in an increased number of http requests. Is there a way to ensure that the slider css and js files are only loaded on the home page?

I attempted to implement the following code snippet in the functions.php file, as outlined in this resource (http://justintadlock.com/archives/2009/08/06/how-to-disable-scripts-and-styles), but unfortunately, it did not work.

add_action( 'wp_print_scripts', 'my_deregister_javascript', 100 );
function my_deregister_javascript() {
    if (!(is_front_page()) {
        wp_deregister_script( 'jquery-easing' );
        wp_deregister_script( 'masterslider-core' );
    }
}

Fortunately, within the Master Slider admin section, there exists an advanced setting that allows for the prevention of the js and css from loading on all pages, which is illustrated in the attached image.

javascriptjquerycsswordpress

Answer №1

There is a mistake in your code where you forgot to close the if condition with ): 

if (!(is_front_page()) {

The correct way to write it is: 

if ( !( is_front_page() ) ) { 
OR
if ( ! is_front_page() ) {

If you want to retrieve all the enqueued css and scripts, you can use the following code: 

global $wp_scripts, $wp_styles;
//var_dump( $wp_scripts );
//var_dump( $wp_styles );

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Challenges arise with the height settings of ui-grid

Currently, I am facing an issue with using height: auto on an angularJS ui-grid. The problem arises from an inline style that specifies a fixed height on the div to which the ui-grid attribute is added. Additionally, the function getViewPortStyle() dynamic ...

javascriptcssangularjsangular-ui-grid

Steps to include a progress bar in Jssor slider similar to the one found in Revolution Slider

Greetings! I'm currently working on creating a slider for my website using Jssor Slider with jQuery. I recently came across a progress bar, also known as a timer bar, on the revolution slider. You can view an example of it here - Thank you in advanc ...

jquerysliderprogress-barjssor

Retrieve the names contained within TD elements using the console

I always enjoy experimenting with new things. Take a look at the https://lodash.com/docs/4.17.15 lodash documentation site where you'll find a menu on the left side featuring all available functions. Is there a way to extract the names of these functi ...

javascriptgoogle-chromefirefoxconsole

What is the reason for the getter not being able to retrieve the value

I am experiencing an issue with a getter that returns an array of objects. The challenge I face is that I need to display past and current warnings in separate components. The getter currently only retrieves the current warning and ignores any past warnin ...

javascriptvue.jsvuexvuex-modules

Guide to using the Strapi Upload Plugin: Uploading a file from a remote source using a scheduled task

Utilizing the strapi upload plugin with s3 as the provider has been a seamless experience when making API calls to the upload endpoint on my strapi instance (/upload). However, I am facing a dilemma with a cron job within our repository that monitors image ...

javascriptnode.jsstrapi

Having trouble with Javascript in getting one-page scroll navigation to work?

Hey there, I am working on creating a one-page scroll navigation with some basic javascript to add a smooth animation effect that takes 1 second as it scrolls to the desired section. However, I seem to be experiencing an issue where it's not functioni ...

javascriptjqueryhtmlcss

Checking for the presence of the key name "item[]" within an object in AngularJs

I currently have an object called "obj" with two keys: "goal" and "item[]". It looks like this: var obj = {goal:"abc",item[]:"def"}; These keys and values are dynamically generated. Now here's the problem - I need to determine if these keys exist ...

javascriptarraysangularjsobject

An error of type TypeError is occurring for each array of objects beyond the first index

Using react leaflet and a water API, I have created an array of objects from the data obtained from the API. The console log shows that all the correct data is present, with line 109 displaying the accurate information. However, at lines 254 and 255, when ...

javascriptarraysreactjsreact-hooksreact-leaflet

Use jQuery to add a class to each element of X, Y, and Z

I need to assign a specific class to certain elements (X, Y, Z) in the code snippet below. $('.interactive-banner-faces>:nth-child(1)').addClass('rightTxt'); $('.interactive-banner-faces>:nth-child(2)').addClass(&a ...

javascriptjquery

Why is "this" not able to be located within the module upon clicking the button?

Having trouble with a module creation issue. When I try to append a list item on button click, why is my object property this.config undefined? Check out my code snippet here: https://jsfiddle.net/5hrcwj8g/ When the button is clicked, I call this functio ...

javascriptjquery

"Underscores in an array of primary keys serve as markers for

I want to filter a list of objects using underscore based on their primary key being included in a specific array of primary keys. list = [object{pk: 1}, object{pk: 2}, object{pk: 3}] primary_key_list = [1,2] The desired outcome is to return [object{pk: ...

javascriptunderscore.js

Importing template Vue files into Router in Vue.js

Hello everyone, I have a Vue.js project that I am working on and I am looking to import a vue template file into my index.html without using webpack or browserify. It seems like I will need to use a router to accomplish this and include some additional Ja ...

javascriptvue.jsvuejs2

The compatibility issue with Bootstrap Select 1.13.1 persists, despite being implemented alongside Bootstrap 4

This is a simple code example I tested using bootstrap-select: <html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloud ...

jqueryhtmlcssbootstrap-4bootstrap-select

Creating a universal mock object in AngularJS, specifically designed for testing with Jasmine and Karma

When it comes to unit testing, I've created a mock object that I use in my test files like this: var mockObject = { mockMethod1 : function() {return true}, mockMethod2 : function() {return true} }; beforeEach(module('myModule') , ...

javascriptangularjsunit-testingjasminekarma-runner

JavaScript WYSIWYG Algorithm

Despite my searches on SO, it appears that most questions revolve around simply making a div editable using contenteditable="true". I am interested in finding the most effective method for tracking all formatting tags applied to a document. Merely togglin ...

javascriptjqueryhtmlcss

My webpage lacks responsiveness

I've recently put together an HTML page, but unfortunately, it's not responsive. My Code <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> ...

htmlcss

Tips for triggering a postback with jquery autocomplete when an option is selected

TEST AREA I've put together a basic demo of jquery-ui autocomplete. QUERY How do I trigger a postback when a selection is made from the autocomplete list? HTML <select id="ddl"></select> <input id="field" type="text"></input& ...

javascriptjqueryasp.netautocompletepostback

Tapping on the emphasized hyperlink within an unorganized roster

I am currently working on a page and have encountered an issue. The problem lies in the fact that users must click on a link before they are redirected to the target page. Is there a way to make the highlighted box for each of those links active so it resp ...

htmlcss

Styling on Material UI Button disappears upon refreshing the page

I've been using the useStyles function to style my login page, and everything looks great except for one issue. After refreshing the page, all styles remain intact except for the button element, which loses its styling. Login.js: import { useEffect, ...

javascriptreactjsmaterial-uistyling

Creating a dynamic className string in JavaScript with React

In my current project, I'm implementing mobile support by creating separate styles for desktop and mobile. Although most components are the same on both platforms, I have two .scss files dedicated to each. To apply the correct styles, I use a combina ...

javascriptcssreactjswebsass