I would like to add the Skype button (https://dev.skype.com/skype-uri/generator) to my Google site.
The code pasted in the Google Site HTML box does not work (not so much javascript works correctly in this gadget), so I have tried with a custom Google Apps Script. I have made a very basic one, but the Skype button is not displayed (only the 'blabla').
<html>
<head>
<script type="text/javascript" src="http://cdn.dev.skype.com/uri/skype-uri.js></script>
</head>
<body>
<div id="SkypeButton_Dropdown_clandriot_1">
<script type="text/javascript"> Skype.ui({ "name": "dropdown", "element": "SkypeButton_Dropdown_clandriot_1", "participants": ["clandriot"], "imageSize": 24 }); </script>
</div>
blabla
</body>
</html>
(I have obviously added the doget())
Any idea why it does not work?
Thank you for your help
What have you added in the doGet() is more important. Can you please post that. You should be doing something like
function doGet(){
var string = 'your html code';
return HtmlService.createHtmlOutput(string);
}
Remember that despite doing the above, all of your code may not work since HTML code is sanitized by Caja so you should test your code in the Caja playground before deploying it.
Related
I'm trying to create a local dashboard with embedded google trends charts on various topics. When I create a standard HTML file and paste the code snippet from Google Trends, the chart goes full-width but cuts off at around 300px or so: Original Code Output
I looked around and tried an iframe solution (as people have suggested in other posts here) but I'm having trouble implementing it. I'm pretty new to using iframes and advanced elements/tags.
Here's a link to the code I customized based on other examples I've seen on here: https://drive.google.com/file/d/1w6Dnyk0h4ktJ7KaRz-yrpqVhlHmhWVp-/view?usp=sharing
Here's what the rendered code looks like when I open the file locally in my browser:
Unexpected Results from Code
This might be a stupid question, but even so, I'd love to get some help! Thank you!
Please find the code snippet below, I tried to solve the problem that you are having in paragraph one, Hope this solution works for you
<!DOCTYPE html>
<html>
<head>
<style>
.myDiv {
border: 1px outset lightblue;
background-color: lightgray;
text-align: left;
}
</style>
</head>
<body>
<h1>Data Tracking</h1>
<h2>COVID-19 Data</h2>
<script type="text/javascript" src="https://ssl.gstatic.com/trends_nrtr/2431_RC04/embed_loader.js"></script>
<script type="text/javascript"> trends.embed.renderExploreWidget("TIMESERIES", {"comparisonItem":[{"keyword":"/m/03376x","geo":"GB","time":"today 5-y"}],"category":0,"property":""}, {"exploreQuery":"date=today%205-y&geo=GB&q=%2Fm%2F03376x","guestPath":"https://trends.google.com:443/trends/embed/"});
</script>
<script type="text/javascript">
document.getElementsByTagName("iframe")[0].addEventListener( "load", function(e) {
this.setAttribute('height','450px')
} );
</script>
</body>
</html>
I have a single HTML page with React (build manually without ANY tools, just a text editor).
This page is working correctly. Now, I would like to add a PIE Chart with NIVO lib.
When I add the script (CDN) I got the following error in console:
exports is not defined
I can solve this by creating a fake exports var = {} (is that a good solution ?)
But then I have a new error:
require is not defined
Do that means the CDN link from NIVO is incorrect ? How to solve this ?
Alternative: I am open to use another lib working with React. But I want to only use CDN links and a text editor to achieve that.
Full HTML file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>Batch stats</title>
<script>let exports = {};</script>
<script src="https://unpkg.com/#babel/standalone/babel.min.js"></script>
<script crossorigin src="https://unpkg.com/react#16.7.0/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom#16.7.0/umd/react-dom.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/#nivo/pie#0.61.1/dist/nivo-pie.cjs.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
function Page(props) {
return (
<div>
<h1>Hello World</h1>
<div>How to add a PIEChart ?</div>
</div>
);
}
ReactDOM.render(<Page version="v3"/>, document.getElementById('root'));
</script>
</body>
</html>
Thanks
Nivo do not support it.
you should use the UMD build, however, you'll need a bunch of extra
dependencies, including D3 packages which are using modern JS
features.
https://github.com/plouc/nivo/issues/959
Subject solved! The answer is below.
Good morning, everyone!
So that's it, I'm telling you my problem. I currently have to create a small script allowing me to retrieve the tags from an HTML file and drop them to another HTML file. I had a possible idea to do this in VBS but without much success for the moment.....
I also thought about doing this with a split but also without much success...
If you have examples of scripts, I'm a taker!
Thank you.
I solved my problem!
I relied on the code that was provided to me and that was removed and I followed the jQuery doc;)
Doc link: http://api.jquery.com/load/
My code:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<script>
$(function() {
$("#PremierTest").load("file.html #test1");
$("#DeuxiemeTest").load("file.html #test2");
$("#TroisiemeTest").load("file.html #peutetre");
});
</script>
<div id="PremierTest">
</div>
<div id="DeuxiemeTest">
</div>
<div id="TroisiemeTest">
</div>
</body>
</html>
Thank you to all of you :)
I started using Google Translate for my shopify website im-diamond.com by placing the snippet in the header. Now when I check Chrome Lighthouse report it says it is slowing the site and suggests the use of link rel='preload' . How can I use that to implement the Google Translate's snippet?
<div id="google_translate_element"></div>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'tr', includedLanguages: 'ar,de,en,ru', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, gaTrack: true, gaId: 'UA-111111-1'}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>
The rel=”preload” allows you to prioritize resources that will be needed soon after the page is loaded. As the name describes, the resources will be preloaded and ready to use once they are called. You can find more information about rel=”preload” on this documentation page.
To use it, place the following line in your HTML header:
<link rel="preload" href="scriptName.js" as="script">
Where “scriptName.js” is the name of the file containing the Google Translate script you are using. Further in your HTML code where you need to use the preloaded script, use the following line:
<script src="scriptName.js"></script>
i need to display the section as PopUp while onload(). but i don't know how to call this javascript function(function($)). name has confused me. also if any other way to call this div section as popup .please sugesst. Thanks
<html>
<head>
<script>
// function name is function($)
function($){
}
</script>
</head>
<body>
<div>
<!-- body of the popUp -->
</div>
</body>
</html>
The $ function is probably the one defined in jQuery, so you will need to include the jQuery JavaScript library if you want to use it for showing a pop up.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
Including just this library will define the $ function and you can then use jQuery functions in your JavaScript code. However this will not create a pop-up. There are many jQuery plugins that can be used to create a pop-up.
jQuery dialog?
http://jqueryui.com/demos/dialog/
Loads of examples on there