vozMe

Add speech to your website

Wordpress plugin


vozMe.com - Wordpress
  1. Download vozme.zip (version 1,5, March 3, 2008) or vozme.tar.gz (version 1,5, March 3, 2008).
  2. Extract the compressed file. You'll get a folder named vozme.
  3. Upload the folder vozme to /wp-content/plugins/.
  4. Get into Wordpress administration tool > Plugins and click the "Activate" link within the vozMe plugin.
  5. Access "Options > vozMe" and select your favorite options.

Template for Blogger

Example: using a text link

Male voice | Female voice
  1. Access Templates > Edit HTML.
  2. Check "Expand Widget Templates" option.
  3. Find the line: <span class='post-icons'>
  4. Before this line, insert the code:
  5. Save changes.

Example: using an image and a text link

Male voice | Female voice
  1. Access Templates > Edit HTML.
  2. Check "Expand Widget Templates" option.
  3. Find the line: <div class='post-footer'>.
  4. Before this line, insert the code:
  5. Save changes.

Joomla

Option 1. Plugin

Excellent plugin for Joomla created by Lee Everson.

Option 2. Code modification in components/com_content/content.html.php

Thanks to José Llacer Gutiérrez (http://llacer.dyndns.org/) we provide a code modification in the function show within the file components/com_content/content.html.php.
Show code modifications

Let user select the text to hear

Male voice | Female voice

User is free to select a text in the web page. To get the mp3 file, user may press a button, a link, an image or any other element containing the function: 

<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

[...]

onclick="get_selection('en','ml');"

Example: using a text button

Male voice | Female voice
Copy and paste this code in your page:
<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

<button 
 onclick="get_selection('en','ml');">
Select a text and<br/>click here for speech</button>

Example: using an image and text button

Male voice | Female voice
Copy and paste this code in your page:
<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

<button style="background:#eeeeee  
 url(http://vozme.com/img/paper_sound32x32.gif) 
 no-repeat left center; 
 min-height: 35px; 
 font-size:70%; padding:4px 4px 4px 35px;" 
 onclick="get_selection('en','ml');">
Select a text and<br/>click here for speech</button>
Copy and paste this code in your page:
<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

<button style="background:white 
 url(http://vozme.com/img/paper_sound32x32.gif) 
 no-repeat left center; 
 min-height: 35px; 
 font-size:70%; padding:4px 4px 4px 35px;" 
 onclick="get_selection('en','ml');">
Select a text and<br/>click here for speech</button>
Copy and paste this code in your page:
<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

<button style="background:#ddeeff 
 url(http://vozme.com/img/paper_sound32x32.gif) 
 no-repeat left center; 
 min-height: 35px; 
 font-size:70%; padding:4px 4px 4px 35px;" 
 onclick="get_selection('en','ml');">
Select a text and<br/>click here for speech</button>

User hears a default text

Male voice | Female voice

If user clicks a link, a button or any other element, an mp3 will be created, identified by the webmaster using the html attribute id. The function is: 


<script type="text/javascript" src="http://vozme.com/get_text.js"></script>

[...]

onclick="get_id('WRITE_HERE_THE_ID','en','ml');"

Example: using a text link

Male voice | Female voice
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'

Code:

<div id="alice">
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'

</div>

<script type="text/javascript" src="http://vozme.com/get_text.js"></script>
<a href="javascript:void(0);" 
onclick="get_id('alice','en','ml');">
Hear this text</a>

Example: using an image and a text link

Male voice | Female voice
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'

Code:

<div id="alice1">
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'
</div>

<script type="text/javascript" src="http://vozme.com/get_text.js"></script>
<div><a href="javascript:void(0);" 
onclick="get_id('alice1','en','ml');">
<img src="http://vozme.com/img/megaphone40x40w.gif" border="0" 
style="margin-right:0.4em;" alt=""/></a>
<a href="javascript:void(0);" 
onclick="get_id('alice1','en','ml');">
Hear this text</a></div>
 
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'

Code:

<div id="alice1-1">
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'
</div>

<script type="text/javascript" src="http://vozme.com/get_text.js"></script>
<div><a href="javascript:void(0);" 
onclick="get_id('alice1-1','en','ml');">
<img src="http://vozme.com/img/paper_sound32x32.gif" border="0" 
style="margin-right:0.4em;" alt=""/></a>
<a href="javascript:void(0);" style="font-size:12px;" 
onclick="get_id('alice1-1','en','ml');">
Hear<br/>this text</a></div>

Example: using an image and text button

Male voice | Female voice
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'

Code:

<div id="alice2">
Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do: once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, 'and what is the use of a book,' thought Alice, 'without pictures or conversation?'
</div>

<script type="text/javascript" src="http://vozme.com/get_text.js"></script>
<button style="background-color:white; 
 background-image:
 url(http://vozme.com/img/megaphone40x40w.gif); 
 background-position: left center; 
 background-repeat:no-repeat; 
 height: 48px; font-size:70%; 
 padding:4px 4px 4px 44px;" 
 onclick="get_id('alice2','en','ml');">
Hear this text</button>

iGoogle gadget

Configure your gadget and copy and paste the code.