Skip to content

Instantly share code, notes, and snippets.

Avatar

JetSloth jetsloth

View GitHub Profile
@jetsloth
jetsloth / gform_pre_render_custom_color_picker_options.php
Created April 20, 2023 00:33
Example of dynamic population for color picker options
View gform_pre_render_custom_color_picker_options.php
<?php
add_filter( 'gform_pre_render', 'populate_gf_color_choices' );
add_filter( 'gform_pre_validation', 'populate_gf_color_choices' );
add_filter( 'gform_pre_submission_filter', 'populate_gf_color_choices' );
add_filter( 'gform_admin_pre_render', 'populate_gf_color_choices' );
function populate_gf_color_choices( $form ) {
if ( $form['id'] != 9999 ) {// set to the form id you want to run this on
@jetsloth
jetsloth / custom_image_choices_size.php
Created October 23, 2022 23:11
Customise the image size used for Image Choices
View custom_image_choices_size.php
<?php
add_filter( 'gform_pre_render', 'custom_image_choices_size' );
add_filter( 'gform_pre_validation', 'custom_image_choices_size' );
add_filter( 'gform_pre_submission_filter', 'custom_image_choices_size' );
add_filter( 'gform_admin_pre_render', 'custom_image_choices_size' );
function custom_image_choices_size( $form ) {
foreach ( $form["fields"] as &$field ) {
if ( property_exists($field, "imageChoices_enableImages") && !empty($field->imageChoices_enableImages) ) {
View custom-newsletter-style.css
/*Import font*/
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@900&display=swap');
.newsletter-signup_wrapper {
border: 1px solid #ebebe5;
border-radius: 20px;
background-color: #fafbf8;
background:url('https://images.unsplash.com/photo-1509624776920-0fac24a9dfda?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2369&q=80');
padding: 80px;
background-size:cover;
}
View ic-icon-box-styles.css
/*////////////////////////// Color Variables //////////////////////////*/
:root {
/*Purple*/
--theme1: #7245F1;
--theme1-light: #F0ECFD;
/*Orange*/
--theme2: #FFA630;
--theme2-light: #FFF7EC;
/*Blue*/
--theme3: #0076FF;
View css-animations-gradient-background.css
/*Add animated CSS gradient to your form background*/
.gradient_wrapper {
background: linear-gradient(45deg, #2455EB, #24DDEB, #59EB24);
background-size: 600% 600%;
animation: GradientBackground 9s ease-in infinite;
border:none!important;
}
@keyframes GradientBackground {
0% {
View css-animations-pulse.css
/*Add the class pulse to any field you want to pulse*/
.pulse input,
.pulse textarea {
animation: pulse-animation 3s infinite;
}
@keyframes pulse-animation {
0% {
box-shadow: 0 0 0 0px #2d6dec;
}
View css-animations-wiggle.css
/*Below will apply the chose wiggle effect to the submit button.*/
/*Just change the animation type to the wiiggle effect you want, wiggle1,wiggle2,wiggle3,wiggle4.*/
.gform_button.button {
animation: wiggle1 1.5s ease-in infinite;
}
/*CSS Wiggle 1*/
@keyframes wiggle1 {
0%, 7% {transform: rotateZ(0);}
15% {transform: rotateZ(-13deg);}
View Gravity-forms-logo-designer.css
/*Import google font - Montserrat*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@800&display=swap');
/*Form outside wrapper styles*/
.gform_wrapper.logo-creator_wrapper {
background: #FFFFFF;
border: 2px solid #1D1D1F;
box-shadow: 5px 5px 0 0 #000000;
border-radius: 5px;
position:relative;
}
View gf-custom-form-design-demo5.css
/*Variables - Change Colors here*/
:root {
--blue-color: #1451c7;
--pink-color: #ff8089;
}
/* Basic input styles */
.gform_wrapper.gravity-theme .demo5-box-layout input[type="text"],
.gform_wrapper.gravity-theme .demo5-box-layout input[type="email"],
.gform_wrapper.gravity-theme .demo5-box-layout input[type="tel"],
.gform_wrapper.gravity-theme .demo5-box-layout textarea {
View gf-custom-form-design-demo4.css
/*Variables - Change Colors here*/
:root {
--aqua-color: #9fe0dc;
--dark-aqua-color: #83c4c0;
--yellow-color: #f6c834;
}
/* Basic input styles */
.gform_wrapper.gravity-theme .demo4-box-layout input[type="text"],
.gform_wrapper.gravity-theme .demo4-box-layout input[type="email"],
.gform_wrapper.gravity-theme .demo4-box-layout input[type="tel"],