I would like to convert all the form fields labels of the contribution pages and events pages into placeholder. Is it possible to do? If yes, how please ? Thanks

enter image description here

enter image description here

  • Can you provide an example of the end result you want to achieve? – Aidan Mar 13 '20 at 8:50
  • @Aidan say for names, address, any custom fields that are usually available by profile, for those ones remove labels and show a placeholder of the same name as labels. – Tapash Mar 13 '20 at 8:52
  • Still not sure I understand what you want to do, but does Word Replacement or even translation help? – Aidan Mar 13 '20 at 9:01
  • @Aidan I have added screenshot – Tapash Mar 13 '20 at 12:49
  • Ah - I get it now! A picture is worth a 1000 words etc ... – Aidan Mar 13 '20 at 14:09

You write a small jQuery script and include it on your forms

<script type="text/javascript">
CRM.$(function($) {
  let label, labelDiv, value;
  $('input').each(function() {
    value = $(this).val();
    labelDiv = $(this).closest('.crm-section').find('.label');
    label = $(labelDiv).text();
    label = label.replace(/\s\s+/g, ' ');
    $(this).attr("placeholder", label);

There are various ways to include jquery in your forms

  1. Implement hook(buildform or preprocess or pagerun) via extension/plugin/module to add js using add resource method
  2. Override tpl file using extra.tpl method to include jquery
  • Thanks. But what do you mean by forms? Create a tpl file or something? – Tapash Mar 13 '20 at 13:06
  • Just updated my answer – Pradeep Nayak Mar 13 '20 at 13:12
  • Thanks @Pradeep which template does the contribution pages use? – Tapash Mar 13 '20 at 14:44
  • templates/CRM/Contribute/Form/Contribution/Main tpl – Pradeep Nayak Mar 13 '20 at 14:51
  • If you trying to override the template by custom templates or extra.tpl than make sure your extension or module or plugin dont have this file already in their folder than either yours or module will be invoked based on how ext or module is invoked – Pradeep Nayak Mar 13 '20 at 14:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.