How to create a Grain effect in Showit

If you’re looking to create a unique and cool effect for your background on Showit website, a grain effect can be a great option. In this blog post tutorial, we’ll walk you through the step-by-step process of creating an animated grain or noise texture background in Showit.

Step 1

Upload background image and set opacity around 70-80%

Step 2

Download and upload any noise texture gif. I found my on Google

Step 3

Paste this code below with the Embed code tool:

<style>
body {
  background-image: url("paper.gif");
  background-repeat: repeat;
}
</style>

Step 4

Replace paper.gif line with the link of your grain texture .gif.

To copy the link open media library and click at little link icon. Then click on your embed code again and replace url.

with my link it looks like this:

<style>
body {
  background-image: url("https://static.showit.co/file/0CtQ1Bu-RdmeLGOxuCyguw/149657/200w.gif");
  background-repeat: repeat;
}
</style>

Step 5

Make the noise gif the same size as your screen, don’t forget to click on “Horizontal locking” so it would be locked to the left and right sides of the browser window as the window grows.

Finished!

Enjoy your beautiful and eye-catching grain background for your Showit website!