With GTM please advise what 'd be the overall process [fm Custom html Tag to JS] or the big picture on how to fire dynamic html code like a div content (with text or image) according a rule such as the referral or cookie variable ?
Scenario : if a visitor come from google organic, then display a specific text paragraph or a banner at the beginning of the page.
Thanks a lot.
Create a new variable of the referrer type. Create a variable for the page url.
Create a trigger that fires
if the referrer starts with google (or www.google)
the page url does not contain utm_ (campaign parameters for adwords start with utm_)
the page url does not contain gclid (glcid is the parameter used in Adwords auto tagging)
Attach the trigger to your HTML tag (i.e. "fire tag when visitors comes via google but is not an adwords campaign").
The same principle can be used for other triggers (i.e. check for specific campaign parameters in the url, check if the referrer is empty on the landing page to check for direct visits etc).
Related
I received a custom tag by a marketing firm to place on a Wordpress site for tracking clicks on certain buttons. I am using the Elementor page builder on the site and have given each button a unique button ID. I am new to Google Tag manager by the way. From my understanding, I would need to use the custom html tag option so that I can use the marketing firm's custom tag with their tracking code. When creating the custom html tag in GTM, I'm presented with html box and am stuck as to how to get the tracking code to fire. I've set up the trigger to correspond with the button ID but that isn't enough. Here's what I've tried:
I've tried just entering (see below) in the HTML field: (the example is for the newsletter button). I thought maybe there is some "magic" that tag manager uses to build the event listener but I couldn't get anything to fire.
'''<noscript><img src="https://tags.srv............." width="1" height="1"/></noscript>'''
Next I tried to inject something like this to no avail (see my note as I was guessing here):
<script>
document.addEventListener("DOMContentLoaded", function(event) {
jQuery('#newsletter_send_button a').click(function(){
//tracking code here
//for example Facebook Pixel:
fbq('trackCustom','newsletter_send_button'); <<<HERE IS WHERE I'M UNSURE
OF WHAT TO PUT IN.>>>
</scipt>
<noscript>
<img src="https://tags.srv...................."
width="1"
height="1"/>
</noscript>
Google tag manager is installed on the site. I see my universal tag firing so I know I'm good. Now how do I add this custom tracker to individual buttons on the site? Maybe I'm headed in the wrong direction but I think I have to use the Custom HTML option in Google Tag Manager because the tracker info is being sent to the marketing agency and not the business's individual GTM account. I'm just at a loss. I "think" the tracker is a Facebook pixel because of the tag (just guessing here). Any ideas?
In case anyone else runs across this thread, I as able to get it to work. If a 3rd party agency (marketing) sends you a img pixel, use the Custom Image tag in Google Tag Manager and input only the URL (no img tag or height/width) in the Image URL area and leave Cachebusting on. Sounds simple after you figure. Also, if you are using Elementor forms and are looking to fire the tag based on a successful form submission, one word of recommendation is to create a separate redirect page and set the trigger to be the page url of the redirect page. You can use the div.elementor-message-success css tag as the element trigger but that works for all successful form submissions and getting GTM to read the form ID after the submit button has been clicked didn't work for me hence why I just used the redirect url as the trigger.
i have a customer who is using Jimdo, he wants to sell his products via affiliate networks and he wants to share a 30% Commission based on the sales amount.
The affiliate network provided this pixel:
<iframe src="https://network.com/track?offer_id=123&amount={sale_amount}" height="1" width="1" frameborder="0" scrolling="no"></iframe>
I need to figure out how to pass the final conversion value from Jimdo back to the network.
Jimdo Problems:
Due to the HomePage kit, no individual thank you pages pages can be created. There is only one Page /orderconfirmation to add the pixel.
That's why I've been looking for a new solution and are currently trying to solve affiliate plans of my customer with the Google Tag Manager (GTM).
Now I we have new problems.
Typically, with Google Tag Manager you can detect different DataLayers that allow you to work with them. Unfortunately, Jimdo is not really transparent and GTM is not able to capture this DataLayer.
If you check their website structure with your browser, the are actually have all data points.
Module ID
List item
Data-product-id
Data-variant-id
Data-product-count
Data-product-item-id
Data-product-hash
Order_tracking_ID
If this cant be done, fine.
Then I just try to determine the code structure of the cart value.
picture
I need to know how to get sales amount value and pass it back to the affiliate network via Google Tag Manager.
Trigger should be the last button "buy now" before the thank you and on the thank you page the pixel should fire www.somejimdosite.com/orderconfirmation
Other ideas are welcome!
What javascript query could help to solve this problem? (Tag in GTM)
Can this help to get the data?
document.querySelector(".cc-checkout-number span").textContent
You don't even need custom javascript - the DOM type variables can be used to retrieve the text content of a CSS selector (will match the first one it finds, but I assume checkout number will occur only once on the page). You just need to set selection method to "CSS Selector" instead the default "Id". If you do not enter anything in "Attribute name" the variable will return the textContent.
And take care that you do not fire your tag on page load - the DOM needs to be there to be scraped, so DOM ready is the earliest moment you can use this
To begin with, I'm fairly knowledgeable with both html5 and css3. Right now I'm trying to create a website that allows visitors to edit website content so that all visitors are able to see the edits. I know about contenteditable but this attribute does not last when the page is refreshed and no other visitors to see the edits. For example:
<p> Edit me please </p>
A visitor would be able to edit the element above by visiting the website and simply selecting and typing. Also I have heard that javascript, jquery, sql, and php can all allow visitors to edit website content but I don't know which is the best.
To sum up, if anyone knows how to allow visitors of a website to edit its' content it would be much appreciated to share their knowledge.
Create a database table (lets call it "strings") , and just define 2 columns - "string_identifier" and "string_value"
When you render the page, simply query the database to fetch the strings and their identifiers. Each editable element should have an attribute containing its identifier.
You can use jquery to capture the click event on all editable elements, and replace it with an input with that text.
Then assign an event handler to that input, so when the enter key is pressed, it sends a request to a php script (with the identifier and new string as data) on the server to update the database with the new string.
If you would like live updates to all other clients (no need to refresh), use jquery to continuously request a file on the server (endless loop), which will return a JSON object containing all the strings. Then go through and replace the text of all editable elements on the data with the new strings you have received from the server.
I am creating a Google chrome plugin that injects a button onto all Facebook articles/posts. On click, i would like to query the graph API that Facebook provides and receive the post that the button is injected onto from Facebook.
Does anybody know how to do this or if this is even possible?
I have tried just using JavaScript to search the HTML that the button is injected onto and navigate through the HTML elements in order to find the text content, but this gets very messy quickly.
I was just wondering if somebody knew if the HTML elements contain some sort of identifier that will allow me to query the graph API and receive the specific post im looking for. The HTML does contain the users username but not the specific post ID.
Thanks for reading.
I haven't touched the Facebook graph-API, but if you're just looking for post ID's from the home page on Facebook you can do a simple document.getElementsByClassName("uiStreamSource") and then get all <a> elements inside. The last part of each href always contains the specific post ID.
In my web page, users can click on inputs which are check boxes. Later in their browsing, the options they chose cause other html documents to be displayed in the page they are in. At least that's the idea.
So, User A clicks check boxes for "Doc1" and "Doc4".
An ajax call goes out to a web service and pulls these documents back. They are html.
The callback method should take this html and insert it into the page.
I tried using an iframe, however that seems to require the src attribute to be specified. The html that comes back is a full page including . This would be on an HTML5 compatible browser only.
Is this possible, or should I be looking at something other than iframe?
I solved this as follows:
User checks a couple check boxes and clicks 'next'.
AJAX call goes out to retrieve those documents associated with the checkboxes.
The page displaying retrieves this data, and creates iframes as needed.
SRC cannot be specified because there is NO url!
IE doesn't support ...'> because 2083 chars is the limit for IE.
Final solution is to write manually to the iframe:
var target = document.getElementById(someIframe).contentDocument;
target.open();
target.write(documentReceivedFromAJAXCall);
target.close();