Google Friendly 'Read More' Tabs

Read More Tabs are great way of reducing the real estate used for written content on a website page. However if not constructed in the correct way the written text within the read more tab will not be visible to Google, losing the benefit of the content and any links within which may have a negative effect on Google search engine rankings.

If the code [display:none;] is used to hide the content of a slider then Google does not index it, the way to do it is to hide the content in this manner:

<div id="hidden-content">
        <divclass="content">
            <p>Hidden content goes here</p>       
                </div>   
                <p class="expand-para">
                    <a href="#" id="more-link" class="button-wp">Expand link</a>
                </p>
</div>

<script type="text/javascript">
  jQuery(document).ready(function() {
   
    jQuery('#our-blog .content').hide();
   
    jQuery('#more-link').click(function(){
        if(jQuery('#more-link').text() == 'Expand') {
            jQuery('#hidden-content .content').slideDown();
            jQuery('#more-link').text('Lessen');
        } else {
            jQuery('#hidden-content .content').slideUp();
            jQuery('#more-link').text('Expand');
        }
        return false;
    });
  });
</script>
Comments