Insert Anchor

This function creates an anchor to a specific place within the page. Once an anchor is created a Hyper Link can be created to point to the Anchor. A common use for this is an F.A.Q page. In general F.A.Q. pages have all of the questions at the top of the page and the answers to each question listed at the bottom of the page. A Hyper Link for each question is created to point to an anchor beside the answer to the question. This saves the user from having to scroll up and down to find the matching answer to a question. By clicking on the question the Hyper Link automatically transfers them down the page to the correct position beside the answer to the question assuming the anchor point is placed correctly.

Example

1. If you do not wish to use your website pages for testing you can visit http://www.ezeditor.net/ and click on the EZEDITOR DEMO page. Once there click the Login button to be logged in as Guest Administrator. After logging in click on the TEST AREA page then click the Edit button at the top of the page. Once the page reloads in Edit Mode you can move on to Step 6 and begin this exercise.



2. If you wish to use your own website for testing then Login to your website as Administrator.



3. Go to a page with eZ Editor installed.



4. Do not save any of the changes you make while performing this exercise if you do not want to affect the current contents of the page you are using.



5. Once logged in switch into Edit Mode on the page that you will be performing this exercise on.



6. We will create a sample F.A.Q page



7. Type the Question 1 into the Editor Workarea.



8. Hit the Enter button on your keyboard to start a new line. Type the Question 2 into the Editor Workarea on the newly created line.



9. Repeat the last step 2 more times increasing the number besdie the word Question so that you have 4 lines of text displaying Question 1 to Question 4. Your screen should look like the screen shot below.



 




10. Hit the Enter button on your keyboard approximately 10 times create some space between the last question and where we will place the answers.



11. Copy and Paste or type the paragraph below into the Editor Workarea.

Answer #1
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.




12. Hit the Enter button on your keyboard 3 times and repeat Steps 11 - 12 3 more times.



13. Change the numbers beside the # sign to be in sequence from 1 - 4 for each paragraph. Your screen should look like the screen shot below.



 




14. Highlight the words Question 1 at the top of the page by placing your cursor before or after the words. Hold down the left mouse button. Move the mouse left, right, up, or down until both words are highlighted.



15. With the words Hyper Link highlighted click the Hyper Link button on the editor toolbar to open the Hyper Link dialog box.



16. From the Hyper Link dialog box enter #question1 into the URL field. The # sign indicates that the Hyper Link will be pointing to an anchor named question1 on the destination page. Since we did not enter a destination page in the URL field as normally is done when creating a Hyper Link, the destination page by default will be the same page.



 

17. Leave the Type field set to the default value of http: and click the OK button.



18. Repeat Steps 14 - 16 for the remaining 3 questions. Be sure to change the question number for each question.



19. Now the Anchors must be created.



20. Position the mouse cursor at the end of the Answer #1 text.



 

21. With the cursor positioned click the Anchor button on the Editor Toolbar to open the Anchor dialog box.



22. From the Anchor dialog box enter question1 into the Anchor Name field and click the OK button



 

23. Repeat Steps 20 - 22 for the remaining 3 answers. Be sure to change the question number for each anchor name.



24. When Anchors are created they are not visible. To view where any Anchors have been placed you can click the Show Borders button to temporarily view hidden objects while in Edit Mode. Any Anchors on the page will be displayed as small Anchor icons.



 

25. Once all of the Hyper Links and Anchors are in place the F.A.Q. page is ready to go. If you saved the page and switched back into View Mode clicking any of the question links would transfer you directly to the correct question where the Anchor was placed.