Compact Form is a lightweight contact form that is reduced to a bare minimum and will fit into almost any space – top-bar, side-bar, footer, or extra content zone.
Compact Form is restricted to a total of six fields, so once you have requested a visitor's name, email address, subject and message, you have two fields available to collect any extra details you might need (address and phone number, perhaps; or device and OS…).
Something that I personally like about Compact Form is the fact that the submit button doesn't appear until all of the compulsory fields have data centred into them. So there is no submit-and-read-the-error-message routine – you can't submit the form until you've answered the questions!
Other than the fields to be submitted, you will find options to set the text and the border colours, the send button colours and the send button text colour. Other formatting is determined by the site styles.
Compact Form uses a highly-effective 'honey pot' anti-spam system; so your form is protected against spambots without the annoyance of Captcha. The Compact Form can submit to multiple email addresses.
Compact Form requires php and once submitted a success page is automatically generated.
The ideal replacement for the built in RW contact form for use on stacks pages and in confined spaces.
DonateStack, as the name suggests, is a (free) stack that makes donations via PayPal simple. So simple, in fact, that once you've added the stack to your project, all you need do is add your [the recipient's] email address and publish.
However, before you publish, you might wish to take the time and inform your visitor what he is donating to. A Headline stack, or a paragraph stack may help relieve any confusion.
In its basic form, DonateStack simply displays an amount to be donated and a Contribute button. Check the settings panel and you'll find that you can also collect a donor's information – for a thank you letter, perhaps.
The first and probably most important setting is PayPal Account – the address that will receive the donation. Next is Reference – keywords that will help identify the payment.
Locale Code sets the language that visitors will see when they are passed on to the PayPal site. US, for instance, for English, or DE for German. Currency Code defines the base currency setting.
Confirmation Link will allow you to set a return address, once a donor has contributed – a Thank You page, for instance. And if you'd like to know more about your donor – activate Display Address Fields. Once activated, you will see The option Responsive Columns.
Amount Type may be set to Number Box (default), or Option Select Box. The latter will enable you to suggest various donation amounts.
DonateStack Localisation displays the address fields, which may be edited. DonateStack Styling gives styling options for all aspects of the stack with the exception of the Select Box Menu which is always white.
I work for a charitable organisation in Thailand and you may be sure that DonateStack will find its way onto the website alongside the next update.
A quick look at the new CalcStack from Stacks4Stacks led me to believe that this was going to be a quick review. A more comprehensive examination proved me wrong.
Take it from me, the examples on the Stacks4Stacks page don't do the stack justice. Not only is CalcStack proficient with the four basic calculations, plus modulus, it integrates seamlessly with FormsPlus and can pass on its calculations to other contact forms – even the default RW form – and to other web pages for further processing.
The very first option is Integrate With FormsPlus. Setting this option allows you to drop CalcStack into a FormsPlus field. It extends the FormsPlus code and becomes fully integrated. (Take a look at the demo project)
Next you'll find a choice of buttons that may be added to the CalcStack: Copy Answer, Mail-To, Reset/Reload, Submit Answer As Hash, Submit All Input As A Query (allows you to connect to an external page/site), Share To Twitter.
Extensive Style formatting options follow – too many to list here.
If you drag a CalcStack onto your Stacks page, you'll find it contains a child stack containing a one plus one calculation. You'll need to set a Calculation ID if you wish to use the results in further calculations – possibly something more recognisable than Calculation1.
Calculation Input settings start off with a choice of Input Types. The default setting is Number Box. Optionally, you can set Checkboxes, Fixed Value, Option Select Menu, Range Slider, Input or Answer From Another Calculation, or URL Query String.
Checkboxes will supply an array of checkboxes and associated labels. that provide a list of selectable items attached to a numerical value. Optional selection limits can be used to limit how many checkboxes a user can select. A selection limit of '1' gives the input a similar behaviour to radio buttons and permits only a single item to be selected from the list.
Option Select Menu provides an HTML select menu, allowing users to pick a single option. Not especially pretty (Will's own words), but extremely user-friendly and functional (especially on iOS and Android). This is a the input method to use if you need to be stringent about the values a user can choose from.
Both the Checkboxes and the Select Options are formatted with Markup.
Next – Input 1 Name, Default [value] and Steps. Steps allows you to define the incremented value displayed when the default Increase/Decrease buttons are clicked.
The Input Value can be hidden, but it will need a Operator – Add, Subtract, Divide, Multiply, or Modulus. Next follow the Input Values for the second numeral.
The Answer Settings give you the options Answer Decimals and Answer Name. The Answer may be hidden.
The Unit Settings will allow to to add both a prefix and a suffix to all three field labels – km/h, or ºC, for instance.
Once you have your first calculation, you can add a further child stack to take the calculated value and process it further. Will has provided a temperature conversion table as a simple example. E.G. Calculation1 – n minus 32 ºF; Calculation2 – Answer from Calculation1 multiplied by 5 (hidden); Calculation3 – Answer from Calculation2 plus 9 = n ºC
CalcStack is fully responsive, as you'd expect from a modern stack; will integrate with any theme and is a versatile calculation stack that will easily save you the costs involved with having a calculator specially programmed for your purposes.
If you need an online calculator and didn't already purchase the stack that I reviewed last week, I recommend that you check out the CalcStack demo pages (and 20 minute video) and download the demo version – Will is one of the few developers that offers demo versions of his stacks!
AddEvent is a new stack that, with the help of some very clever PHP, will automatically generate an .ics version 2 file and add it to your calendar – and your page doesn't need to be a .php page to do so, .html works just fine.
In addition to the event title and date, AddEvent also supplies a description, location and web address. In newer calendar software such as iCal, locations are automatically presented with a map pin and optional directions. Users can set a reminder and sync the event across all their devices.
AddEvent doesn't rely on any external (and expensive) services to go about its business, and it's not necessary to register every website you wish to use the stack on. Just drop the stack into a Stacks3 page, fill in the event details and publish:
Event Title is straightforward – add the name of your event to the stacks panel. Add Start and End Dates (including the time) and add a Location. Now you can add a short Description and – if you wish – a link to the events web page.
Add the Event File Name and, if your server isn't in the same time zone as the event, add your server's time zone so that the times can be synchronised across different countries/states.
All that's left for you to do now, is set the button text (you can also add a FontAwesome icon e.g. <i class="fa fa-calendar"></i> Add To Calendar) and, if you wish to alter the button's default appearance, add a custom Button Class.
Before you publish your event, you can check that everything will be submitted correctly by taking a look at the AddEvent stack on your page.
Note: Your server needs to be running PHP 5.6 or newer. Once you've ensured that the is the case, publishing and remembering events couldn't be simpler.
Do you need to know how many tiles will be needed for that new bathroom wall? Or perhaps you want to spend the weekend at your favourite hotel in the Lake District and want to know what it will cost. With Formula you just need to add the wall's dimensions or the dates of your intended stay and the stack will do the heavy lifting for you by calculating the price and even packing the results into a contact form, ready for you to click 'Send'.
You will need to read the instruction manual before you can create your new web page. This is not criticism – once you've used it a couple of times, Formula is quite straightforward and intuitive – Formula will calculate almost anything, but you'll need to know how to proceed first!
When you drop Formula onto your new Stacks page, you will see a form with Input Field with an Import Value stack, Output and Formula. Plus a + button for child stacks. Click on the Import Value stack and check the settings panel. The Import Type can be set to Number Input (default), Checkbox, Select, Slider, or Date/Time Range. The Value is followed by an Import ID. So let's take a simple example and say you sell Coffee. And the smallest amount of coffee you can order is one pack. Set 'Amount' as the ID and the Min Value to 1. The Max Value can be set up to an indefinite amount, but let's restrict our customer to ordering 10 packs of coffee and set the Default order number to 1.
Leave the Styles at their default value for now – Single Column and Select Width 280px.
Now you can click the + button and add a new Import Value stack. Set the Type to Select, change the ID to Coffee and add Formula Selection options by clicking the child stack's + button. Arabica, Robusta, etc. Now activate the first Formula Select field and the price difference to your base product. E.G. Arabica costs €10 a pack, Robusta – our base product – costs €12; in the Formula Select field for Arabica, set -2. You get the idea?
Next you could add an Options Field with a Checkbox – For a Value Added Pack that is 20% more expensive than the selected product. In the Import Value settings, add an ID, a text description for the product, set the Disabled Value to 1 and the Enabled Value to 1.2. These are the multiplicators that will later be used to calculate the end price.
Once you've added The import Values that your product requires, it's time to sit down and work out the formula for your calculation. If you write it down on a piece of paper, it will make things easier for you. Here's an example from our Coffee Sales Page: ((quantity * 12 + input-options) * value-added-pack) * (input-tip / 100 + 1). The formula includes a tip for the delivery driver.
Formula can calculate Addition, Subtraction, Division and Multiplication. The Formula is added to the stack with child stacks and in the settings panel, you need to set the Type of Segment – which also includes Import Value, Number, Parenthesis and Custom Expression.
I suggest that you set up Formula on a blank page – it gives you more room to work. Once you have your Input Values set up and your formula calculates the correct values, it's time to format your stack. The main settings panel gives you a choice of three Calculator Themes plus an additional Custom setup.The default theme is a light coloured theme, themes 2 and 3 are dark themes. Custom opens up a range of additional settings for the Background Colour, Borders, and shadow. Below the Custom settings, you'll find Padding values for the Input Fields, The Input Background colour, the Border Styles and Shadows. The Font Family expects a Google Font and has settings for the Size, Weight and Line Height. By default the theme font settings are inherited.
The Output settings Include Decimal Places, and Separators; Labels for the Answer. The Font settings duplicate the Input settings.
But I'm getting ahead of myself…
… the Output Answer also has a dropdown menu with the options Show Below Calculator Input, Show In An External Field, No Answer/Calculator Input Only and Show Answer Only/No Calculator Input.
The option Show In An External Field is of special interest. If you hover over the screenshot above, you'll see that in the second image, Formula is positioned next to a contact form (in this case 1LD's Super Forms). In the last field of the contact form, you'll notice the Total Price of the coffee that is being ordered. All other order details are being passed on to hidden fields within the contact form. Once Miss Jones has entered her contact details, she can click Submit and her coffee order will be sent off to be delivered in time for breakfast next day.
Formula is well thought out and will allow you to build the most complicated calculations that you can think of (unless you have a diploma in advanced mathematics). It's ideal for a booking form, small online store, or for calculating the cost of your new bathroom tiling – and it has the added value that the calculation can be passed on to you via email.
Now go forth and make those calculations work for you!
Links to the developers ® All trademarks cited on this page are the property of their respective owners.
Do you have a question regarding RapidWeaver?
Would you like help with your new project?
Would you like us to build your new RapidWeaver website?
Don’t miss a post!
Sign up for our monthly newsletter.
A monthly digest of all the latest updates from our RapidWeaver blog, keeping you up to date with the hottest new stacks and themes.
265 Moo 2
Mae Na Toeng Nai, Pai
Mae Hong Son
We design websites and print-products for small businesses at reasonable prices. We specialise in Responsive Web Design.
We do not harvest or sell personal information.
© rjh web design 2010—16