I was recently asked to change a script that is on this shopify website but I am unable to find it in either the backend settings or the actual code for the template. Could someone please point me in the right direction on how to change the code for this script? The pixel values are wrong here and it's causing SEO issues:
<script>
//<![CDATA[
(function() {
function asyncLoad() {
var urls = ["\/\/productreviews.shopifycdn.com\/assets\/v4\/spr.js?shop=myshop.myshopify.com","\/\/www.beetailer.com\/javascripts\/beecart.js?shop=myshop.myshopify.com","https:\/\/media.conversio.com\/scripts\/shopify.js?shop=myshop.myshopify.com","https:\/\/s3.amazonaws.com\/lastsecondcoupon\/js\/freeshippingbar.js?shop=myshop.myshopify.com","\/\/facebook.shopifycdn.com\/tracking_pixels\/123.js?shop=myshop.myshopify.com","\/\/facebook.shopifycdn.com\/conversion_pixels\/123.js?shop=myshop.myshopify.com","\/\/notifyapp.io\/js\/1463319629\/loader.js?shop=myshop.myshopify.com","https:\/\/embed.tawk.to\/widget-script\/58065fec304e8e75855e4cce\/default.js?shop=myshop.myshopify.com","https:\/\/www.affiliatly.com\/shopify\/shopify.js?affiliatly_code=AF-10200\u0026shop=myshop.myshopify.com"];
for (var i = 0; i < urls.length; i++) {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = urls[i];
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
}
}
window.attachEvent ? window.attachEvent('onload', asyncLoad) : window.addEventListener('load', asyncLoad, false);
})();
//]]>
</script>
This code is included by Shopify as a part of the {{ content_for_header }} Liquid variable in the layout files (e.g. theme.liquid.)
The JavaScript files would be ScriptTag scripts that have been added to the store by Shopify apps that you have installed. For example https://productreviews.shopifycdn.com/assets/v4/spr.js belongs to the Product Reviews app.
These scripts are hosted by the app developers so you won't be able to edit them directly. You can remove a ScriptTag script by uninstalling the Shopify app that placed it there.
It looks like the function above is loading the java script (.js files) dynamically in the code and adding the script to the domain:
var urls = ["\/\/productreviews.shopifycdn.com\/asse....
You would need to download the .js files (url are listed in the code), modify them, and change the path so that the above function can load them from a local path.
Following array is URL to all the JS scripts... Each of the item in this array is loaded after page loads.
var urls = ["\/\/productreviews.shopifycdn.com\/assets\/v4\/spr.js?shop=myshop.myshopify.com","\/\/www.beetailer.com\/javascripts\/beecart.js?shop=myshop.myshopify.com","https:\/\/media.conversio.com\/scripts\/shopify.js?shop=myshop.myshopify.com","https:\/\/s3.amazonaws.com\/lastsecondcoupon\/js\/freeshippingbar.js?shop=myshop.myshopify.com","\/\/facebook.shopifycdn.com\/tracking_pixels\/123.js?shop=myshop.myshopify.com","\/\/facebook.shopifycdn.com\/conversion_pixels\/123.js?shop=myshop.myshopify.com","\/\/notifyapp.io\/js\/1463319629\/loader.js?shop=myshop.myshopify.com","https:\/\/embed.tawk.to\/widget-script\/58065fec304e8e75855e4cce\/default.js?shop=myshop.myshopify.com","https:\/\/www.affiliatly.com\/shopify\/shopify.js?affiliatly_code=AF-10200\u0026shop=myshop.myshopify.com"];
Related
I am checking to see if I can use gstatic to scrape favicon from websites. Below will fetch the websites Favicon:
https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=https://yahoo.com&size=64
I understand that the URL parameters might not be for general use, but just checking if anyone knows where this might be documented?
UPDATE: I have just started building an app on Google App Script. I need to list website names along with their favicons and metadata like site description, etc. Currently the only approach is to read the webpage and use beautifulSoup to parse the page and then locate the favicon. I came across the above link that will directly give me the favicon! But I want to understand it better and trying to locate more information on the URL parameters for gstatic.
I am also open to alternative ways to scrape a web site from Google App Script...
Thanks
I believe your goal is as follows.
You want to retrieve the favicon from the websites.
You want to use the following sample URL.
https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=https://yahoo.com&size=64
From I need to list website names along with their favicons and metadata like site description, etc., you want to retrieve the favicon, title, and description of the site using Google Apps Script.
Sample script 1:
When your URL of https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=https://yahoo.com&size=64 is used, how about the following sample script? Please copy and paste the following script to the script editor of Google Apps Script. And, run samoke1 at the script editor.
function sample1() {
const uri = 'https://t2.gstatic.com/faviconV2?client=SOCIAL&type=FAVICON&fallback_opts=TYPE,SIZE,URL&url=https://yahoo.com&size=64';
const blob = UrlFetchApp.fetch(encodeURI(uri)).getBlob();
DriveApp.createFile(blob);
}
When this script is run, the favicon is retrieved and that is saved as a file to the root folder of Google Drive.
When I saw the URL, it seems that the favicon is retrieved as the image data.
Sample script 2:
When the favicon, title, and description of the site are retrieved, how about the following sample script?
function sample2() {
const uri = 'https://yahoo.com'; // Please set the URL.
const obj = { title: "", description: "", faviconUrl: "" };
const res = UrlFetchApp.fetch(encodeURI(uri));
const html = res.getContentText();
const title = html.match(/<title>(.+?)<\/title>/i);
if (title || title.length > 1) {
obj.title = title[1];
}
const description = html.match(/<meta.+name\="description".+>/i);
if (description) {
const d = description[0].match(/content\="(.+)"/i);
if (d && d.length > 1) {
obj.description = d[1];
}
}
const faviconUrl = html.match(/rel="icon".+?href\="(.+?)"/i);
if (faviconUrl && faviconUrl.length > 1) {
obj.faviconUrl = faviconUrl[1];
}
console.log(obj);
}
When this script is run, you can see the following value in the log.
{
"title":"Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos",
"description":"Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!",
"faviconUrl":"https://s.yimg.com/cv/apiv2/default/icons/favicon_y19_32x32_custom.svg"
}
Reference:
fetch(url)
I want to add a snippet i get from booking.com in my nuxt page, the script looks like that :
<ins class="bookingaff" data-aid="" data-target_aid="" data-prod="map" data-width="100%" data-height="590" data-lang="ualng" data-dest_id="0" data-dest_type="landmark" data-latitude="{{ data.lat }}" data-longitude="{{ data.lng}}" data-mwhsb="0">
<!-- Anything inside will go away once widget is loaded. -->
Booking.com
</ins>
<script type="text/javascript">
(function(d, sc, u) {
var s = d.createElement(sc), p = d.getElementsByTagName(sc)[0];
s.type = 'text/javascript';
s.async = true;
s.src = u + '?v=' + (+new Date());
p.parentNode.insertBefore(s,p);
})(document, 'script', '//aff.bstatic.com/static/affiliate_base/js/flexiproduct.js');
</script>
So there is this tag where i have to pass the latitude and the longitude of my point to get the hotels near from. Does anyone knows how to insert this kind of external snippet in nuxt ?
Third party code can be included using a custom Nuxt plugin. The plugins are included in your app before instantiating the root Vue app. See the documentation here: https://nuxtjs.org/guide/plugins/
I'm using the client side javascript SDK to connect to soundcloud.
now i want to block all latest tracks in a widget.
if i'm using SC.Widget('frameid') i'll get an error: Widget is not a function
so i have to implement the second script (widget api)
Whether I load the script directly from soundcloud or download it
I get the error: e is null
I tried to load the sdk before the widget api
and I also tried to load the api in document.ready but I still get the same error.
For selecting the iframe I tried to get it via ID and document.getElementbyId(..)
but that still did not work
Can someone tell me the solution?
what i'm doing wrong?
Looks like you dont reference the scripts in a proper way.
I hope this sketch points you in the right direction:
JS
(function() {
var iframe2 = document.querySelector('#widget2');
var widget2 = SC.Widget(iframe2);
var newurl = 'http://soundcloud.com/bnzlovesyou';
widget2.bind(SC.Widget.Events.READY, function() {
alert('ready');
widget2.bind(SC.Widget.Events.PLAY, function(eventData) {
alert('Playing..');
});
widget2.bind(SC.Widget.Events.PAUSE, function(eventData) {
alert('PAUSE..');
});
});
$( "#changetrack" ).click(function() {
widget2.load(newurl);
});
}());
HTML
<iframe id="widget2" width="100%" src = 'http://w.soundcloud.com/player/?url=http://soundcloud.com/barehouse_1'>
</iframe>
<div id="changetrack">Change Track / URL to my account ;)</div>
http://jsfiddle.net/iambnz/wpe2zmLh/
What is the best way to show the resulting css from files compiled with less.js in the client.
In other words, how can i fill a div with the resulting css?
I need to display the result on the page, any way to do this?
THanks!
update
As already pointed out in the comments by #ertrzyiks you should replace less.parse with less.render for Less v 2.x:
var lessCode = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
var options = {}
lessCode = xmlhttp.responseText;
less.render(lessCode, options, function (error, output) {
if(!error) {
document.getElementById('lesscode').innerHTML = output.css;
}
else document.getElementById('lesscode').innerHTML = '<span style="color:red">' + error + '</span>';
});
}
};
xmlhttp.open("GET","important.less",true);
xmlhttp.send();
see also: How to detect and print changing variables LESS
But since Less v2:
In the browser, less.pageLoadFinished will be a promise, resolved when
less has finished its initial processing. less.refresh and
less.modifyVars also return promises.
When you compile filename.less the compiled CSS code has been inject in a style tag with id less:filename, so to get the compilled CSS code you can also use:
less.pageLoadFinished.then(
function() {
console.log(document.getElementById('less:filename').innerHTML);
}
);
Notice that the last example also applies the compiled CSS code on the page.
--end update
I expected that running something such as the following was possible:
<link rel="stylesheet/less" type="text/css" href="important.less">
<script src="less-1.7.3.js" type="text/javascript"></script>
<script>
css = less.tree.toCSS();
console.log(css);
</script>
unfortunately this does not work, but you can use the following code to get what you want:
<script src="less-1.7.3.js" type="text/javascript"></script>
<script>
var lessCode = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
lessCode = xmlhttp.responseText;
new(less.Parser)().parse(lessCode, function (e, tree) {
document.getElementById('lesscode').innerHTML = tree.toCSS().replace(/\n/g,"<br>");
});
}
};
xmlhttp.open("GET","important.less",true);
xmlhttp.send();
</script>
With in the body section of your HTML:
<div id="lesscode"></div>
See also: Combining two .less files in one and How to open a local disk file with Javascript?
I just use Chrome's Inspect Element.
Right click on the element CSS you are looking for, Right click and choose Inspect element. On the right you will find the compiled CSS in Styles. Hope it helps
You have two options to do this, Internet Explorer or Firefox.
Let's start with Firefox. If you install the web developer toolbar, you get a menu option that's labelled CSS. Clicking on this gives you a few options and if you choose View CSS, you are taken to a new tab that shows you all of the styles for the page, grouped by their location and you should see a section with the CSS that has been generated by LESS and dynamically applied to the elements.
IE also has a Web Developer option and if you use the toolbar to inspect an element, you can then use the short cut 'Ctrl + T' which will bring up the page source with the computed styles.
The Firefox solution is better, as you can see exactly which styles have been provided by LESS whereas IE just lumps it all together.
There is a third option, and that is to compile the CSS server side!
Google's own site seems to provide conflicting documentation.
I've found at least 4 variations for adding A custom cookie to GA.
http://www.google.com/support/forum/p/Google%20Analytics/thread?tid=6a452bd09455721a&hl=en
http://code.google.com/apis/analytics/docs/gaJS/gaJSApiBasicConfiguration.html
http://www.google.com/support/forum/p/Google%20Analytics/thread?tid=4362f4d46e6e723a&hl=en
http://analytics.blogspot.com/2009/07/segment-your-traffic-with-user-defined.html
Here is the code I currently have embedded in my company's sharepoint site. I'm beginning to think that this will not work, and that I will have to create an "employee.html" page on my public webserver that I will have to request all employees load once to generate the cookie on their PC's. My secondary question, is after I setup a employee.html page as the example http://analytics.blogspot.com/2009/07/segment-your-traffic-with-user-defined.html here describes, how do I keep all the external traffic from accessing that same page?
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-20842347-1']);
_gaq.push(['_setCustomVar',1,'visitor-type','employee']);
_gaq.push(['_setDomainName', '.sc-pa.com']);
_gaq.push(['_trackPageview']);
(function () {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</HEAD>
None of those links talk about setting a custom cookie. Also, it seems to me that you aren't really needing to set a custom cookie. It looks like you are just wanting to be able to segment your traffic into different buckets.
You can do this many different ways, one of which you have in your code example: you can set a custom variable with different values, depending on the type of user.
So it would set the same cookie, etc.. and you pass different values in this line of code
_gaq.push(['_setCustomVar',1,'visitor-type','employee']);
Then in your reports you can setup filters based off of custom variable 1, or look at the custom variable reports directory, or use custom variable 1 as a metric in your reports.