-
-
Save cliffordp/9856cdd1497802996f472d3d31299026 to your computer and use it in GitHub Desktop.
| I did not know at the time of writing this code and recording this video (https://www.youtube.com/watch?v=MHKzHf1BhrY) that THIS IS POSSIBLE NATIVELY FROM GHL, NO CUSTOM CODE NEEDED, NO CUSTOM VALUE NEEDED! | |
| Please use GHL Native functionality as documented here: https://help.gohighlevel.com/support/solutions/articles/48001172004 |
| <script id="tourkick-ghl-url-query-param-replacement"> | |
| // Source: https://gist.github.com/cliffordp/9856cdd1497802996f472d3d31299026 | |
| // Get and decode the query parameter from the URL. | |
| function getQueryParam( param ) { | |
| const urlParams = new URLSearchParams( window.location.search ); | |
| const paramValue = urlParams.get( param ); | |
| // Return null if the parameter is not present or is an empty string. | |
| return (paramValue !== null && paramValue.trim() !== '') ? decodeURIComponent( paramValue ) : null; | |
| } | |
| // Replace or insert the text content of all children that are text nodes. | |
| function replaceTextContent( element, newText ) { | |
| if ( element.hasChildNodes() ) { | |
| element.childNodes.forEach( function ( child ) { | |
| if ( child.nodeType === Node.TEXT_NODE ) { | |
| child.textContent = newText; // Replace text of text nodes. | |
| } else if ( child.nodeType === Node.ELEMENT_NODE ) { | |
| if ( !child.hasChildNodes() ) { | |
| // If the child element is empty, add a text node. | |
| child.appendChild( document.createTextNode( newText ) ); | |
| } else { | |
| // Recursive call for non-empty child elements | |
| replaceTextContent( child, newText ); | |
| } | |
| } | |
| } ); | |
| } else if ( element.nodeType === Node.ELEMENT_NODE ) { | |
| // If the element itself is empty, add a text node | |
| element.appendChild( document.createTextNode( newText ) ); | |
| } | |
| } | |
| // Replace the text content of all elements with a specific class, including itself. | |
| function replaceContentWithQueryParam( className, queryParam ) { | |
| const elements = document.querySelectorAll( '.' + className ); | |
| const queryParamValue = getQueryParam( queryParam ); | |
| // Check if queryParamValue is neither null nor an empty string. | |
| if ( queryParamValue ) { | |
| elements.forEach( function ( element ) { | |
| replaceTextContent( element, queryParamValue ); | |
| } ); | |
| console.log( `Replaced content in ${elements.length} elements.` ); | |
| } else { | |
| console.log( 'No valid query parameter value found for: ', queryParam ); | |
| } | |
| } | |
| // Instantiate a MutationObserver to wait for changes and update text. Required for GHL because it uses Nuxt (Vue.js). | |
| const observer = new MutationObserver( function ( mutations ) { | |
| mutations.forEach( function ( mutation ) { | |
| if ( document.querySelector( '.replace_location' ) ) { | |
| observer.disconnect(); // Stop observing once we make the changes. | |
| replaceContentWithQueryParam( 'replace_location', 'location' ); | |
| } | |
| } ); | |
| } ); | |
| // Observer configuration. | |
| const config = { childList: true, subtree: true }; | |
| // Start observing the target node for configured mutations. | |
| observer.observe( document.body, config ); | |
| </script> |
@QuinnMarketing The video in the help article uses a UTM parameter as an example. The functionality works for any URL query parameter. There is NOOOOO custom field ;) It just works like this:
You enter {{anything}} anywhere in the page.
Then you visit example.com/?anything=something and it'll render something
You are a weapon! Thank you for letting me know!
@QuinnMarketing tyvm, yw. request any additional learning topics at https://tourkick.com/contact
yw @JuliaBland :)
Thanks for sharing it with us :) I’m applying for a PhD program in Sociology, and writing a personal statement was a daunting task. I used https://academized.com/write-my-personal-statement and their service was outstanding. The writer crafted a statement that was professional, well-structured, and tailored to the program’s requirements. It highlighted my academic achievements and research interests perfectly. I’m really impressed with their work and would recommend them to anyone looking for help with applications!
So you rekon play around with the UTM parameters and use them instead? Are they replaced due to there being an associated custom field?