5.1. Using Images in Tapestry Regions

Drupal provides a myriad of options for displaying images, and numerous modules provide some variation of this capability.

However, you can create a banner block like the one above with a standard Drupal installation by simply inserting HTML code into the block body. You can place images in any Tapestry region. We'll use the Banner region as an example, but the things covered here apply to all regions.

Tapestry provides a Banner region below the masthead. It is visible on this page as the fabric image. Although this region was created with images in mind, you can use this region for any type of content.

If you want to duplicate the style of banner used on this page, you'll need to start with the image. We placed our image in the /files/images folder of our Drupal site. If you choose to place your images in a different folder, you will want to ensure that Drupal can access this folder and that the file is is readable by Drupal.

Next, point your browser to /yoursite/admin/build/block, click on the the Add Block tab and enter a block description (we called ours 'banner'). For the block body, you'll want to enter the HTML code necessary to display the image. The block body for the banner image on this page looks like this:

<img src="/files/images/banner.jpg" />

Finally, and this is important, change the Input Format of your block to Full HTML. If you do not change the input format to Full HTML, Drupal will not display your image. Then click the Save Block button.

In order to achieve the edge-to-edge effect displayed here, we were careful to match the width of the image (900 pixels) to the width of our site. We also appied the nomargins custom block theme to this block so that Tapestry would not apply the default block padding.

Now that you have a banner block, you can publish it to the banner region. Point your browser to /yoursite/admin/build/block, select the banner region from the drop-down list next to your new banner block, and click the Save Blocks button.

5.2. Placing Ads on Your Tapestry Site

Using one of the popular advertising-related modules availble for Drupal, you can easily place advertisements on your site. This site uses the Google AdSense module to provide the advertisements that you see. Before you can use this module, you'll need to register for a Google AdSense account and obtain a Google AdSense client ID.

Like most of the available ad modules, the Google AdSense module creates blocks that you can publish to different regions of your site. Tapestry provides regions that were designed with advertisements in mind, but you can publish ads to any tapestry region. The basic steps are 1.) configure an AdSense block to display the ad format you wish to use, and 2.) publish that AdSense block to a region.

Let's try an example. The Leaderboard region at the top of the page was designed with a standard size 728x90 leaderboard ad in mind. Assuming you have the Google AdSense module installed and configured, you can point your browser to /yoursite/admin/build/block, select one of the unconfigured AdSense blocks by clicking on the Configure link next to it, and change the Ad format to 728x90: Leaderboard. Once you've saved your configuration changes by clicking on the Save Block link, you can publish your new ad block. Select the Leaderboard region from the drop-down list of regions next to the newly configured Leaderboard Ad block and click the Save Blocks link.

Advertising modules provide a wide range of ad formats. You can use the configuration features of Tapestry to match your site layout to the format of ads that you want to display. For example, if you want to place a Google AdSense 250x250 square ad block in the left sidebar, then you will want to ensure that the left sidebar is wide enough to accommodate this ad block. Point your browser to /yoursite/admin/build/themes/settings/tapestry and ensure that the left sidebar is at least 250 pixels wide.