webform

Diana tiro con arco olimpico representado el remarketing de Google
Google remarketing is a powerful tool for displaying AdWords ads to visitors to our web site based on a set of rules that can be customized. The drupal webform module is one of the most used, especially to create contact forms, information requests, registrations, etc. In this article we will explain how to make a module that allows us to remarket to users who have submitted a form with a specific value selected, which will create a callback in our module responsible for creating the webform submission confirmation url, including only a single parameter of product, service or topic on which we want to remarket.  We will use as an example a webform that has a product selection component in which there are 3 options: 1 | Premium 2 | Advanced 3 | Basic The aim is for the webform submission confirmation page to include the selection code for which the user has requested information, so that we can configure our AdWords product knowing what the user is interested in. To do this, we will set a confirmation page with a fixed part and a second dynamic part, including the selected product from the webform, so the possible URLs in our example would be: /envio-realizado/1 /envio-realizado/2 /envio-realizado/3 We must additionally configure the webform to use a custom URL that we create as the confirmation page and add it to the parameters that the user has selected on the form. The first thing to do is create the module, in Drupal's hook_menu, which will provide a custom URL and callback to handle these requests. We will call our example "webform_remarketing." /** * Implements hook_menu(). */ function webform_remarketing _menu() { $items = array(); $items['envio-realizado/%'] = array( 'title' => 'Submission received', 'description' => 'Confirmation page for webform', 'page callback' => 'webform_remarketing _confirmation_page', 'page arguments' => array(1), 'access arguments' => array('access content'), ); return $items; } Once we have created the menu, we need to add the function defined in the callback page that will provide the content for display on screen: /** * Confirmation page menu callback. */ function webform_remarketing _confirmation_page ($producto) { return . t('Submission received') . ; } This function is an example for teaching purposes, so it just shows a simple message.  Logically, it's common to want to show more content, so it's good to remember that all content displayed to the user should use a theming feature so it can be easily modified by the site developer. The next step we need to take is to modify the configuration webform to use the confirmation page that we created in our module and pass the value selected by the user.  To do this, edit the webform options in the "form settings" tab.  Among other options, there is a section called "address redirection" which offers 3 options.  We need to select "Custom URL" and enter the URL that we defined in our module and make the webform correctly pass to the second part of the URL the value set by the user in the product selection component.  For this we use the corresponding token, which in this case would be [submission: values :?] where the “?” must be replaced by the form_key of the component.   Assuming that the value is “product," what we should put in this field would be: envio-realizado/[submission:values:producto] With this, we have achieved our goal.  When a user fills out the form and requests information about a product, the confirmation URL includes the code for that product, so we can configure remarketing using these URLs in AdWords and set our campaigns.
Placeholder text form
With the advent of HTML5 few years ago, the possibility to add placeholder has appeared The placeholder text is displayed in a text field on a form before the user complete, it’s very useful since it clarify what information must be entered in this field. For example, the HTML code: <form> <label for="search">Subscribe to the newsletter</label> <input id="news" type="text" placeholder="Enter your email" name="seach"> <button id="subscribebutton" type="submit">Send</button> </form> It show something like this Adding placeholders to the forms is a good practice that improves usability and of course the user experience. The W3C recommends using the placeholder always with the Label that, since they are supposedly complementary, but in Wild Wild Web, we often use only one of the two, since using both will be redundant. Support for placeholder will only be visible in most modern web browsers but usually a jquery fallback is implemented for the same functionality in older browsers. There are several ways to add a placeholder to a field on a form in Drupal 7. Below we highlight 4 which we consider the most useful. Form module Placeholder https://www.drupal.org/project/form_placeholder This module allows us to add placeholders to any form of the site from the Drupal administration. Hints Webform module https://www.drupal.org/project/webform_hints This module allows automatic placeholders to incorporate any textfield, testarea, select list and email field forms created with the webform module (https://www.drupal.org/project/webform) This module also comes with support for older browsers that do not support the placeholder attribute will and implement the fallback using jQuery. Field placeholder module https://www.drupal.org/project/field_placeholder It allows you to add the placeholder attribute to any field of a drupal entity, as fields of a content type, terms of taxonomy, user, etc. When activated, it displays a new option to enter the placeholder when you edit or create a field. Function in the template.php Finally the more advanced technical approach that involves all code but it’s the most powerful of all. It is about adding the following function to template.php file from our theme. function YOURTHEMENAME_form_alter( &$form, &$form_state, $form_id ) { if (in_array( $form_id, array( 'user_login', 'user_login_block'))) { $form['name']['#attributes']['placeholder'] = t( 'Username' ); $form['pass']['#attributes']['placeholder'] = t( 'Password' ); } } This case introduces a placeholder for the login form. Remember to change the name of the function YOURTHEMENAME by the name of your theme, and change the id of the form and name of the field you want to make the change. Learn how to get the id of a form.
How can we help?Get in touch