techjewel

<?php

/*
 * Create a custom shortcode for email / confirmation or other after form submit
 * Usage: {my_custom_shortcode}
 * @param $value string original shortcode string
 * @param $parser class \FluentForm\App\Services\FormBuilder\ShortCodeParser
 */
add_filter('fluentform_shortcode_parser_callback_my_custom_shortcode', function ($value, $parser) {

techjewel

<?php

/*
 * Catch submission the before it's inserting in database
 * if you want to log the data in the database use hook: fluenform_before_submission_confirmation
 */
add_action('fluentform_before_insert_submission', function ($insertData, $data, $form) {
    if($form->id != 156) { // 156 is our target form id
        return;
    }

techjewel

<?php

/*
* Add the folliwing code to your theme's functions.php file.
* This code will only load if a page has fluent forms.
*/

add_action('fluentform_before_form_render', function () {
    static $isloaded = false;
    if($isloaded) {

techjewel

(function($){    
    if(typeof gtag != 'function') {
      return;
    }
    var fluentForms = $('form.frm-fluent-form');
    fluentForms.each(function() {
      var $form = $(this);
      var formId = $form.attr('data-form_id');
      
      gtag('event', 'ViewForm', {

techjewel

gtag('event', 'ViewForm', {
  'event_category': 'FluentForms',
  'event_label': 'View Form',
  'form_id': formId
});

$form.on('fluentform_submission_success', function() {
    gtag('event', 'FormSubmission', {
      'event_category': 'FluentForms',
      'event_label': 'Form Submitted',

techjewel

@media (max-width: 767px) {
  .fluentform .ff-el-group.ff_list_buttons .ff-el-form-check span {
    width: 100% !important;
    border-left: 1px solid #dcdfe6 !important;
    border-radius: 0 !important;
   }

   .fluentform .ff-el-group.ff_list_buttons .ff-el-form-check {
        margin-top: -1px !important;
        display: block !important;

techjewel

<?php
/*
* Add Attachment to the email notification dynamically.
* @param $attachments array - Array of the attachments.
* @param $notification array - Email Notification array
* @param $form object - The Form Object
* @param $data array - The input submission data
* @return array 
*/

techjewel

/**
 * Function to prevent users mark more than expected items.
 * This code must need to be placed in custom JS of your form 
 * @param: containerClass String - The contaner class of the target checkbox block. 
 *           You can add a custom container class in the form settings
 *
 * @param: maxChecked Integer - Max Number of items user can mark
 * @return: void
 *
 */

techjewel

// You can make the inline radio button look like button switch
// Steps:
// Add container class of the element "ff_button_style"
// Select Layout: Inline Layout
// Lastly add this css to custom css of the form

.ff-el-group.ff_list_inline.ff_button_style .ff-el-form-check {
    background: #d2d2d2;
    margin: 0 !important;
    padding: 0 !important;

techjewel

/*
* Add this js snippet in Form's JS box
*/

function capitalizeFLetter() { 
  var $input = $form.find('.ff-name-field-wrapper').find('input');
  $input.on('blur', function() {
     var string = $(this).val();
     if(string) {
        string = string[0].toUpperCase() + string.slice(1);