Add a Drop Shadow to Your Images
Adding a drop shadow to your images gives your image depth and perspective. It makes it look like the image is popping right out of the screen!
| Images without a drop shadow effect: | |
| Images with a shadow drop effect: |
- Turn on drop shadows
- Edit the drop shadow settings
Turn on drop shadows
To add a drop shadow to your images:
- Select the Design tab at the top of the Websites app.
- In the Design preview window, click on the image that you'd like to add a drop shadow to. This will open the image or gallery's settings on the right-hand sidebar.
- Scroll down until you reach the section labeled Images.
- In the Images section, check the box labeled Add drop shadow.
Edit the drop shadow settings
After you turn on the "Add drop shadow" setting, the sidebar will expand to show additional design options for drop shadows. Below is a list of the available drop shadow settings:
| X offset | Change where the blur appears on the X axis, or from left to right. |
| Y offset | Change where the blue appears on the Y axis, or up and down. |
| Color | A pop-up lets you change the color and opacity of the drop shadow. |
| Blur | Change the lining of the blur effect, making it blend more smoothly or giving it a harsher edge. |
| Spread | Change the amount of space the drop shadow takes up (expand or make it smaller). |
Once you make the drop shadow the way you want, click the green Save button, and then the Publish button to take your changes live!
Related Articles
Add an Image or Image Gallery to a Page
You can add images to your website using either an Image block, for a single picture, or an Image Gallery block, for multiple photos. Add an Image Block Select the Pages tab and open the page where you want to add the image. Click the (+) button at ...Add a Link to an Image
You can insert a hyperlink into an image on your website. When a user clicks on your image, they will be redirected to the page of your choice. To add an image hyperlink: Navigate to the Pages tab at the top of your Websites app, and open the page ...Image Collection
Manage Your Image Collection The Image Collection is your central hub for managing all the images on your website. Every image you upload to a page is also saved here, giving you a dedicated library to organize, bulk-upload, or bulk-delete images ...Image Tool Tabs
The Image Collection allows you to edit image information with great detail. Each image has a Details, SEO, and Tags tab that allows you to modify the information for surface-level information, as well as SEO-level information. To access the image ...Add an Image or Logo to Your Footer
If you are looking to add an image to your website's footer - such as the logo of your company, awards you have received, or any professional organizations you belong to - you can do so by following the steps below. Adding an image to the footer Part ...