1

I have trouble including JavaScript code in the HTML header generated by tex4ht.

The script I want to include is:

<script type="text/javascript">
  var _gaq = _gaq || [];
  var pluginUrl = 
   '//www.google-analytics.com/plugins/ga/inpage_linkid.js';
  _gaq.push(['_require', 'inpage_linkid', pluginUrl]);
  _gaq.push(['_setAccount', 'UA-45193039-1']);
  _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>

Can anybody tell me how to do this. The documentation on the

\JavaScript .....\EndJavaScript 

command in the Tex4ht online manual (mn) is not very helpful and gives loads of incomprehensible error messages.

Herman Adèr

  • Welcome to TeX.SX! Can you tell us, what you have tried out inclusive the error messages you've got? – Schweinebacke Aug 2 '17 at 13:50
  • I used Miktex to translate my LaTeX code including the TeX4ht package. In the .cfg file I first tried to use \ScriptEnv to make a JavaScript environment. But it fails to generate the script above as a verbatim insertion. Surrounding with \JavaScript...\EndJavaScript – Herman Adèr Aug 2 '17 at 14:32
  • does not work either. – Herman Adèr Aug 2 '17 at 14:33
2

The manual isn't very helpful in this case, it is even misleading, because \JavaScript command isn't defined by default, only when javascript option is used it is defined. But it is quite easy to define your own version:

\Preamble{xhtml}
\begin{document}
  \ScriptCommand{\JavaScript}{\HCode{\Hnewline<script type="text/javascript">\Hnewline}}{\HCode{\Hnewline</script>\Hnewline}}
\JavaScript
var _gaq = _gaq || [];
var pluginUrl = 
  '//www.google-analytics.com/plugins/ga/inpage_linkid.js';
_gaq.push(['_require', 'inpage_linkid', pluginUrl]);
_gaq.push(['_setAccount', 'UA-45193039-1']);
_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);
 })();
\EndJavaScript
\EndPreamble

In this configuration file, \JavaScript command is defined first:

\ScriptCommand{\JavaScript}{\HCode{\Hnewline<script type="text/javascript">\Hnewline}}{\HCode{\Hnewline</script>\Hnewline}}

The \Hnewline commands are used to insert line breaks. The JavaScript code is then inserted without <script ...> tags, because \JavaScript command will take care of this.

One important thing is to place the JavaScript after \begin{document} in the configuration file, this ensures that it is inserted in the HTML header:

<?xml version="1.0" encoding="utf-8" ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<!--http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd-->  
<html xmlns="http://www.w3.org/1999/xhtml"  
> 
<head>  
<script type="text/javascript"> 
var _gaq = _gaq || [];
var pluginUrl =
  '//www.google-analytics.com/plugins/ga/inpage_linkid.js';
_gaq.push(['_require', 'inpage_linkid', pluginUrl]);
_gaq.push(['_setAccount', 'UA-45193039-1']);
_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> 
<title>mytitle</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<meta name="generator" content="TeX4ht (http://www.tug.org/tex4ht/)" /> 
<meta name="originator" content="TeX4ht (http://www.tug.org/tex4ht/)" /> 
<!-- charset=utf-8,html,xhtml --> 
<meta name="src" content="sample.tex" /> 
<link rel="stylesheet" type="text/css" href="sample.css" /> 
</head><body 
>
  • Thank you very much. I found the same solution. I will also try the javascript option you suggest. – Herman Adèr Aug 4 '17 at 8:37
  • In the original question I made another mistake somewhere else in the config file which accounted for the error messages. Thanks again. Problem solved. – Herman Adèr Aug 4 '17 at 8:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.