Solved

Collapsible Text Code?

Posted on 2010-11-17
5
307 Views
Last Modified: 2012-05-10
On this page here: http://www.asp.net/ajax/ajaxcontroltoolkit/Samples/AutoComplete/AutoComplete.aspx

You can see an area that says "Auto Complete Description"

It is an area of collapsible text.  I would like to have that function on my webpage.  I have looked at other sites for collapsible text and they are not always SEO friendly.  But in the code behind for that page, all of that collapsible text is just inside a DIV, and it is clearly SEO friendly.  But I'm not sure how to get it to work.  Can someone help me get it to work properly?  I need to have collapsible text (that will contain hyperlinks) on my page , but with very SEO friendly code (so that everything in the collapsed text is Google friendly.)   I'm using ASP.NET.
0
Comment
Question by:arthurh88
5 Comments
 
LVL 52

Expert Comment

by:Carl Tawn
ID: 34153449
Those parts are done with CollapsiblePanels, the reference for which is on the left-hand menu of the URL you posted.
0
 
LVL 21

Expert Comment

by:Alpesh Patel
ID: 34153574
Hi, to do that use jQuery Accordion. It will help to solve your problem.
0
 
LVL 6

Expert Comment

by:Codebot
ID: 34153721
0
 
LVL 6

Accepted Solution

by:
Codebot earned 250 total points
ID: 34153740
0
 
LVL 44

Assisted Solution

by:scrathcyboy
scrathcyboy earned 250 total points
ID: 34160352
There is nothing unique about the idea of collapsible text.  Ebya does it on all their preferences pages, as does Amazon, and thousands of other vendors.

It is real simple -- You put the DIV in with all the data in it -- Then onLoad you style it -- display:none; or else set its display to none.  Then when the person clicks a link to see the details, you change the -- display:none; -- to display:block;.

That is ALL there is to it, and EVERYTHING in the page, including the display:none; blocks are indexed by google and other SEs.  All you need is an ID for the DIV to reference it, and change it with javascript.
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

831 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question