1 |
85ad3d82
|
Assos Assos
|
|
2 |
|
|
The Fivestar voting module adds a clean, attractive voting widget to nodes and
|
3 |
|
|
comments in Drupal. It features:
|
4 |
|
|
|
5 |
|
|
* jQuery rollover effects and AJAX no-reload voting
|
6 |
|
|
* Customizable star sets
|
7 |
|
|
* Graceful degradation to an HTML rating form when JavaScript is turned off
|
8 |
|
|
* Per-nodetype configurability
|
9 |
|
|
* Support for anonymous voters
|
10 |
|
|
* Spam protection to keep users from filling your DB with bogus votes
|
11 |
|
|
* Easy-to-use integration with Views module for lists sorted by rating, or filtered by min/max ratings
|
12 |
|
|
* A Fivestar CCK field for use in custom node types
|
13 |
|
|
* An easy-to-use Form API element type for use in other modules
|
14 |
|
|
|
15 |
|
|
Fivestar was designed by Nate Haug and Jeff Eaton.
|
16 |
|
|
|
17 |
|
|
This Module Made by Robots: http://www.lullabot.com
|
18 |
|
|
|
19 |
|
|
|
20 |
|
|
Dependencies
|
21 |
|
|
------------
|
22 |
|
|
* votingapi
|
23 |
|
|
|
24 |
|
|
Fivestar also provides additional features for both the CCK and Views modules.
|
25 |
|
|
|
26 |
|
|
Install
|
27 |
|
|
-------
|
28 |
|
|
Installing the Fivestar voting module is simple:
|
29 |
|
|
|
30 |
|
|
1) Copy the fivestar folder to the modules folder in your installation.
|
31 |
|
|
|
32 |
|
|
2) Enable the module using Administer -> Modules (/admin/build/modules)
|
33 |
|
|
|
34 |
|
|
Note: Aggressive caching will complain that fivestar doesn't work, but it
|
35 |
|
|
actually causes no problems. To improve performance, the module implements
|
36 |
|
|
hook_init() -- and the caching advisor screen uses that as the only metric to
|
37 |
|
|
determine whether a module will work with the caching system. Activate it
|
38 |
|
|
without fear, friends -- Fivestar will continue to hum happily along.
|
39 |
|
|
|
40 |
|
|
Upgrading from Drupal 5
|
41 |
|
|
-----------------------
|
42 |
|
|
The Drupal 6 version of VotingAPI has been significantly improved for both
|
43 |
|
|
efficiency and flexibility. Because Fivestar depends on VotingAPI for much of
|
44 |
|
|
its functionality, these changes have affected Fivestar.
|
45 |
|
|
|
46 |
|
|
The Fivestar Anonymous vote interval set in admin/settings/fivestar is no
|
47 |
|
|
longer available. We use the same setting as defined in VotingAPI now, set at
|
48 |
|
|
admin/settings/votingapi. It has the same effect as the previous Fivestar
|
49 |
|
|
setting.
|
50 |
|
|
|
51 |
|
|
Configuration for Simple Rating
|
52 |
|
|
-------------------------------
|
53 |
|
|
|
54 |
|
|
Fivestar has two completely separate modes of operation. The first is letting an
|
55 |
|
|
end-user rate a piece of content. The settings for this are on the content type
|
56 |
|
|
settings page. These settings let you expose a rating widget when viewing the
|
57 |
|
|
node, not editing it. Clicking on the widget registers a vote for that node, and
|
58 |
|
|
never anything else.
|
59 |
|
|
|
60 |
|
|
The configuration for Fivestar is spread between the content type settings page,
|
61 |
|
|
Fivestar site settings page, and access permissions. To configure:
|
62 |
|
|
|
63 |
|
|
1) Configure the site-wide setting for Fivestar, Administer -> Settings ->
|
64 |
|
|
Fivestar.
|
65 |
|
|
|
66 |
|
|
2) Activate voting on each content type. For example, if you want Fivestar to
|
67 |
|
|
appear on story nodes, use Administer -> Content Management ->
|
68 |
|
|
Content Types -> Story, and check the "Enable Fivestar rating" box under
|
69 |
|
|
the "Fivestar ratings" heading. Repeat for each content type desired.
|
70 |
|
|
|
71 |
|
|
3) Enable anonymous voting.
|
72 |
|
|
If you want to allow anonymous voting, you'll need to set permissions for
|
73 |
|
|
that. Use Administer -> User Management -> Access Control, and check the
|
74 |
|
|
"rate content" and "view ratings" checkboxes for the roles you'd like.
|
75 |
|
|
You'll find these permission items under the "fivestar module" heading.
|
76 |
|
|
|
77 |
|
|
Configuration for Reviews of Content
|
78 |
|
|
------------------------------------
|
79 |
|
|
|
80 |
|
|
Fivestar can be used to quickly setup a rating system for your site visitors to
|
81 |
|
|
review a piece of content. When enabling the Comment widget, visitors will
|
82 |
|
|
submit a rating on the *original piece of content* along with their comment.
|
83 |
|
|
Visitors will not be rating the comments themselves. Fivestar does not allow for
|
84 |
|
|
the rating of comments.
|
85 |
|
|
|
86 |
|
|
1) If it's not already enabled, turn on comment module at Administer ->
|
87 |
|
|
Site Building -> Modules.
|
88 |
|
|
|
89 |
|
|
2) Visit the content type you want to enable reviews, such as Administer ->
|
90 |
|
|
Content Management -> Content Types -> Story, and select an option under
|
91 |
|
|
the "Comment widget" section.
|
92 |
|
|
|
93 |
|
|
Configuration as a CCK field / Advanced Rating
|
94 |
|
|
----------------------------------------------
|
95 |
|
|
|
96 |
|
|
Fivestar has extensive CCK support, which makes it so that the user is presented
|
97 |
|
|
with a widget to rate some node with the widget while editing a node. It does
|
98 |
|
|
not necessary rate the current node, nor does it rate anything if no value is
|
99 |
|
|
entered in the Node ID field when configuring the CCK field. The value is
|
100 |
|
|
saved in the node (so when you edit it it is still there), but no vote is
|
101 |
|
|
registered in VotingAPI without the Node ID field filled out.
|
102 |
|
|
|
103 |
|
|
An example of a situation where you might want to use the CCK fivestar field is
|
104 |
|
|
creating a node type called 'review'. This review type would let users rate
|
105 |
|
|
some particular node, and accompany their rating with a review. This could be
|
106 |
|
|
combined with a standard rating on the target node, so that some users could
|
107 |
|
|
rate the target node using the simple method, or write a complete review to
|
108 |
|
|
accompany their rating.
|
109 |
|
|
|
110 |
|
|
To configure a CCK field for rating a node while creating a new 'review' node:
|
111 |
|
|
|
112 |
|
|
1) Create a new node type called 'review' at Administer -> Content Management ->
|
113 |
|
|
Content Types. Configure the type. Do NOT set any fivestar settings on the
|
114 |
|
|
content type form! We don't want users to actually be able to rate the reviews
|
115 |
|
|
themselves!
|
116 |
|
|
|
117 |
|
|
2) Edit your new content type, then click on the "Add Field" tab while on the
|
118 |
|
|
content type form. Add a field called 'rating' to your new type, make it of type
|
119 |
|
|
Fivestar Rating with the Stars radio button.
|
120 |
|
|
|
121 |
|
|
3) Configure the rating widget to your liking. Most field have help text which
|
122 |
|
|
explain their purpose. The Node ID field is the most important field on the page
|
123 |
|
|
which determines exactly what node will receive the value of the rating. In a
|
124 |
|
|
realy simple case, you could just enter the value 10 to always rate on the same
|
125 |
|
|
node with nid = 10.
|
126 |
|
|
|
127 |
|
|
A common scenario is using fivestar with nodecomments to make reviews. If using
|
128 |
|
|
nodecomments a separate checkbox appears the Node ID field to allow you easily
|
129 |
|
|
select the nodecomment parent as the target of the vote.
|
130 |
|
|
|
131 |
|
|
Save your field. Now when making new nodes of type 'review', the user will
|
132 |
|
|
select a star that will register a vote on the value of the Node ID field.
|
133 |
|
|
|
134 |
|
|
Views Integration
|
135 |
|
|
-----------------
|
136 |
|
|
Fivestar depends on the views integration provided by VotinAPI, but adds some
|
137 |
|
|
special features to make it work specifically with Fivestar. To display Fivestar
|
138 |
|
|
ratings in a view, select the "VotingAPI percent vote result" from the list of
|
139 |
|
|
available Fields. This will display the average vote for nodes. Then choose
|
140 |
|
|
"Fivestar rating" from the Handler options for the field and the averages will
|
141 |
|
|
be displayed as Fivestar ratings.
|
142 |
|
|
|
143 |
|
|
Fivestar also provides handling for the display of Fivestar CCK fields, they are
|
144 |
|
|
in the Field list under "Fivestar Rating: [Field name]".
|
145 |
|
|
|
146 |
|
|
Creating a Fivestar Set
|
147 |
|
|
-----------------------
|
148 |
|
|
|
149 |
|
|
1. Open your favorite image editor and create an image that is 3 times as high as it is wide.
|
150 |
|
|
The default size for Fivestar (and the easiest to work with) is 16x48 pixels.
|
151 |
|
|
|
152 |
|
|
2. Setup guides at 16 pixels and 32 pixels. This splits your canvas into thirds.
|
153 |
|
|
|
154 |
|
|
3. Create a star icon in the top third. When satisfied, copy it into the middle and bottom
|
155 |
|
|
thirds of the image. Change the middle and bottom copies to your liking. Fivestar will
|
156 |
|
|
use the top, middle, and bottom images for each state of the star.
|
157 |
|
|
|
158 |
|
|
Top -> Off
|
159 |
|
|
Middle -> On
|
160 |
|
|
Bottom -> Hover
|
161 |
|
|
|
162 |
|
|
4. Save your image as "star.png" in a new directory. The name of your directory will be the label
|
163 |
|
|
for your set of stars, spaces are not allowed.
|
164 |
|
|
|
165 |
|
|
5. Do the same thing for a cancel image, only there are only 2 states for a cancel image, so your
|
166 |
|
|
image will be 16 pixels by 32pixels. Setup a guide at 16 pixels so your canvas is split in half.
|
167 |
|
|
|
168 |
|
|
6. Create a cancel icon in the top half. Then duplicate it into the bottom half. The cancel states
|
169 |
|
|
are simply Off and Hover.
|
170 |
|
|
|
171 |
|
|
Top -> Off
|
172 |
|
|
Bottom -> Hover
|
173 |
|
|
|
174 |
|
|
7. Save your cancel image as "cancel.png" in the directory create in step 4.
|
175 |
|
|
|
176 |
|
|
8. Create the CSS stylesheet. The easiest way to make this stylesheet is to copy an existing CSS
|
177 |
|
|
file from another set of stars. The "Basic" set provides an excellent example for a 16x16 star,
|
178 |
|
|
because it only changes the background image as necessary. If you're making a larger or smaller
|
179 |
|
|
size for your stars than 16x16 pixels, the "Minimal" and "Outline" sets make for a good example.
|
180 |
|
|
|
181 |
|
|
Contributing
|
182 |
|
|
------------
|
183 |
|
|
Have a sweet set of stars you'd like to contribute to the Fivestar module?
|
184 |
|
|
Post them to the Fivestar issue queue: http://drupal.org/project/issues/fivestar
|
185 |
|
|
|
186 |
|
|
Support
|
187 |
|
|
-------
|
188 |
|
|
If you experience a problem with fivestar or have a problem, file a
|
189 |
|
|
request or issue on the fivestar queue at
|
190 |
|
|
http://drupal.org/project/issues/fivestar. DO NOT POST IN THE FORUMS. Posting in
|
191 |
|
|
the issue queues is a direct line of communication with the module authors. |