Serve BigCommerce images from Sirv CDN
You can improve your web page optimization by replacing your BigCommerce images with images served by Sirv CDN.
Benefits of serving images with Sirv:
- Perfectly optimized, with configurable settings that you control.
- Scaled-down to dimensions that suit each users' viewport.
- Served in a resolution that suits each users' screen.
- Served in next-gen formats where appropriate, such as WebP.
- Served from the nearest city across Sirv's global CDN.
- Lazy loaded, so images are only served if needed.
How to serve BigCommerce images from Sirv
1. Download this HTML template: responsive-img.html (right-click and "Save link as").
2. Upload that template to the following location in your BigCommerce admin. We recommend backing up the existing template, in case you want to restore it later.
templates/components/common/responsive-img.html
3. Download this HTML template: product-view.html (right-click and "Save link as").
4. Upload that template to the following location in your BigCommerce admin. We recommend backing up the existing template, in case you want to restore it later.
templates/components/products/product-view.html
5. In both of those new files, replace your-sirv-account with your Sirv your account name.
6. Open the following template:
templates/layout/base.html
and add the following code before the </head> tag:
<link rel="preconnect" href="https://scripts.sirv.com" crossorigin> <link rel="preconnect" href="https://your-sirv-account.sirv.com" crossorigin> <link rel="dns-prefetch" href="https://scripts.sirv.com"> <link rel="dns-prefetch" href="https://your-sirv-account.sirv.com"> <script src="https://scripts.sirv.com/sirvjs/v3/sirv.js?modules=lazyimage"></script>
Replace your-sirv-account with the name of your account.
The preconnect and dns-prefetch code will help prioritise the connection to Sirv.
The sirv.js script will enable images to be requested at a size scaled to the users' device.
7. Activate the Auto-Fetch option to request images from the BigCommerce domain where your images are stored. For example:
https://cdn11.bigcommerce.com
Help from the Sirv team
If you would like help implementing Sirv CDN for your BigCommerce images, please message the Sirv customer success team.