Skip to content

Instantly share code, notes, and snippets.

Avatar

JetSloth jetsloth

View GitHub Profile
@jetsloth
jetsloth / gf-radio-checkbox-buttons.css
Created Jul 26, 2022
CSS Styled Radio & Checkbox Buttons - Gravity Forms 2.5+
View gf-radio-checkbox-buttons.css
/*Gravity Forms 2.5+ CSS Styled Radio & Checkbox fields*/
.gchoice {
z-index:1;
position:relative;
margin:0 0 10px 0;
padding:0;
height:70px;
}
input.gfield-choice-input {
z-index:2;
@jetsloth
jetsloth / gf-legacy-radio-checkbox-buttons.css
Created Jul 26, 2022
CSS Styled Radio & Checkbox Buttons - Legacy Gravity Forms
View gf-legacy-radio-checkbox-buttons.css
/* //////////// Legacy CSS version //////////// */
.gform_legacy_markup_wrapper.gform_wrapper li.gfield ul li.gchoice {
z-index:1;
position:relative;
margin:0 0 10px 0;
padding:0;
height:70px;
}
.gform_legacy_markup_wrapper.gform_wrapper li.gfield ul li.gchoice input {
z-index:2;
@jetsloth
jetsloth / image-choices-page-transitions.css
Created Jul 25, 2022
Image Choices + Page Transitions CSS
View image-choices-page-transitions.css
/* Style form wrapper max width 900px */
.gppt-has-page-transitions_wrapper {
background: #FFFFFF;
border: 1px solid #EBEBEB;
box-shadow: 2px 3px 4px 0 rgba(33,39,47,0.05);
border-radius: 8px;
max-width:900px;
min-height: 560px;
margin:0 auto;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
@jetsloth
jetsloth / wc-toggle-gfpa-collapsible.html
Created Jul 29, 2021
Toggle the WooCommerce elements (subtotal, total, quantity and add to cart) based on whether the last Collapsible Section is open or not. For use with WooCommerce Gravity Forms Product Addons and Collapsible Sections. The code below can be added to a HTML field in your form.
View wc-toggle-gfpa-collapsible.html
<script type="text/javascript">
(function($){
function toggleAddToCart( $form, show ) {
if ( typeof $form === 'undefined' || !$form.length ) {
return;
}
if ( show !== true ) {
show = false;
View image_choices_basic_product_configurator.html
<script type="text/javascript">
(function($){
$(document).bind('gform_post_render', function(e, formId, currentFormPage) {
var formSelector = '#gform_' + formId;
var $form = $(formSelector);
if ($form.data('configurator-init') === true) {
// configurator has already been initialised
return;
@jetsloth
jetsloth / image_choices_horizontal_scroll.html
Last active May 28, 2022
Create a horizontal scrolling container (with a scrolling bar) to display all image choices on a single line. You can add a HTML field to your form and put this script as its content
View image_choices_horizontal_scroll.html
<script type="text/javascript">
(function($){
function scrollableImageChoices( formId ) {
var $fields = ( typeof formId !== 'undefined') ? $('#gform_' + formId + ' .image-choices-field') : $('form[id^="gform_"] .image-choices-field');
if (!$fields.length) {
return;
}
$fields.each(function(){
var $field = $(this);
@jetsloth
jetsloth / gform_format_option_label.html
Last active Jun 10, 2021
Using gform_format_option_label together with Image Choices
View gform_format_option_label.html
<script type="text/javascript">
window.gform_format_option_label_original = window.gform_format_option_label;
window.gform_format_option_label = function(fullLabel, fieldLabel, priceLabel, selectedPrice, price, formId, fieldId, index) {
// Update any of the variables to format, Eg;
// priceLabel = "";
return window.gform_format_option_label_original(fullLabel, fieldLabel, priceLabel, selectedPrice, price, formId, fieldId, index);
};
</script>
@jetsloth
jetsloth / gfic_choice_price_filter.html
Created Jun 5, 2021
Using JetSloth's gfic_choice_price filter to hide the price label in option fields
View gfic_choice_price_filter.html
<script type="text/javascript">
window.jetsloth_add_filter('gfic_choice_price', function(priceLabel, selectedPrice, price, formId, fieldId, index){
return '';
});
</script>
@jetsloth
jetsloth / gform_set_post_meta_to_image_choices_urls.php
Last active May 25, 2021
Set the post meta field to selected image choices URL
View gform_set_post_meta_to_image_choices_urls.php
<?php
add_filter( 'gform_post_data', 'gform_set_post_meta_to_image_choices_urls', 10, 3 );
function gform_set_post_meta_to_image_choices_urls( $post_data, $form, $entry ) {
foreach( $form['fields'] as $field ) {
$value = RGFormsModel::get_lead_field_value( $entry, $field );
if ( $field->type != 'post_custom_field' || !property_exists($field, 'postCustomFieldName') || empty($field->postCustomFieldName) || !property_exists($field, 'imageChoices_enableImages') || empty($field->imageChoices_enableImages) || !isset($post_data['post_custom_fields'][$field->postCustomFieldName]) ) {
// if it's not a custom field, doesn't use image choices, or no custom field name configured, skip
@jetsloth
jetsloth / gpecf_image_choices_custom_order_sumary_markup.php
Last active May 7, 2021
Gravity Perks eCommerce Fields Order Summary markup customised to include Image Choices display
View gpecf_image_choices_custom_order_sumary_markup.php
<?php
add_filter( 'gpecf_order_sumary_markup', 'get_custom_order_summary_markup', 10, 6 );
function get_custom_order_summary_markup( $markup, $order, $form, $entry, $order_summary, $labels ) {
ob_start();
$form_id = rgar($form, "id");
?>
<table class="gpecf-order-summary" cellspacing="0" width="100%" style="<?php gp_ecommerce_fields()->style( '.order-summary' ); ?>">
<thead>
<tr>