Drupal-lovers

Who love to Drupal

Archive for the ‘Drupal6’ Category

Drupal6

Drupal feature Module example

Posted by drupallovers on July 13, 2012

In this example we create an Online Videos feature. The site builder configured a lot in preparation of this feature we are currently not interested in.

Step 1. admin/build/features/export



As you can see we added a name, description and a version. Next step will be defining what this feature provides.

Step 2. Select features components.

From the “Add Components” dropdown we have to select the components the feature consists off. This is about a video node so we select “Node”. From the checklist we only need the video node type.



The auto-detect functionality grabs the required building blocks node (video), content (video-field_video), modules (emvideo, features). Therefore, when we want to install the feature, we need to make sure we have installed the required modules.

Step 3. Download the feature.

When satisfied with all components, click the download button and save the tarball (in this case, online_videos-6.x-1.0-alpha1.tar.gz).

Step 4. Install and enable the feature.

Best thing to do is untar the file in your current project. As described above, features are not listed on the site/build/modules page even though they are technically modules. To keep them separate, you should consider putting all of your features in a separate directory — e.g., site/all/modules/custom/your-feature.



The feature now appears at admin/build/features. Checking the box next to the feature’s name and saving page causes the features module to check for the current state all features.

Step 5. Visit admin/build/modules

When checking for the module online video module it’s not there. Searching for the name would show you a dependency on online_video module. To disable such a module you have to disable the feature first.

Notes

  • We have said nothing about what drupal projects you need to install to be able to install our example feature.
  • If we had created a view this would be exported too. test it yourself.

Posted in Drupal6, Drupal7, Modules | Leave a Comment »

Getting Started With Drupal’s Webform Module

Posted by drupallovers on March 30, 2012

Webform is the module for making forms and collecting information from users in Drupal.

After a submission, you can send users a thank-you email as well as sending a notification to administrators. Results can be exported into Excel or other spreadsheet applications. Webform also provides some basic statistical review and has an extensive API for expanding its features.

If you need to build a lot of customized, one-off forms, Webform is a more suitable solution than creating content types and using the CCK or Field modules.

Download the Webform Module

tutuploadsStep_1._Download_the_Webform_Module.png

Go to this url http://drupal.org/project/webform, and download the Webform Module.

There are some additional modules that add some functionality and make some operations easier. You can download the optional modules as well. To keep things simple, we’ll use the basic module and show you how to create a simple survey of registered users.

tutuploadsmedia_1317090861314.png

Download the correct version. They may have changed since we wrote this, so be sure to check.

Install the Webform Module

tutuploadsStep_2._Install_the_Webform_Module.png

Enable the module

tutuploadsEnable_the_module.png

Go to the Modules page and scroll down to Webform and click the check box. Click Save configuration.

Access the form fields

tutuploadsAccess_the_form_fields.png

Go to Structure > Content types

tutuploadsmedia_1317093423174.png

Scroll down to Webform and look the right for the links to edit and manage fields and the display.

tutuploadsmedia_1317094660865.png

Click Edit

If you are familiar with CCK in Drupal 6, or Fields, which is now part of D7 core, you will see a familiar interface for adding and managing new fields.

tutuploadsmedia_1317095178845.png

This is not the place where you will be creating forms. Editing here is exactly the same as editing Fields in Content Types, which is a way to make fields available to this content type. From here you can edit fields, manage existing fields, the display and the comment functions by clicking on the appropriate tabs. But creating the actual form is done by adding content in the same way you would add an article.

You won’t need to do much here but review all your choices and see if there is anything you feel you must change. The default values will work for the purposes of our demonstration. After you create your first form and understand the module you might want to revisit the configuration.

Now that the module is installed and the configuration is checked, you can begin building your survey form.

Create your first webform by adding it as content

tutuploadsStep_3._Create_your_first_webform_by_adding_it_as_content.png

Go to Content > Add Content > Webform

Don’t get confused over Poll vs Webform. We are creating a form with various types of questions, not taking a Poll. Poll is another content type that is similar, but restricted to multiple selection fields and gathering the statistics on the responses. Webform is a form submission module, and collects the actual responses and stores them in a table for you to review. You can collect almost any type of data using Webform.

Create the basic form details

tutuploadsCreate_the_basic_entry_form_and_configure_the_same_as_any.png

Give it a title and make the decisions on all basic options. Save this with the save button at the bottom of the page.

Add form components

tutuploadsStep_4._Start_adding_form_components.png

Now you will see the controls for creating and editing the rest of the form elements. Start adding Form components on the WEBFORM tab.

tutuploadsStep_5._Make_a_pre-filled_username_field_using_a_Token.png

Give the component a label, choose textfield and then click Add.

