1
|
Overview
|
2
|
--------
|
3
|
Webform supports theming similar to the CCK or Views modules. Any webform
|
4
|
may be themed on the server side, though doing so may require a reasonable
|
5
|
amount of knowledge about the Drupal Form API. More information about the Form
|
6
|
API may be found at http://api.drupal.org/api/file/developer/topics/forms_api.html
|
7
|
|
8
|
Theme submission e-mails
|
9
|
-----------------------
|
10
|
The default e-mails sent by webform are fairly basic. If you like, you may
|
11
|
customize the display of e-mails sent by each individual webform.
|
12
|
|
13
|
- Open the Webform module directory.
|
14
|
|
15
|
- Copy (do not move!) the "webform-mail.tpl.php" file to your theme directory.
|
16
|
|
17
|
- Open up the new file and edit it to your liking. The webform-mail.tpl.php file
|
18
|
contains further instructions on how to get started with theming the e-mail.
|
19
|
|
20
|
- If you want to edit the e-mail sent by only one particular webform, rename the
|
21
|
file "webform-mail-[node id here].tpl.php", replacing [node id here] with the
|
22
|
node ID of the webform.
|
23
|
|
24
|
- Clear the theme cache! Visit admin/settings/performance and click the
|
25
|
"Clear cached data" button at the bottom of the page. You may also find
|
26
|
using devel module will speed up this process a bit. This needs to be done
|
27
|
every time you create or rename a .tpl.php file, but isn't necessary once
|
28
|
these files already exist.
|
29
|
|
30
|
- To get a better idea of what variables are available to you, you can include
|
31
|
the print_r function in your email. Simply include the line:
|
32
|
|
33
|
<?php print_r($submission) ?>
|
34
|
|
35
|
to get a listing of all the available fields you can use in your mail.
|
36
|
|
37
|
- Advanced Webform e-mail Theming: Theming the e-mail headers may also be done
|
38
|
by overriding the theme_webform_mail_headers() function from webform.module.
|
39
|
Just copy the code out of webform.module and change as necessary in your
|
40
|
template.php file. This allows you to customize the e-mail headers.
|
41
|
|
42
|
Theme the confirmation page
|
43
|
---------------------------
|
44
|
|
45
|
After a user submits a webform, they are directed to a page that contains the
|
46
|
confirmation message set in the webform node settings (assuming the form doesn't
|
47
|
direct to a complete URL). These instructions let you customize the format of
|
48
|
the confirmation page of a single node or all webforms on your site.
|
49
|
|
50
|
- Open the Webform module directory.
|
51
|
|
52
|
- Copy (do not move!) the "webform-confirmation.tpl.php" file to your theme
|
53
|
directory.
|
54
|
|
55
|
- Open the new file and change it's contents to the your liking. Here's an
|
56
|
example that inserts some additional HTML around the confirmation message and
|
57
|
gives links to edit the submission.
|
58
|
|
59
|
<?php /* Begin sample webform confirmation page */ ?>
|
60
|
|
61
|
<div class="confirmation-message">
|
62
|
<?php print $confirmation_message ?>
|
63
|
</div>
|
64
|
|
65
|
<ul>
|
66
|
<li><a href="<?php print url('node/' . $node->nid . '/submission/' . $sid)?>">View your submission</a></li>
|
67
|
<li><a href="<?php print url('node/' . $node->nid . '/submission/' . $sid . '/edit')?>">Edit your submission</a></li>
|
68
|
</ul>
|
69
|
|
70
|
<?php /* End sample webform confirmation page */ ?>
|
71
|
|
72
|
- You may edit the webform-confirmation.tpl.php file in your theme directory,
|
73
|
this will affect all the webform mails sent by your entire site. Or, if you
|
74
|
want to edit the e-mail sent by only one particular webform, rename the file
|
75
|
"webform-confirmation-[node id here].tpl.php", replacing [node id here] with
|
76
|
the node ID of the webform.
|
77
|
|
78
|
- Visit admin/settings/performance and click the "Clear cached data" button.
|
79
|
|
80
|
Theme display of an entire webform
|
81
|
----------------------------------
|
82
|
|
83
|
Theming a webform can be useful for rearranging elements or customizing the
|
84
|
appearance of multiple components at once. This tutorial assumes usage
|
85
|
of the phptemplate engine.
|
86
|
|
87
|
- Copy the "webform-form.tpl.php" file from the webform directory to your
|
88
|
theme directory. You may rename this file
|
89
|
"webform-form-[node id here].tpl.php" if you want to theme one particular
|
90
|
webform on your site. Replace [node id here] with the node ID of the webform.
|
91
|
|
92
|
- Open up your new file and customize the webform however you like.
|
93
|
|
94
|
- Visit admin/settings/performance and click the "Clear cached data" button.
|
95
|
|
96
|
- All Webform forms have 2 main fieldsets: "submitted", and "details". Although
|
97
|
you may move things around as you wish, keep all your components within the
|
98
|
"submitted" fieldset. Only the "submitted" fieldset is displayed and Webform
|
99
|
depends on the other two to operate properly, so don't mess with them unless
|
100
|
you have good reason to do so (like you're forwarding your webform to a custom
|
101
|
PHP or PERL script).
|
102
|
|
103
|
Theme display of a webform submission display
|
104
|
---------------------------------------------
|
105
|
|
106
|
Theming the display of a webform submission works the same way as theming a
|
107
|
webform form. Webform uses Drupal "renderable" style arrays for the display of
|
108
|
submissions, just like most forms in Drupal.
|
109
|
|
110
|
The template file for theming submissions is webform-submission.tpl.php. You can
|
111
|
use webform-submission-[node id here].tpl.php for individual nodes if desired.
|
112
|
Note that the contents of this template are used not only for display of
|
113
|
submissions in the Webform interface but also in e-mails when printing out
|
114
|
the [submission:values] token.
|