Can I call fbq('init') multiple times to use new pixel feature? - javascript

I want to use the new Facebook Ads Pixel feature where I can pass through my own information about a viewer when they're unmatched to the Facebook cookie.
However, I want to do this on a checkout page, which has fields for the user to enter in their name, address etc. They do this after the page has loaded, of course.
I can pull the information from the fields as the customer types, or once the person clicks on the buy button. However, is there going to be a problem running the fbq('init'...) function more than once? I'm assuming that if I don't include the init function straight away, it won't work with my standard event tracking (to track a page view etc), so I don't really want to delay it until they click on the button as I'll lose that other metric.
Alternatively, I could do this after they've provided their information on the next page that they see.
My questions ends up as; is there a problem calling fbq('init'...) more than once on a single page and will it work to send through that extra details about the customer if I do so?

Yes, you can call init several times.
Events will be sent to every pixels passed to init.
Source: https://developers.facebook.com/ads/blog/post/v2/2017/11/28/event-tracking-with-multiple-pixels-tracksingle/

Related

I am trying to do Element Control, Redirection and Form Submission Processing with WIX Code but I am unable to find a suitable method

I'm kind of a beginner to WIX Code. I have this site which I have made i.e www.rat-store.com. I am facing three problems which I know might get solved with some code but I don't know how to do it. Here are the problems:
In manual payment, I need to accept some form input from the user on a page and only if the user agrees to the terms and enters the correct date should the submit button get activated following which an otherwise collapsed image should also reveal (it's the QR code to make payment; Image 1) (www.rat-store.com/manual-pay-rat)
Image 1
I'm trying to link a repeater background to a page but it's not working. I have to create a button inside the repeater to do this. Any workarounds? I know an image will work but the thing is that the motive is to create a kind of a list which will keep on incrementing in the future and I can't just keep on drag-dropping images, text and then group them up and link. (Image 2) (www.rat-store.com/shop-by-events)
Image 2
Since WIX Stores doesn't have an inbuilt cancellation feature I built a form to substitute for the same but I want that no two same order cancellations are submitted i.e. a customer can only submit his/her cancellation request for a particular order number once. The next time s/he tries to do that it should show that the request already exists. (Image 3 and Image 4) (www.rat-store.com/cancel-orders)
Image 3
Image 4
Some help with the code and approach would really be great. I'm almost finished with my site; Only these last few things bother me. I'm attaching a screenshot of each page, serially w.r.t the question number. P.S: The order number is the number generated for each order by the Wix store app itself. I have nothing to do with that. The customer needs to enter his/her number and if that is valid we will process the request. Apologies for the length of the post.

How can I retain like count from a button after a refresh? [duplicate]

I looked on SO, here, a few other places & ... cluelessness set's in.
What is the structure of the Facebook " Like " Button found all over websites ?
Is it a Social Bookmarking, Browser Button kind ?
Is there a step by step process (without using FB Api) to make my own kind of button.
How to design & implement a Like Button ?
I want my own button with similar functionality as FB but NOT related or developed on their platform! I am trying to input this in iWeb'09 as a html widget.
I've done this successfully. Here's how i did it:
You have a table in a database called "likes" with fields username,postid (and date, id if you want too)
Each post/blog/article should have its own id.
When someone likes a post/blog/article, you take the id of the post/blog/article and the username who liked it and check the likes database to see if it already exists. If it already exists, you remove the like. If it does not exist you add a like.
For example with AJAX, this is how i did it specifically:
I have a blog post with id 6.
Jonathan likes this post.
These 2 variables are sent via a post form and wait for a response, likes logic checks database to see if this record already exists in likes table (username,postid) values ('Jonathan', 6) if the response is 1 (or true), then i update the div number for the likes button from whatever value was there originally and add 1. If the response is 0 (or false) then i take the original value in the likes counter and remove 1.
To answer your question consider what happens with buttons and then go into like buttons.
Pressing a button triggers an event on client which may or may not update a server somewhere to notify that a button has been pressed for such and such intention. You can send a lot of extra info with this event like when and where who and why etc
Like buttons usually have extra info on who liked it and what they like. In order to get that you might ask people to sign in or provide some kind of input to identify them.
Take a real world example of a like button you can implement in say javascript using any server side technology
Whoever install your script will be able to see the button. You may form it with any css or your javascript can simply load an iFrame from your server or append elements to DOM to show this button
When clicked it calls your server with person's info or at least the page url where it was called. For example google analytics uses a unique ID associated with domain url to track visitors.
when you recieve this call you can update your database/storage or anything with the tick mark that button on abc site has been pressed so lets update their likes or dislikes.
If you want your javascript can also increment the number on the same page either before or after updating your server.
When someone else visit that site the script again loads and send a request to your server so you can update the count on page but this time user does not click on like/dislike button so you dont update the record.
You may then show it as a pie chart to user on total visits to their site or page with division in people who liked it and people who did not report back (did not press the button)
If you are still wondering how you can create a button . Use CSS button generator to get one
You must first have a database where you can store various values.
Now, Whenever the user clicks the button, the value of the button stored in the database must be incremented. For this, you will need a backend language which connects you to SQL database.
So whenever the button has clicked the value of the likes in the database changes.

Issues with "Recurly.js" form generation and GWT / AJAX

I am building a user interface for Recurly account management in a GWT application.
This means there is no actual browser navigation happening between "pages" in the app, and client DOM state is maintained in memory until the user actually refreshes their browser.
In other words, when the user leaves the billing information "page" - the input elements still exist in memory and are simply detached from the visible area of the user interface.
Unfortunately, the fields that are being provided by "Recurly.js" are somewhat problematic here as they seem to be designed for use in a conventional framework where the user submits the form and then is redirected to a new page.
While they work perfectly for an initial submission of updated billing information (i.e. the first time the "form" is instantiated), if someone re-visits the screen multiple times without refreshing their browser, the fields do not accept input.
I have tried the following:
clearing the inner HTML of the wrapping recurly div elements (into
which the provided fields are drawn by Recurly.JS) and calling
configure() again
Not calling configure() after the first time it is called (in this case, subsequent visits to the page result in unresponsive inputs)
Is there a way I can tell Recurly.js to reset itself so that the provided fields can be redrawn? Or (and preferably) is there a way to configure recurly to use my own "input" fields for number, date, month, and cvv instead of those that are rendered into divs by Recurly.js?
Thank you
Edit:
I have discovered that Recurly.js is setting the visibility of their provided billing inputs to "visibility:hidden" after the form is accessed after being instantiated. If I can't force recurly to redraw the inputs, then I need to prevent this from happening some how...
I discovered a "readyState" variable in Recurly.js.
If I set that back to "0" before calling "reconfigure", the fields correctly reconfigure themselves.
This seems to fix my issue.

How to find out if Google Plus One button is pressed

I have a web site that displays a table of contents, and I'd like to use the Google Plus One button as a kind of persistent "favourite" marker. So a user would Plus One a page, and then in my table of contents I would show that page as being "Plus Oned" somehow (either bold the entry, show a plus image or something similar).
So is there any way to call the Plus One api to find out if a URL has been "Plus Oned" by the current user?
Note that I don't want to get the plus one count (as shown at http://www.tomanthony.co.uk/blog/google_plus_one_button_seo_count_api/) and I don't want to have to manually intercept plus one clicks and store the details myself.
http://www.tomanthony.co.uk/blog/google_plus_one_button_seo_count_api/ may do what I want. The isSetByViewer parameter that is returned is possibly what I want, but simply calling the web service as described in the web page always returns a isSetByViewer value of false. I would assume that some other undocumented data or cookie/header information would have to be sent to the web service identify the current user.
There is a pos.plusones.getSignupState in the hidden API, which you can try to experiment with instead of pos.plusones.get. Other than that, I think you should specify the G+ user id in the userID parameter.
Furthermore, you can try to sniff the network traffic for the +1 button with wireshark, webkit inspector and chrome://net-internals (watch SPDY traffic to client6.google.com). OR you could try to debug the js code with step to find what variable makes the +1 button highlight.

Many share buttons for social networks on one page

I am currently doing some work on a research database where they have decided that they want to be able to share links to articles from the site on social networks (Facebook, Twitter, LinkedIn and Google+).
Preferably this should be done through the share buttons provided by the respective networks. I quickly got the buttons working and displayed correctly on the site by following the implementation instructions from each network.
My problem is a consequence of that the site offers the possiblity to show 1000 (1K) post on a single search result page. This means that when such a page is created it needs to create 1000 share buttons for each social network (effectively 4000).
Sadly this seems to overwhelm the browser as it offers to stop the javascript provided by the social networks and whether you choose to stop it or not - the page ends up in deadlock waiting for a response from the social networks and never finishes the page loading process.
I have an idea that the problem may be that the large number of asynchronous requests means that the browser somehow misses some of the responses and thus ends up waiting forever for a response that will never come.
As mentioned it is only a problem with such a large number of posts, if a page for example displays 100 posts (effectively 400 share buttons) it works perfectly.
While it could be argued that 1000 post on a single page is overkill, limiting the maximum number of displayed post is sadly not an option.
My question therefore is whether any of you know of a way to solve this kind of problem or if my only real option is to create custom share buttons that doesn't need to be created through the javascript provided by the social networks ?
The following references leads to the documentation for each of the share buttons.
Twitter
Facebook
LinkedIn
Google+
For all these buttons, there is a main js file which does the heavy work.
So, for LinkedIn, add the script tag:
<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>
once in the page. And use the below script as a placeholder for your linkedin button whereever you need it. (don't forget to replace the data-url attribute in below script)
<script type="IN/Share" data-url="http://developer.linkedin.com/plugins/share-plugin-generator" data-counter="top"></script>
For Twitter similarly, the below script tag needs to be added once in the page as it's job is to get the main js file and add it to the page.
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
The below script needs to be added multiple times whereever you want. Replace the data-url attribute with your url which needs to be tweeted when you click on it.
Tweet
When you get the code for FB or Google Plus like, you will get a script which needs to be added once and then the code to be added where ever you need.
EDIT:
Based on your comment below: The scripts will surely cause issue because they need to convert each and every placeholder into a good looking 'like' button. Below are few ways to improve the performance:
run these scripts only on page load (i.e., add the main scripts at load time)
using setTimeout or setInterval, work on every 100 placeholders at a time (requires change in main scripts)
Lazy load the init of like buttons. When the user scrolls the page and the like buttons will show up in the page, then initialize the buttons (requires change in main scripts)
Recommended Approach: Keep just one set of like buttons. When user hovers over a search result, then add this set of buttons to that div and change the attributes related to url in the buttons. With this way, only one set of buttons will be shown and won't take time at all to init them.

Categories