Adapt the reading

When you implement ReadSpeaker webReader you need to determine the reading area. This is to tell ReadSpeaker what part of the page that should be read. ReadSpeaker will then highlight and read the content inside the reading area.

You can define the area to read via three methods:

  1. Either send a readid parameter containing a comma-separated list of the IDs on the page to read.
    E.g readid=myid1,myid2
    It supports either one or multiple readids.
  2. Send a readclass parameter containing a comma-separated list of the classes on the page to read.
    E.g readclass=myclass1,myclass2
    It supports either one or multiple readclasses.
  3. Send both readid and readclass.
    E.g readid=myid1,myid2&readclass=myclass1,myclass2

However you have the possibility to adapt the reading inside the reading area with our classes listed below and our start and stop comments.

class description 
<!-- RSPEAK_START -->

 

<!-- RSPEAK_STOP -->
 Can be used to mute/skip certain content. Please note that in order for highlighting to work you need to use these comments inside the reading area. You should also start with our stop comment as the element with the id used as readid will be considered as a start comment.
Example: 
<!-- RSPEAK_STOP -->This piece of text will be shown on the webpage, but not read by ReadSpeaker.<!-- RSPEAK_START -->
rs_skip Can be used to mute/skip certain elements. Can be used on any html element.
Example: 
<p class="rs_skip">This piece of text will be shown on the webpage, but not read by ReadSpeaker.</p>

This is demonstrated on the following page:
https://demo.readspeaker.com/webreader/exclude-text-from-the-reading
rs_skip_always

Can be used to mute/skip certain elements even when using textselection. Can be used on any html element.
Note that this functionality has to be enabled to work as intended. This is done by adding this inline configuration before the webReader javascript: 

window.rsConf = {general: {enableSkipAlways: true}};

Example: 

<p class="rs_skip_always">This piece of text will be shown on the webpage, but not read by ReadSpeaker.</p>

This is demonstrated on the following page:
https://demo.readspeaker.com/webreader/exclude-text-from-the-reading
rs_do_not_process Can be used to mark an element to not be processed by webReader by any means.
Example: 
<div class="rs_do_not_process">This content will not be processed or sent over the internet at all.</div>

This will automatically mute the element as well, as webReader will disregard what's inside.

Note: Another configuration is needed for this to work. Please contact our Support Team for more information
rs_preserve Can be used to prevent Javascript content, inside the reading area, from breaking when ReadSpeaker is active.
Example: 
<div class="rs_preserve">This piece of text will be shown on the webpage and read, but not highlighted by ReadSpeaker.</div>

Note You cannot put rs_preserve on the same element you are using as your readid or readclass

Please note that you can not use rs_preserve inside an element that already have rs_preserve added. If you have an element with the class “rs_preserve” inside another element with the class “rs_preserve” the second element will disappear when ReadSpeaker is activated.
Example: 

<div class="rs_preserve">This div will not be highlighted by ReadSpeaker, but it will be read.
<div class="rs_preserve">This div will disappear when ReadSpeaker is activated.</div>
</div>

You can read more about rs_preserve here
rs_pause Adds a pause at <br> tags.
Example: 
This is a text<br class="rs_pause" />This is a new text.
rs_content Can make ReadSpeaker read tables in an intuitive way, instead of just reading the content in the table from top left to bottom right. ReadSpeaker can be set to repeat the relevant table header before each table cell, such as:
Output without rs_content: Product, Price, Available, Lemons, $10, Yes...
Output with rs_content: Product, Lemons, Price, $10, Available, Yes, Product, Oranges, Price, $7, Available, Yes...
Example: 
<table border="1" class="RS_CONTENT">
<tr>
<th>Product</th>
<th>Price</th>
<th>Available</th>
</tr>

<tr>
<td>Lemons</td>
<td>$10</td>
<td>Yes</td>
</tr>

<tr>
<td>Oranges</td>
<td>$7</td>
<td>Yes</td>
</tr>

<tr>
<td>Tangerines</td>
<td>$12</td>
<td>No</td>
</tr>
</table>

This is demonstrated on the following page:
https://demo.readspeaker.com/webreader/table-reading

rs_message Can be used to read a hidden text.
Example: 
<span class="RS_MESSAGE">
<!-- The hidden text that should be read -->
</span>
rs_title Can be used to read the title of a link instead of the link text.
Example: 
<a href="https://www.readspeaker.com" class="RS_TITLE" title="Read more about ReadSpeaker">Read more.</a>