Part III: Going Further: Developing Wicked Cool Web Pages in Java

Generator QR Code ISO/IEC18004 in Java Part III: Going Further: Developing Wicked Cool Web Pages

The HTML element and the page-level locations for adding code can generally handle nearly all your needs However, on occasion, you may need to add HTML code either before or after another on-screen element that you have For these situations, right-click the page element itself and then select HTML from the contextual menu that appears in order to access a slightly different dialog box (See Figure 13-6)

In the HTML Properties dialog box for the element, you can add code in any of the following three places: HTML Before: Code added inside this box is placed before the element you re modifying HTML Inside: For code added inside this box, SiteBuilder adds it into the tag itself As a result, format the code as a name-value pair, such as font= Arial HTML After: The code that you add in this box is placed just after the element you re modifying

As 11 discusses, SiteBuilder has several Yahoo! add-ons the Yahoo! Map and Counter, for example built right into the product itself However, Yahoo! also has several more add-ons that aren t inside SiteBuilder You can access these by going to your Yahoo! Web Hosting Control Panel (accessible from Tools Web Hosting Control Panel from the menu) Once there, click the Create & Update tab and then click the Add-Ons link The Add-Ons page displays, as shown in Figure 13-7

On this Web page, you can choose among several add-ons, but some of the most noteworthy include News Headlines: Incorporates news or sports headlines into your Web page Stock Quotes: Displays the latest stock quotes Weather: Lists the weather forecast from one or more cities around the world Pull-Down Menu: Adds a drop-down menu to your site as an alternative navigation tool to a navigation bar Guestbook: Allows visitors to leave you messages All you need to incorporate these add-ons to your Web site are a few simple steps, which I show you in the following sections You ll notice that some add-ons featured on this page (Counter, Yahoo! Map, and Site Search) are the same as the ones provided already inside of SiteBuilder Ignore these add-ons on this page: Working with these add-ons within SiteBuilder itself is much easier

The News Headlines, Stock Quotes, and Weather add-ons follow a similar procedure for adding them to your site Use the following instructions for adding any of these add-ons to your page I focus on the process for the News Headlines add-on, but you can follow these same general instructions for the other two as well In order to use these add-ons, you need to go through a three-step process: 1 Configure your add-on using the Web Hosting Control Panel 2 Activate the add-on as a way of telling the Yahoo! Web server that you re using the add-on on your Web site 3 Copy the add-on HTML code from the Web Hosting Control Panel and paste it into an HTML element on your Web page To add news, stock quotes, or weather to your Web site, follow these steps: 1 Choose Tools Web Hosting Control Panel from the menu SiteBuilder opens your default Web browser and takes you to your Yahoo! Web Hosting Control Panel

2 In the Quick Links list located on the top-right of the page, choose Add-ons and then click the Go button The Add-On page displays 3 From your Web Hosting Control Panel s Add-On page, click the News Headlines, Stock Quotes, or Weather link on the Add-Ons page 4 Navigate through the configuration process specific for the add-on that you selected Each service has various options that you need to configure The News and Weather add-ons take you through a few pages to select the information you want to display The Stock Quotes add-on provides everything in a single page 5 When you configure all your options, click the Generate Code button The HTML code for the add-on displays in a text box in your browser Figure 13-8 shows the HTML code provided for the News Headlines add-on The Weather add-on provides a similar-looking page Note: The Stock Quotes add-on generates the code and displays it in Step 6