Skip to content

Instantly share code, notes, and snippets.

View jetsloth's full-sized avatar

JetSloth jetsloth

5 followers · 0 following
View GitHub Profile
@jetsloth
jetsloth / gpecf_image_choices_custom_order_sumary_markup.php
Last active May 7, 2021 04:06
Gravity Perks eCommerce Fields Order Summary markup customised to include Image Choices display
<?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>
@jetsloth
jetsloth / gform_set_post_meta_to_image_choices_urls.php
Last active May 25, 2021 01:53
Set the post meta field to selected image choices URL
<?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 / gfic_choice_price_filter.html
Created June 5, 2021 00:57
Using JetSloth's gfic_choice_price filter to hide the price label in option fields
<script type="text/javascript">
window.jetsloth_add_filter('gfic_choice_price', function(priceLabel, selectedPrice, price, formId, fieldId, index){
return '';
});
</script>
@jetsloth
jetsloth / gform_format_option_label.html
Last active July 17, 2024 02:18
Using gform_format_option_label together with Image Choices
<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 / image_choices_horizontal_scroll.html
Last active May 28, 2022 00:39
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
<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 / image_choices_basic_product_configurator.html
Last active January 23, 2023 06:31
See https://jetsloth.com/gravity-forms/how-to-build-a-product-configurator-with-gravity-forms-and-image-choices/
<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 ) {
// Add the preview layers
$(formSelector + ' .gform_body .gfield.image-choices-field.config-layer').each(function(i, el){
@jetsloth
jetsloth / wc-toggle-gfpa-collapsible.html
Created July 29, 2021 09:38
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.
<script type="text/javascript">
(function($){
function toggleAddToCart( $form, show ) {
if ( typeof $form === 'undefined' || !$form.length ) {
return;
}
if ( show !== true ) {
show = false;
@jetsloth
jetsloth / image-choices-page-transitions.css
Created July 25, 2022 03:52
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 / gf-legacy-radio-checkbox-buttons.css
Created July 26, 2022 01:13
CSS Styled Radio & Checkbox Buttons - Legacy Gravity Forms
/* //////////// 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 / gf-radio-checkbox-buttons.css
Created July 26, 2022 01:14
CSS Styled Radio & Checkbox Buttons - Gravity Forms 2.5+
/*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;