Skip to content

Instantly share code, notes, and snippets.

Avatar
🏄‍♂️

mark l chaves marklchaves

🏄‍♂️
View GitHub Profile
@marklchaves
marklchaves / popup-maker-disable-pum-content-focus-outline.css
Created Aug 5, 2021
Popup Maker - disable unwanted outline (border) around pum-content when it's in focus
View popup-maker-disable-pum-content-focus-outline.css
.pum-content:focus {
outline: none !important;
}
/* Add to Appearance > Customize > Additional CSS */
@marklchaves
marklchaves / popup-maker-send-hidden-field-to-mailchimp.php
Created Jul 30, 2021
Popup Maker - Send a hidden field to Mailchimp
View popup-maker-send-hidden-field-to-mailchimp.php
<? // Ignore this first line when copying to your child theme's functions.php file.
/** Mailchimp hidden field */
function custom_popup_api_args( $subscriber ) {
$subscriber['merge_fields'][ 'MYHIDDEN1' ] = 'This is a hidden field value coming over.';
return $subscriber;
};
add_filter( 'pum_mci_api_call_subscriber_args', 'custom_popup_api_args' );
@marklchaves
marklchaves / astra-fix-unwanted-border-outline.css
Created Jul 23, 2021
Astra theme fix for unwanted border style and outline on mobile submenu toggle
View astra-fix-unwanted-border-outline.css
/**
* Add this custom CSS to remove the unwanted border
* (large dots) and thin outline on focus. See screengrab
* in the gist comments section.
*
* https://marklchaves.medium.com/adding-custom-css-to-your-wordpress-website-how-to-guide-a50b474af36d
*/
.ast-menu-toggle {
border-style: none; /* Add !important if needed. */
View find-images-with-no-alt-text.js
console.clear();
let out = '';
let images = [];
let problems = [];
$$('img').forEach(img => {
//document.querySelectorAll('img').forEach(img => {
let text = img.getAttribute('alt');
if (!text) {
img.style.outline = '3px solid orangered';
problems.push(img);
@marklchaves
marklchaves / avada_add_custom_html_above_header.php
Last active Jul 15, 2021
PHP hook for adding custom HTML above the header in the Avada theme.
View avada_add_custom_html_above_header.php
<?php // Don't copy this first line when adding to your child theme's functions.php file.
/** Add custom HTML above the header in the Avada theme. */
function add_my_html() {
if ( is_page( array( 'sample-page' ) ) ) {
return;
}
$my_html = <<<EOT
<style>
.my-header-styles {
@marklchaves
marklchaves / popup-maker-1-3-5-plus-pages.js
Last active Jul 20, 2021
Show a Popup Maker popup for the first, third, fifth, and sixth+ pages only.
View popup-maker-1-3-5-plus-pages.js
/** Set up the page counter in the browser's session storage. */
(function(){
let pc = parseInt(sessionStorage.getItem("page-count"));
if (!pc) {
sessionStorage.setItem("page-count", 1);
} else {
if (pc >= 5) return; // Can stop counting now.
sessionStorage.setItem("page-count", pc += 1);
}
})();
@marklchaves
marklchaves / alternative-jquery-solution.js
Last active Jul 16, 2021
Try overriding the Gravity Forms default confirmation with a Popup Maker popup using either a GF hook or with jQuery.
View alternative-jquery-solution.js
/* Try this code in the footer area of your page if the PHP hook below doesn't work. */
jQuery(document).ready(function ($) {
// Replace 123 and 456 with your respective popup IDs throughout.
$("#pum-123").on("pumBeforeOpen", function () {
const $gfConfirmation = $("#gform_confirmation_message_2"); // Replace 2 with your form's ID.
if ($gfConfirmation.length) {
console.log(`%c[PUM] Confirmation loaded for Gravity Forms form #2.`, 'color:orangered;font-size:16px');
PUM.preventOpen(123); // First popup with the GF form.
PUM.open(456); // Thank you popup.
@marklchaves
marklchaves / popup-maker-send-impression-conversion-to-ga4-all-popups.js
Last active Jul 13, 2021
Popup Maker: Send a popup impression and conversion to GA4 using the gtag.js API
View popup-maker-send-impression-conversion-to-ga4-all-popups.js
/**
* Generic version to send impresions for all popups.
* I.e., no harcoded values.
*/
jQuery(document).ready(function($){
// Let's send popup impressions to GA4.
$("[id^='pum-']").on("pumAfterOpen", function (e) {
console.log(`[GA4] Popup impression for popup ${$(e.target).attr("id")}.`);
gtag("event", "popup_impression", {
popup_id: $(e.target).data("popmake").slug,
@marklchaves
marklchaves / ashtabula-custom.css
Last active Jul 13, 2021
Override Ashtabula Settings
View ashtabula-custom.css
/**
* Keep the image and the text stacked for
* all display widths.
*/
.swiper-slider-plugin__section {
display: flex;
align-items: center;
justify-content: center;
}
@marklchaves
marklchaves / send-generate-lead-ga4-using-gtag.js
Last active Jul 6, 2021
jQuery for sending a generate_lead event (form submission) to GA4 using WPForms and gtag.js API
View send-generate-lead-ga4-using-gtag.js
/** We'll use WPForms as an example. */
jQuery(document).ready(function($){
// Trick from https://www.chrisains.com/seo/tracking-wpforms-submissions-with-google-analytics/
let $wpConfirmationDiv = $('#wpforms-confirmation-357');
if ($wpConfirmationDiv.length) {
console.log('[GA4] WPForms #357 was successfully submitted.');
gtag("event", "generate_lead", {
'form_id': 'WPForm #357', // TO DO: Try to get form ID or name here.
});
}