We’re surveying registered users, so we are going to automatically fill in their username. A name is basic text field, but we want our registered users to show up on the textfield, so we’re going to make use of Tokens. Using Tokens is just an optional feature.

tutuploadsmedia_1317148972326.png

Enter the token %username in the Default value field.

This will pull the username from the data base and fill it in automatically.

If you don’t see the TOKEN VALUES, you probably don’t have the Token module installed. You only need Token if you want to fill in the default values taken from the data base. If this is going to be a blank field that the user will fill in when they visit the page, you can just leave the Default value blank. I used Token here to illustrate the possibilities available to you.

If you need the Token module you can download it here http://drupal.org/project/token

Scroll down the rest of the page and make any configuration selections you need then click Save Component at the very bottom of the page.

Create a “Select” field

tutuploadsStep_6._Create_your_first_Select_field.png

Fill in a new label and choose the Select options type from the drop down. Click Add and complete the options on the next screen

Create the list of options

tutuploadsStep_7._Create_the_list_of_options_for_the_user_to_choose.png

Go to Options and create Key Value Pairs. These pairs consist of a machine readable key and a plain language value separated by a “|” – This character is called a “pipe” and you can find it by holding shift while pressing the backslash key “\” key on most keyboards.

Key-value pairs MUST be specified as “safe_key|Some readable option”. Use of only alphanumeric characters and underscores is recommended in keys. One option per line.

Save the Component.

Repeat this step for the flavor of the jelly and type of peanut butter.

tutuploads-_Default_choice_is_radio_buttons.png

When you are creating lists, the default type is radio buttons. If you want check boxes or a listbox the choices are farther down on the page. You can also set the field as mandatory or optional. If you click the “Multiple” check box at the top, the list will appear as check boxes. If you choose “Listbox” under DISPLAY you will have a drop down box. Selecting “Multiple” and “Listbox” will allow users to make multiple selections from a dropdown box.

When you create the Jelly type, add Other as a choice. Then add a text field so people can write in their suggestions.

Add a Text field

tutuploadsStep_8._Add_a_Text_field.png

You can add a text field, or a textarea. A text field is for short entries like names. A textarea will be a large area for entering more extensive written responses.

Other field types you might want to add for your purposes are an E-Mail field or Date Field. You can choose thees types from the dropdown “Type” box.

tutuploadsmedia_1317154370995.png

You can choose other field types from the Type drop down.

Add a preset field type

tutuploads-_Add_a_preset_field_type_-_an_added_feature_of_Webform.png

There is a convenience feature you may want to use. You can create pre-built option lists and add them to your form. The module comes with several default lists. Add one for States if you want to see how this looks on your form. Label it State and then choose the Select Options type and when you get to the next screen, make your selection.

tutuploadsmedia_1317151406971.png

Choose US States from the drop down.

Check your form

tutuploadsStep_9._Check_your_form_and_fine-tune_the_view..png

At this point your form will look similar to this. You can change the locations of the descriptions by clicking the WEBFORM tab and editing each item and making different configuration selections. Once you have the form ordered the way you like it and all the questions and fields correct. Go back to the WEBFORM tab EMAIL tab and set the EMAIL options.

You can use drag and drop to move form elements to different positions.

Configure the E-Mail options.

tutuploadsStep_10.__Configure_the_E-Mail_options..png

Go back to the WEBFORM tab and look for the E-mails sub-tab. Fill in an address and click Add.

Set the email address if you want to receive an email when the form is submitted. You can add multiples.

tutuploadsmedia_1317152290926.png

There are lots of choices to make. Be sure you check every one of them so they are correct for your form. Be sure to save the changes.

Configure the Form Settings

tutuploadsStep_11._Configure_the_Form_Settings.png

From the WEBFORM tab Click the Form Settings sub-tab at the top of the page. Check and modify settings as needed. Save your changes.

Now you can publish your form exactly like you would publish any other content item on your site. After you’ve had a chance to collect submissions, you will see the results when you are logged in as a user with the correct permissions.

tutuploadsmedia_1317152553413.png

Click Content > Find Content and select the form from the content list and you can find the results tab. This will allow you to see the collection of data you have as well as give you some simple analysis.

Posted in Drupal, Drupal6, Drupal7, Modules | Tagged: , , | Leave a Comment »

Creating a Photo Gallery in Drupal 6

Posted by drupallovers on March 30, 2012

This tutorial will show you how to create a photo gallery in Drupal 6.

It won’t create the world’s flashiest or most impressive gallery, but it will work. This tutorial is designed for beginners so that they can understand the key concepts behind creating a gallery in Drupal 6.

You will need to install and enable at least the five modules listed below. Several of these do depend on other modules so your final list of installed modules will be longer.

Step 1: Create a content type

tutuploadsmedia_1319216976361_1f2fe1c78e0920de1ea5ba7a5ff8f583.png

Go to Administer > Content types > Add content type

tutuploadsmedia_1319217177397_844bbc12d125fb9fad4865972d717676.png

Create a new content type called Photo Gallery.

Step 2: Add a Photo Field

tutuploadsmedia_1319217290277_b01fda4505f98c5957126e6f8e0212c7.png

Click Manage fields next to Photo Gallery and we’re going to add a photo field.

  • Label: Photo
  • Field name: photo
  • Type of data: File
  • Form element: Image

Click Save twice to create the field.

Step 3: Upload the photos

tutuploadsmedia_1319217497427_5ac7feb4089391f3506882690d31a23d.png

Go to Create content > Photo Gallery and upload the photos you would like in your gallery. Each photo will be it’s content item.

Go ahead and upload at least four photos so that we have something to work with.

Step 4: Creating the View

Go to Site building > Simple views > Add view.

tutuploadsmedia_1319218260634_19f84ecf8319f259206e523973e53756.png

Enter the following settings:

  • Title: Dog Photo Gallery
  • Path: dog-photo-gallery
  • Display: Photo Gallery posts
  • Sorted: Newest first
  • As a: List of titles

Click Submit when you’ve finished.

Step 6: Improving the view

Go to Site building > Views > click on Edit next to your new view which will be called simpleviews_1 if this is your first time using Simple Views.

Make sure to click Page on the left-hand side as in the image below:

tutuploadsmedia_1319219922899_c90800417f2a421f501fddb7d7253d0a.png
Click on HTML List under Basic settings:
tutuploadsmedia_1319218867382_d2a2115530d9f4f03e17a7b0a6cfaa82.png
Choose Grid and click Update:
tutuploadsmedia_1319218798006_455e520b2212a6c60f10fe3448242ed7.png

Set the number of columns to 2 on the next page.

Now we’re going to add the photo and caption. Click the plus icon next to Fields:

tutuploadsmedia_1319218909521_51aa7c428a60eee55535af00ed09c655.png
Check the box next to Content: Photo.
tutuploadsmedia_1319218931915_275905a89c24ca0c3602dc22130c4e90.png

Click Add.

Set Label to None and set Format to Image:

tutuploadsmedia_1319218966333_ba86a5516d6eb715adb41eb81b8ddf75.png

Click Update.

Click the plus icon next to Fields once more.

Check the box next to Node: Body.

tutuploadsmedia_1319218991684_5d105ec5860ec528cd391fac1c66b679.png

Click Add then you’ll see a Label field. Remove the text in that field.

tutuploadsmedia_1319220198814_8b493852ff1d099fbef6f2b14ba537c4.png

Click Update.

Click Save at the bottom of the page make sure your changes aren’t lost.

Click View “Page” in the top-right corner to visit your Photo Gallery. It will look like the image below:

tutuploadsmedia_1319219304319_b7b14308967e3c95966034d338606b50.png

Those photos are clearly too big. We’ll need to fix them. That is why we also have the ImageCache module installed …

Step 6: Resizing the images

 

tutuploadsmedia_1319219530623_e9e13617c7e31b8f07b88544ff811a83.png

Click Add Resize enter the maximum height and width that you would like for the images on the main page of the photo gallery.

300 pixels wide and high might be a good choice to start with.

tutuploadsmedia_1319220329218_05016b22ae1d2a43978a5e1b32f0bfe6.png

Go to Site building > Views > click on Edit next to your new view. Make sure you click Page on the left-hand side.

tutuploadsmedia_1319220125486_780a5d79bb67e03e7753a378271fd8f4.png
tutuploadsmedia_1319220154418_e5c4c97fb0df0c4ca3d4e1d12b4eb674.png

Click Save and visit your Photo Gallery. It will now look like the image below:

tutuploadsmedia_1319220412413_f200f43eba07c6afe4d99a2c20450d83.png

Step 8: Resizing the individual images

You can also create presets for individual photos so that they will not go over the edge of the page, no matter how big they are.

Go to Site building > ImageCache > Add new preset.

Create a new preset called individual photo.

Click Add Scale and set both the width to 700. That means that no photos will be wider than 700 pixels but they can be as high as necessary.

Click Save Preset.

Go to Content management > Content types > manage fields next to Photo Gallery > click Display fields at the top of the page.

Click on the Full node dropdown and choose the individual photo image that you just created. That will apply the 700 pixels maximum width to all of the photos when they are shown individually.

Click Save.

tutuploadsmedia_1319220882379_55226e993b028c7df3dead2670614758.png

Posted in Drupal6 | Leave a Comment »