WYSIWYG Web Builder – How to Apply Page Effects to your Website

Article by Tutorial-Writer (12,987 pts ) , published Nov 30, 2008

Add some fun to your website by adding page effects. In this tutorial, I will show you how to add page effects to your site using Web Builder.

You can apply page effects to your website using WYSIWYG Web Builder. You can create your own page effects using your own graphics, or you can use the page effects in Web Builder. In this tutorial, I will show you how to do both. We will start off using the effects in Web Builder and then I will show you how to customize the effects and add your own. Open your program and open the page you want to apply the effects too.

Applying the Web Builder Page Effects to Your Webpage

Click the Java Script button in the left panel and draw a box on your page. The Java Script properties box will open and you will see all of the scripts in the left panel. There are three scripts that we will be using. We will be using the bubbles effect, fireworks effect, and snow effect. So, let’s begin.

Bubbles Effect – Click the Bubbles Effect in the left panel. In the top right panel, you will see a preview of what the effect will look like. At the bottom of the panel, you will see the button you can click to add your own graphic. If you want to use your own graphic for the page effect, click the button and locate the graphic you want to use. Double click the graphic to open it. You will see the preview in the top right panel. Click OK to apply this effect to your page.

Fireworks – Click the Fireworks script in the left panel. You cannot edit this script. In the right side of the panel, you will see the preview of the fireworks. To use to page effect, click the OK button.

Snow Effect – The snow effect has snowflakes falling on the screen. Click the Snow Effect script in the left panel to preview it. You can also change this graphic by adding your own. Click the button in the bottom right panel and locate the graphic you want to use. Double click the graphic to open it. To apply it, click OK at the bottom of the panel.

You can preview your page to see the full effect. Go to the top of Web Builder and click File > Preview in Browser > and select the browser of your choice. To edit the page effects, double click the box you drew to begin with. The properties box will open and you can make changes in that box.

 
Subscribe to Web Development
RSS
Get free weekly updates, directly to your inbox.
Browse Web Development