![]() Background Image Position: Bottom CenterĪnother important step to make this tutorial work is enabling the ‘Force Fullwidth’ option in the sizing settings of the Image Module.You can also download the illustrations that we’re using by going to the following post we’ve created on how to change a gradient background on hover. Go ahead and add a gradient background of your choice next.Īnd upload a PNG background image, or just a regular one if you don’t want the gradient background to show through. This will allow the background image and gradient background to show through in the upcoming steps. You’ll notice that one part of the image is completely transparent. We’ll start off by uploading the shaped image overlay. The only module we’ll need in column 1 is an Image Module. Time to switch over to Divi and create the outcome! Create a new page or open an existing one and add a new regular section.Ĭontinue by adding a new row to the section using the following column structure:Īdd Image Module to Column 1 Upload Shaped Image Overlay Subscribe To Our Youtube Channel Add New Section Once the color is modified, you can select the entire artboard containing the shaped image overlay.Īnd save it as a PNG image file for web by going to File > Export > Save for Web. Select the one you want to edit.Ĭhange Color to Match Section Background ColorĬontinue by changing the color of the shape into the same background color you’re planning on using for your row and/or section. Once you’ve opened the file, you’ll find 9 different artboards with the shaped image overlays that you are free to use for any kind of purpose. First of all, you will need to open the Adobe Illustrator file. Changing the color takes little to no time and allows you to use the shaped image overlays on literally any website you build, so let’s go through the steps. However, if you want to use the shaped image overlays on a different row and/or section background color, you will need to change the color manually using the Adobe Illustrator file that is included in the download folder as well. ![]() Modifying Shaped Image Overlays to Section Background Color with Adobe Illustrator Open the Illustrator File in Download FolderĪs mentioned in the approach section of this post, if you want to use the image shaped overlays on a white background, you’re ready to go by just using the PNG files that you can find in the download folder.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |