Solved

Hiding/showing an article with a "Read More" link.

Posted on 2011-09-15
5
249 Views
Last Modified: 2012-06-27
Hi guys,

How do you show and hide an article with a "Read More" link at the bottom of the article. Just so I don't have to take up my whole page with an article that people may not want to read but have the option to if they want. I'm not sure if it's done via HTML but any help or guidance on this would be awesome.

Cheers
0
Comment
Question by:MaxP0wers
  • 3
  • 2
5 Comments
 
LVL 40

Assisted Solution

by:gurvinder372
gurvinder372 earned 250 total points
ID: 36541203
something like this?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
	<style>
		#article
		{
			height:100px;
			width:120px;
			border:1px solid #000;
		}
		a
		{
			color:blue;
			text-decoration:underline;
		}
	</style>
	<script>
		function showMore(thisObj)
		{
			var caption = thisObj.innerHTML;
			//alert(caption);
			if ( caption == "More" )
			{
				document.getElementById("restOfArticle").style.display = "block";
				thisObj.innerHTML = "Hide";
			}
			else
			{
				document.getElementById("restOfArticle").style.display = "none";
				thisObj.innerHTML = "More";
			}
		}
	</script>
</HEAD>

<BODY>
	<div id="article">
		this is going to be a long article, so keep reading..
		<a onclick="showMore(this);">More</a>
		<p id="restOfArticle" style="display:none">this is the rest of the article</p>
	</div>
</BODY>
</HTML>

Open in new window

0
 

Author Comment

by:MaxP0wers
ID: 36541247
Yes that's exactly what I wanted. Thank you very much. Just one more question for the SEO side of the house. Will search engine spiders count all of the content as part of that same page or just the content before the 'more' link?

0
 
LVL 40

Assisted Solution

by:gurvinder372
gurvinder372 earned 250 total points
ID: 36541279
As i have this multiple times, there is no thumb rules for the same.
But they are more likely to give more value to the content which will be more easily available to the user. (just think from the user's perspective wise)
Will user be able to reach to that info by just clicking a URL in google search results!!
0
 

Accepted Solution

by:
MaxP0wers earned 0 total points
ID: 36541366
That's true. I guess the obvious option is to have the whole article showing then. Thanks for the help
0
 

Author Closing Comment

by:MaxP0wers
ID: 36558860
Straight to the point and exactly what I was looking for
0

Featured Post

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

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

Suggested Solutions

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
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…

726 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