How to Create a Link (table of contents) to the same page

Have you ever seen the inside of a courtyard blog article presents a list of links such as tables of contents, and click the link it will go (scroll) a certain part, but still on the same page, and expose contain articles based on the text link the text is clicked.

This type of link may still be called an internal link to the same page, and the link type is typically used to make the article points involved (such as content) is a long article.

We aim to make a list of links like this is to allow visitors to select important points contained in the article, click on any link and then visitors stay provided that he would take another part of the page that links to the document.


What term links are?


When I click on the link actually difficult to define the word for such a link, as I call it internal links a page or internal link to another part of the document, the point, you will be directed to a specific article pages, but still on the same page.

To create a link, so it is, obviously, you need to know is that you should understand the basic HTML command to make the link.

If you happen to still do not know basic HTML commands to create a link so you can read the first article in the following:
Know what a hyperlink? (Especially beginners)
How to create a link (hyperlink) Blogspot on 
By reading the above article, at least you know it's hyperlinks and how to create a hyperlink with hand tools or by writing HTML code to help.

How to make a link (directory) on the same page

I assume you already know what the link, and how to create a link, then we will create a link to the list of contents of your article is very long.

To create such a link, and create two parts, namely Link and text objects or interest text, a link to a link (text available click), and the target text. Click on the link, it will go to a specific page where the text object.

HTML command to make a link, you must be the format of the service:
<a href='#label'> text </a>
As for the target text, you have to do is format:
<span id ='label'> text </span>
Suppose I want to create a link with this text best smartphones and click the link, the page will scroll to get to another part of the same page of the book that contains the word "Asus is present century, best smartphones. "

To create a link similar to the above case, the command is:

Link, you can do this:
<a href = '#best smartphone'>seo Introduction</a>
Text goal is to be made:
<span id = 'best smartphone'> asus is the best smartphone of this century. </span>
HTML code above command, you should use the HTML editor to create a manual mode BlogSpot articles.

Step, so that the corresponding link on the same page (directory) Blogspot

Link step to create a table of contents of the article BlogSpot, so that when you click on the link to go to another part of the same page, as follows:

1, please put your long article.

Use compose mode in your blog post editor

2. Write your article to finish
Or on the same page, so that your article is completed, and still do not forget in the same article, so too text list, the link to the table of contents, for example, as shown below:

To ensure that the article has been fully and text links you need to own content to write out a list.

3. Select mode HTML editor for your blog article
Select only the HTML button located in the upper left corner next to the compose button.

Then in HTML mode text and link targets.

How to make the target text :

In the HTML mode, find and change the targeted text sentence in the format:
<span id ='label'> target text </span>
Label name matches what independent space - or _.

For example, in the words of your article, "asus smartphone this century, you should have best smartphone" the sentence you wish, "asus is the best smartphone"as the target text, then please change it to:

Smartphone < span id='asus-smartphone'> asus is the best smartphone </span> of this century, you have to have


How to Create :
To create a link, the target will move toward the above format follows the text clicked:
<a Href='#label'> text link </a>
For example, we will try to make your article included in the "best smartphone" into a link, if you click on this link, the page will scroll to a specific part it is still above the target text on the same page.

Then, the above text should read:
<a href='#smartphone-asus '> best smartphone </a>
4. Publish your article.
Inagar you should keep the HTML mode, do not go back to writing mode, if you press the write mode, and then format back links you have created.

Suitable, please direct all articles have been published if you believe. Or Preview (Review) to see the results.


Way above the table of contents of your article will have in the form of a link, and when the link diclick it toward the other part, but still on the same page.

DEMO:

For a demo, try clicking on the link below:

How to create (table of contents) link
(Click on it will go to the subtitles "I create links to content in table blogspot same page article")

Step by step, create a directory link table
(Clicking on it will move toward the caption "steps, so that the corresponding link on the same page (directory) BlogSpot")

For a complete example CLICK HERE


I hope this article How to create a link on the same page (directory) you can understand and hope to be useful.

No comments:

Post a Comment

 
Copyright © 2016. Articles Basic - Blog.
About | Contact | Privacy Policy
Creative Commons License