To change the homepage banner image in the simplest way, you can use custom CSS & JS. This method allows you to update the banner image and modify its CSS as needed.
Steps to Change the Homepage Banner Image:Access Custom CSS & JS:
1. Navigate to Frontend CMS > Custom CSS & JS in your admin panel.
2. Write the Code
Insert the following CSS code to change the banner image. Below is an example for homepage V2:
.banner-img img {
display: none !important;
}
.banner-img {
background-image: url('https://images.pexels.com/photos/1563356/pexels-photo-1563356.jpeg') !important;
}
3. Modify the Code
Replace the URL inside background-image: url('YOUR_IMAGE_URL_HERE') with the link to your desired image.
Ensure that the correct CSS selector for the homepage banner is used.
4. Customize the Banner (if needed)
Add additional CSS styling if required to further modify the banner’s appearance.
5. Save and Apply Changes
Click on Update to apply the changes.
Refresh the front end to view the updated banner.
Before banner change:
After banner change:
