We Keep Coding

React and Google Code for lead Conversion Page

I have a simple react application with a contact form.
After submit I need to have this Google Code for lead Conversion Page showing on the page.
<!-- Google Code for Purchase Conversion Page -->
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = 1234567890;
var google_conversion_language = "en_US";
var google_conversion_format = "1";
var google_conversion_color = "666666";
var google_conversion_label = "xxx-XXx1xXXX123X1xX";
var google_remarketing_only = "false"
var google_conversion_value = 10.0;
var google_conversion_currency = "USD"
/* ]]> */
</script>
<script type="text/javascript"
src="//www.googleadservices.com/pagead/
conversion.js">
</script>
<noscript>
<img height=1 width=1 border=0
src="//www.googleadservices.com/pagead/
conversion/1234567890/
?value=10.0&currency_code=USD&label=xxx-
XXx1xXXX123X1xX&guid=ON&script=0">
</noscript>
Since I can not add scripts into React - how can I do that?
I have been going around in circles trying to use HTML-loaders but nothing seemed to work (HTML-loader would have the script showing on the page).
Would really appreciate any help.
Thank you!

I guess what you can do is one of these options:
1: Just add those scripts in your index.html file.
If you are using webpack you need to have an index.html file, some docs.
2: With a webpack plugin, add those scripts in a template. Then the plugin will do the job, more info here.
// webpack.config.js
plugins: [
new HtmlWebpackPlugin({
template: 'index.template.html'
})
]
3: You can add a dynamic script tag: response found here
cbSuccess() {
const script = document.createElement("script")
script.src = "./your-script.js"
script.async = true
document.body.appendChild(script)
}

Piwik - How to track click events?

I configured Piwik analytics in my app.
I inserted this tracking code inside the body tag:
<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(["setDomains", ["*.mywebsite.com"]]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
_paq.push(['trackAllContentImpressions']);
(function() {
var u="//mywebsite.piwikpro.com/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 3]);
var d=document, g=d.createElement('script'),
s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true;
g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//eatngage.piwikpro.com/piwik.php?idsite=3"
style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->
And I added the event trigger to the div:
<div class="my-class" onclick="_paq.push(['trackEvent', 'Documentary',
'Play']);">Click
</div>
In Piwik Dashboard, I see the clicking under "Visitors in Real-Time", but not under "Actions-Events" category.
How can I tracking events click please?
Thanks!

You have to run archive process to see events under Actions-Events. Make also sure your setting that allows to trigger archiving from the browser is enabled.
As a reference, you can use this article about configuring archive proccess: http://piwik.org/docs/setup-auto-archiving/

Piwik tracking other users

Hi I am trying to make my Piwik code track other users for my intranet site. So far I am able to track my own views, but if I were to have someone else access the site it would not track it below is my code that Piwik generated for me. I have also tried replacing the localhost with my URL but it still did not work.
Any feed back would be appreciated. Thank You.
<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(["setCookieDomain", "*.harold.local"]);
_paq.push(["setDomains", ["*.harold.local"]]);
_paq.push(["deleteCookies"]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//localhost:8080/piwik/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 3]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//localhost:8080/piwik/piwik.php?idsite=3&rec=3" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

Piwik track which user access which page

I want to use Piwik to trace which user stays on which page in my rails app but I cannot figure out how to trace it. I added a custom variable (page scope) but in Piwik I only see the user_id and its count of visits but not which pages. Also, I got url based view but not for which user. Anybody knows how to deal with this? Also I can not use custom Dimension because my Piwik version is older and I can not upgrade it now. I tried setUserId option as well but no luck.
My code :
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(['setCustomVariable', 1, "user_id", "<%= current_user.id %>", "page" ]);
_paq.push(['setUserId', '<%= current_user.id %>']);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
_paq.push(['enableHeartBeatTimer']);
(function() {
var u="//myserver/piwik/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 1]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//myserver/piwik/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->

how to use piwik javascript code in app.js on express

I want to use javascript code of piwik to track my website which is built on express.
I had put my javascript code in app.js in express.
But found error.
my javascript code is:-
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(["trackPageView"]);
_paq.push(["enableLinkTracking"]);
(function() {
var u=(("https:" == document.location.protocol) ? "https" : "http") + "://localhost/piwik/";
_paq.push(["setTrackerUrl", u+"piwik.php"]);
_paq.push(["setSiteId", "1"]);
var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0]; g.type="text/javascript";
g.defer=true; g.async=true; g.src=u+"piwik.js"; s.parentNode.insertBefore(g,s);
})();
</script>

You can't run the client-side code for Piwik directly on Node.js.
But there are specific Node clients that you can use instead:
nodejs-piwik
nodejs-piwik-api