How to install google voice on your blog to be more cool

How to install google voice on your blog to be more cool - google voice: is one of the features of google that makes it easy for visitors to search, read the web with sound, this time I admin will share the tutorial, ok just see:

Live Demo

  1. Please login to blogger, and enter the dashboard.
  2. Enter the menu Theme, then click EDIT HTML.
  3. Search Code ]]></b:skin>, Put the CSS code below just above ]]></b:skin> code.

  4. /* google voice */
    .btnvoice button.voice-button,.btnvoice button.voice-stop{padding:0 5px;font-size:13px;background:none;outline:0;cursor:pointer}
    .btnvoice button.voice-button{color:#555;border:none;border-radius:0}
    .btnvoice button.voice-stop{color:#ff5f02;border:none;border-radius:0}

  5. Now add the following JS script just avobe </body> code

  6. <script>
    /* option font voice js*/
    function loadCSS(e,t,o){"use strict";var i=window.document.createElement("link"),s=t||window.document.getElementsByTagName("script")[0];i.rel="stylesheet",i.href=e,"only x",s.parentNode.insertBefore(i,s),setTimeout(function(){||"all"})}loadCSS(""),loadCSS("|Roboto:300,300i,400,400i,500,500i,700"),"undefined"==typeof jQuery&&document.write('<script src=""><\/script>'),"undefined"==typeof jQuery&&document.write('<script src=""><\/script>');

  7. Install the Html code, here you adjust, but good advice is placed above or below the post title (You can see here the tutorial)

  8. <span class='btnvoice'>
    <button class='voice-button' onclick='responsiveVoice.speak(document.querySelector(&#39;.post-body&#39;).textContent, &#39;Indonesian Female&#39;);' title='Play'><i aria-hidden='true' class='fa fa-play-circle'></i> Voice</button>
    <button class='voice-stop' onclick='responsiveVoice.cancel();' title='Stop'><i aria-hidden='true' class='fa fa-stop-circle'></i></button>

Live Demo

Post a Comment

Previous Post Next Post