left arrow right arrow help header logo background

Step 4: Create a half transparent image for the light effects

  1. Start the Image Editor. Click this button . Select New Image -> Blank. Set the size of the image to 400x200. Click OK to create a blank image.
     
  2. Click this button to start the Fill Gradient Function. Click the button "Edit" on the right which is now enabled to open the Gradient Editor.
     
  3. Click the New button to open the New Gradient Dialog. By default the color stop on the left will be selected. If it is not (The top triangle is not black), click on it (either click on the rectangle or the triangle will work). Set the color of this stop to #FFFFFF (white). Set the blending to linear.
     
  4. Click the color stop on the right. After this, the top triangle will turn from white to black. Set the color to #FFFFFF (white). Set the opacity to 0.
     
  5. Click OK twice to return to the Image Editor. Now the newly created gradient is selected automatically.
     
  6. Click on the Config button to open the Fill Gradient Configuration Dialog and select the Radial type from the drop down menu. Click OK to accept the settings.
     
  7. Move the mouse over the image until the coordinate (200,0) is shown. Actually, any point close to that is okay.
  8. Press the mouse button and drag downward until these coordinates are shown: (200,0), (200,190), 190.
  9. Release the mouse button and you should now have an image similar to the one below.
    Click this button again to turn off the Fill Gradient function.
     
  10. Set the opacity of this layer to 35.
  11. Click "Insert to Site" to create this image and name it "light.png"