Set Expiration Dates

Just started coding for the first time and encountered an issue with Add Expires Header while testing my website on Gtmetrix. YSlow reported that I have 60 Add Expires Headers.

http://www.whirloo.com/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=4.9.2
http://www.whirloo.com/wp-content/plugins/woocommerce/assets/css/woocommerce-layout.css?ver=3.2.6
http://www.whirloo.com/wp-content/plugins/woocommerce/assets/css/woocommerce.css?ver=3.2.6
http://www.whirloo.com/wp-content/plugins/wordpress-social-login/assets/css/style.css?ver=4.9.1
http://www.whirloo.com/wp-content/plugins/js_composer/assets/css/js_composer.min.css?ver=5.4.5
https://fonts.googleapis.com/css?family=Open+Sans:400,600%7CRoboto:400,500,400italic
http://www.whirloo.com/wp-content/plugins/google-analytics-for-wordpress/assets/js/frontend.min.js?ver=6.2.6
http://www.whirloo.com/wp-includes/js/jquery/jquery.js?ver=1.12.4
http://www.whirloo.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1
http://www.whirloo.com/wp-content/plugins/woocommerce/assets/js/frontend/add-to-cart.min.js?ver=3.2.6
http://www.whirloo.com/wp-content/plugins/js_composer/assets/js/vendors/woocommerce-add-to-cart.js?ver=5.4.5
http://www.whirloo.com/wp-content/themes/publisher/includes/libs/better-framework/assets/css/bs-icons.css
http://www.whirloo.com/wp-content/plugins/better-social-counter/css/style.min.css
http://www.whirloo.com/wp-content/themes/publisher/includes/libs/better-framework/assets/css/slick.min.css
http://www.whirloo.com/wp-content/plugins/better-adsmanager/css/bam.min.css

Tried using code from other Add Expires Header posts in my .htaccess file, but it didn't resolve the issue. These headers are from content in plugins, themes, uploads, and fonts. Any suggestions on how to fix this problem? Thanks!

Answer №1

To optimize your website's performance, consider implementing the following in your .htaccess file:

# START Expiry headers
<IfModule mod_expires.c>
 ExpiresActive On
 ExpiresDefault "access plus 7200 seconds"
 ExpiresByType image/jpg "access plus 2592000 seconds"
 ExpiresByType image/jpeg "access plus 2592000 seconds"
 ExpiresByType image/png "access plus 2592000 seconds"
 ExpiresByType image/gif "access plus 2592000 seconds"
 AddType image/x-icon .ico
 ExpiresByType image/ico "access plus 2592000 seconds"
 ExpiresByType image/icon "access plus 2592000 seconds"
 ExpiresByType image/x-icon "access plus 2592000 seconds"
 ExpiresByType text/css "access plus 2592000 seconds"
 ExpiresByType text/javascript "access plus 2592000 seconds"
 ExpiresByType text/html "access plus 7200 seconds"
 ExpiresByType application/xhtml+xml "access plus 7200 seconds"
 ExpiresByType application/javascript A2592000
 ExpiresByType application/x-javascript "access plus 2592000 seconds"
 ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"
</IfModule>
# END Expiry headers

Simplify things by using Cloudflare to handle these configurations automatically for you.

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

Unable to dynamically update properties in CSS and JavaScript without refreshing the page

I've tried applying active properties in my CSS and JavaScript, but it doesn't seem to be working as expected. I can click on each list item, but the active state is not being displayed correctly. Can someone please assist me with this issue? I w ...

Is there a way to effectively overwrite CSS styles when utilizing @extend with another class in SCSS?

Here is some SCSS code I am working with: .a { height: 100px; width: 100px; } .b { @extend .a; height: 200px; } After compiling, the CSS appears as follows: .a, .b { height: 100px; width: 100px; } .b { height: 200px; } Whe ...

Deliver data in batches of ten when the endpoint is accessed

I am currently in the process of developing a web application using Next.JS and Node. As part of this project, I have created my own API with Node that is being requested by Next.JS. One particular endpoint within my API sends data to the front end as an ...

How do browsers typically prioritize loading files into the cache?

Out of curiosity, I wonder if the categorization is determined by file names or byte code? It's possible that it varies across different browsers. Thank you! ...

Instructions on adjusting the image size within a MUI Card

import { Card, CardActionArea, CardContent, CardMedia, Typography, } from "@mui/material"; import React from "react"; import { styled } from "@mui/material/styles"; const CardImage = styled("div")(({ theme ...

Encountering the error "Module 'aws-sdk', 'child_process', 'net' cannot be resolved" within the /node_modules/watchpack directory when using Webpack

I'm encountering issues while trying to compile my prod webpack file, specifically receiving 5-10 errors related to "cannot resolve module" aws-sdk and child_process. All of these errors seem to point back to the same path: "ERROR in (webpack)/~/watc ...

Utilizing getStaticProps for Performance Optimization in Next.js

I am currently in the process of setting up a blog using Next.js and GraphCMS. I have an ArticleList component that I want to display on multiple pages, such as my homepage and under each article as a recommendation. Since the article list is sourced from ...

Is it possible to retrieve a specific property from an object in JSON format using Javascript?

As a beginner in JavaScript, I've been diving into the world of objects and trying to grasp how they function. var data = JSON.stringify({name: "Y", age: 1990}); console.log(data); // → {"name":"Y","age":1990} Out of sheer curiosity, I decided to ...

Is there a way to run a Javascript function only after an onload event has occurred and returned a specific value?

This question may be a bit lengthy, so I'll do my best to provide an explanation. There are two JavaScript functions that need to execute after the page loads - let's call them function1() and function2(). function1() uses AJAX to fetch data fro ...

Creating a ListView in React Native and utilizing the CloneWithRow method with an object instead of an

When retrieving data from a webservice, I am able to work with JSON arrays without any issues. WebServiceHandler.get('http:/api.local/stock',{},{) .then((val)=>{ this.setState({ dataSource: this.state.dataSou ...

wordpress website experiencing a logo consistency issue on mobile devices

Issue with displaying custom logo on mobile devices persists even after updating theme options. Since the default logo continues to appear, the next step is to locate the default logo in the theme coding and replace it with the desired custom logo specific ...

Retrieving and submitting text in a NodeJS environment

I'm attempting to retrieve text from an API that only provides a string of text ((here)), but I am encountering difficulties in displaying it accurately. When I try to post it, the output shows as [object Response], and the console.log is not showing ...

How to use JavaScript regular expressions to extract the content following the second-to-last occurrence of a back

I currently have a regular expression that looks like this: /^.*[\\\/]/ At the moment, it removes every single backslash from a string. However, now I need to modify it in order to capture everything after the second to last backslash. Fo ...

An unusual combination of '||' and '&&' occurred while utilizing babel

I've encountered an issue while building and publishing a package on npm with babel. The build process is showing me the following warning: Line 1: 'use strict' is unnecessary inside of modules strict Line 23: Unexpected mix of '| ...

I want to know how to shift a product div both horizontally and vertically as well as save its position in And Store

How can I animate and move a product div horizontally & vertically, and save its position for future visits? I need to move the div with animation in a specific sequence and store the position using PHP. Buttons <button type="button" href ...

Is there a way to ensure that a "catch all other" route in the Vue Router will also capture the URL if a portion of it matches a predefined route?

After following the suggestion to implement a catch all route from this article, I realized that it does not capture URLs that partially match a defined route. routes: [ { path: "/album/:album", name: "album", component: Album, } ...

"Utilize Typescript to create a function within a nested object structure

I have a scenario where I am trying to access the foo variable inside the function a of the test object. class bar { private foo: string = "foobar"; constructor() { /* ... Implementation ... */ } fncA(): this { // ... implementation ...

How can I find the URL of a webpage that is not showing up in the search bar? Utilize Google Instant

I'm currently working on an extension and I've encountered a challenge... I'm trying to figure out how to extract the URLs from a Google instant search page. The browser's URL bar doesn't seem to update instantly, so I'm unsur ...

Creating uniform image heights using Flexbox

My webpage features a library of books, with each book displayed in rows within a flexbox container. Each book is represented as a separate block consisting of a heading (the book's name) and an image of the book cover directly below it. I'm curr ...

Build an upvote feature using PHP and WordPress that allows users to vote without causing a page reload

Just starting out as a developer and currently working on a website using WordPress. I want to implement an upvote button that allows users to upvote a post without the page needing to refresh. I understand that I'll need to use JavaScript to highligh ...