How to Create a Sign Up Block Using Drupal

Problem: “I want to create a sign up block for visitors interested in subscribing to our Newsletter. The information the user submits should be sent to the administrator by email.”

Solution: Create a signup block using webform and views.

Technical Level: Beginner-Moderate Experience with Drupal

Install Requirements:

• Drupal 6.0-6.9 http://drupal.org/project/Drupal+project
• Views 6.x-2.2 http://drupal.org/project/views
• Webform 6 - http://drupal.org/project/webform

(**This tutorial will not be going through how to install/enable Drupal modules.)

Let's Go!

1. Go to Content Management > Create content > Webform
2. Insert your title: Newsletter Sign Up
3. Insert your description. Ex: "Sign up for the Ten Spot, LevelTen’s weekly newsletter for the top internet trends of the week that will impact everything you do."
4. Insert confirmation message or redirect URL. Ex: "Thank you for joining the Ten Spot mailing list."
5. Check the boxes Anonymous User and Authenticated User under Roles that can submit this webform.
6. Insert a test email address in the first email field. Leave the remaining at default.
7. Click on Webform advanced setting and check Show complete form in teaser.
8. Scroll down to Comment settings and select Disabled.
9. Click Save.
10. Click Form components in the navigation webform menu.
11. Type in the component name: Name. The type is textfield. Select the checkboxes mandatory and email. Click Add. Click Submit.
12. Type in the component name: E-mail. The type is email. Check the boxes mandatory and email. The email box means the information will be sent with the administrator email. Click Add. Click Submit.
13. Click Submit.

14. Write down the node number in the URL (you will need this later).

You have created a Webform. Now let’s create a block view for this webform.

1. Go to Site building > Views > Add
2. Enter the view name: signup_newsletter
3. Node is the view type.
4. Click Next.
5. Under Basic settings change the Row style to Node.
6. Uncheck Display only teaser and Display links. Display node comments will be unchecked by default. Click Update.
7. Change the Items to display to: 1
8. Move over to Filters. Click the + box.
9. Select Node: Type. Choose the radio box “Is one of” and select the checkbox Webform. Click Update.
10. Add another Node filter. This time select Node: Nid.
11. Select the radio box “Is equal to” and insert the node value you wrote down earlier. Click update.
12. Click Save and stay right there.

You have created a view for the Newsletter sign-up webform. Now let’s create a block for this view.

1. Use the drop down box to the left and select Block. Click Add display.
2. You will notice how all the settings are now in italics. The italic means all the settings are currently your default settings. If you change a default in that block, the font will return to normal because you are overriding those settings. As you can see in the Basic settings, Name has been overridden to say Block.
3. The only thing we want to do is create a name for the block for the last segment. Under Block Admin settings, name your Block: Newsletter Signup Block.
4. Click update.
5. Click Save to save the block view.

You have created a newsletter sign up block using views! Next you will enable your block and position the block on your website.

1. Go to Site Building. Select Blocks
2. Your block will be disabled. Scroll down to find Newsletter Signup Block and use the drop down nav to move it to the desired location on your site.

3. Click save.

Users can now easily submit their information and subscribe to your newsletter. Simple for them. Simple for you. The example I use below was styled using CSS and yours will need some too. Don't be shy.

Related Drupal Reading

• Creating Image Galleries In Drupal
• Creating an e-mail newsletter with Simplenews
• How to Format Dates in Drupal