Jump to content

Pages: How to use anchors in editor?


Go to solution Solved by Beomyong Park,

Recommended Posts

Hi, I need to use anchors in the long articles in Pages. There is a kind of table of content that is placed above the article. It should help to navigate through the article, like this:

  • Part 1
  • Part 2
  • Part X

Part 1 
lot of text

Part 2
lot of text

and so on.

Is it possible in editor or at least in Pages? I have searched through the community but it seems that it is not supported. Is it true or have I overlooked something?

Thanks,

Link to comment
Share on other sites

8 minutes ago, Sonya* said:

Unfortunately, editor breaks the anchor code even if entered via HTML. 😪

Works fine

<p>
	<a href="#lorem_en" rel="">English</a> | <a href="#lorem_hy" rel="">Հայերեն</a>
</p>

<div id="lorem_en">
	What is Lorem Ipsum?
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<p style="padding:0px; text-align:justify">
		<strong style="padding:0px">Lorem Ipsum</strong><span>&nbsp;</span>is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;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. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
	</p>
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Why do we use it?
	</h2>

	<p style="padding:0px; text-align:justify">
		It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using &#39;Content here, content here&#39;, making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for &#39;lorem ipsum&#39; will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).
	</p>
</div>

<p>
	&nbsp;
</p>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Where does it come from?
	</h2>

	<p style="padding:0px; text-align:justify">
		Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections.0.32 and.0.33 of &quot;de Finibus Bonorum et Malorum&quot; (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, &quot;Lorem ipsum dolor sit amet..&quot;, comes from a line in section.0.32.
	</p>

	<p style="padding:0px; text-align:justify">
		The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections.0.32 and.0.33 from &quot;de Finibus Bonorum et Malorum&quot; by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.
	</p>
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Where can I get some?
	</h2>

	<p style="padding:0px; text-align:justify">
		There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don&#39;t look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn&#39;t anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary of over 200 Latin words, combined with a handful of model sentence structures, to generate Lorem Ipsum which looks reasonable. The generated Lorem Ipsum is therefore always free from repetition, injected humour, or non-characteristic words etc.
	</p>
</div>

<div id="lorem_hy">
	Ի՞նչ է Lorem Ipsum-ը
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Ի՞նչ է Lorem Ipsum-ը
	</h2>

	<p style="padding:0px; text-align:justify">
		<strong style="padding:0px">Lorem Ipsum</strong>-ը տպագրության և տպագրական արդյունաբերության համար նախատեսված մոդելային տեքստ է: Սկսած 1500-ականներից` Lorem Ipsum-ը հանդիսացել է տպագրական արդյունաբերության ստանդարտ մոդելային տեքստ, ինչը մի անհայտ տպագրիչի կողմից տարբեր տառատեսակների օրինակների գիրք ստեղծելու ջանքերի արդյունք է: Այս տեքստը ոչ միայն կարողացել է գոյատևել հինգ դարաշրջան, այլև ներառվել է էլեկտրոնային տպագրության մեջ` մնալով էապես անփոփոխ: Այն հայտնի է դարձել 1960-ականներին Lorem Ipsum բովանդակող Letraset էջերի թողարկման արդյունքում, իսկ ավելի ուշ համակարգչային տպագրության այնպիսի ծրագրերի թողարկման հետևանքով, ինչպիսին է Aldus PageMaker-ը, որը ներառում է Lorem Ipsum-ի տարատեսակներ:
	</p>
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Ինչո՞ւ ենք այն օգտագործում
	</h2>

	<p style="padding:0px; text-align:justify">
		Հայտնի է, որ ընթերցողը, կարդալով հասկանալի տեքստ, չի կարողանա կենտրոնանալ տեքստի ձևավորման վրա: Lorem Ipsum օգտագործելը բացատրվում է նրանով, որ այն բաշխում է բառերը քիչ թե շատ իրականի նման, ի տարբերություն &laquo;Բովանդակություն, բովանդակություն&raquo; սովորական կրկննության, ինչը ընթերցողի համար հասկանալի է: Շատ համակարգչային տպագրական ծրագրեր և ինտերնետային էջերի խմբագրիչներ այն օգտագործում են որպես իրենց ստանդարտ տեքստային մոդել, և հետևապես, ինտերնետում Lorem Ipsum-ի որոնման արդյունքում կարելի է հայտնաբերել էջեր, որոնք դեռ նոր են կերտվում: Ժամանակի ընթացքում ձևավորվել են Lorem Ipsum-ի տարբեր վերսիաներ` երբեմն ներառելով պատահական տեքստեր, երբեմն էլ հատուկ իմաստ (հումոր և նմանատիպ բովանդակություն):
	</p>
</div>

<p>
	&nbsp;
</p>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Ի՞նչ ծագում ունի այն
	</h2>

	<p style="padding:0px; text-align:justify">
		Հակառակ ընդհանուր պատկերացմանը` Lorem Ipsum-ը այդքան էլ պատահական հավաքված տեքստ չէ: Այս տեքստի արմատները հասնում են Ք.ա. 45թ. դասական լատինական գրականություն. այն 2000 տարեկան է: Ռիչարդ ՄքՔլինտոքը` Վիրջինիայի Համպդեն-Սիդնեյ քոլեջում լատիներենի մի դասախոս` ուսումնասիրելով Lorem Ipsum տեքստի ամենատարօրինակ բառերից մեկը` consectetur-ը, և այն որոնելով դասական գրականության մեջ` բացահայտեց դրա իսկական աղբյուրը: Lorem Ipsum-ը ամրագրված է Ք.ա 45թ. Ցիցերոնի &quot;de Finibus Bonorum et Malorum&quot; (Չարի և բարու ծայրահեղությունների մասին) ստեղծագործության.0.32 և.0.33 բաժիններում: Այս գիրքը Վերածննդի ժամանակաշրջանում էթիկայի տեսության հայտնի աշխատություն է եղել: Lorem Ipsum-ի առաջին տողը` &quot;Lorem ipsum dolor sit amet..&quot;,.0.32 բաժնից է:
	</p>

	<p style="padding:0px; text-align:justify">
		Հետաքրքրվողների համար ոտորև ներկայացված է 1500-ականներից ի վեր օգտագործվող Lorem Ipsum-ի ստանդարտ տեքստի մի հատված: Ցիցերոնի &laquo;de Finibus Bonorum et Malorum&raquo; աշխատության.0.32 և.0.33 բաժինները ներկայացված են հենց բնօրինակ տեսքով` զուգորդված 1914թ. Հ. Րաքհամի անգլերեն թարգմանությամբ:
	</p>
</div>

<div style="background-color:#ffffff; color:#000000; font-size:14px; padding:0px; text-align:left">
	<h2 style="font-size:24px; padding:0px; text-align:left">
		Որտեղի՞ց վերցնել նման տեքստ
	</h2>

	<p style="padding:0px; text-align:justify">
		Կան Lorem Ipsum-ի շատ տարբերակներ, սակայն շատերը աղավաղվել են տարաբնույթ, երբեմն նույնիսկ լատիներենից շատ հեռու և անհավանական բառերի և հումորի ավելացման արդյունքում: Եթե ուզում եք օգտագործել Lorem Ipsum, ապա երևի չեք ցանկանա, որ այն պարունակի ինչ-որ թաքնված հումոր տեքստի միջնամասում: Ինտերնետում բոլոր Lorem Ipsum արտադրիչները հակված են կրկնել նույն տեքստը մինչև ցանկալի ծավալի լրացումը. այնինչ իսկականը այս արտադրիչն է: Այն օգտագործում է լատիներենի շուրջ 200 բառ` դրանք համադրելով նախադասության հնարավոր շարադասությունների հետ, որպեսզի արտադրի ճշմարիտ Lorem Ipsum: Արտադրված Lorem Ipsum-ը, արդյունքում չունի կրկնություններ, հումորային բովանդակություն կամ այլ անիրական բառեր:
	</p>
</div>

 

Link to comment
Share on other sites

@newbie LAC, thanks! This helped to figured out that anchor has been broken due to 3rd party plugin No External Links.

@shahed, thank you! But my editors will not use wiki markup. It is just too complicated to learn it :blush:

My walk-around to avoid editing HTML: I have created a custom button for the anchor in the editor.

screenshot-2019_08.17-20-31-25.thumb.png.8416e9a8864c7de016d831ed1f03d0a6.png

This button is now available in Pages to set the target of the anchor. When adding link, the editors now just add # with anchor ID. This works. 

 

Link to comment
Share on other sites

  • 1 year later...
  • Solution
On 8/17/2019 at 10:54 AM, ahc said:

I don't think it's possible in the editor unless you can use html and use the source tab.  Otherwise, it is possible with pages via html.

Yes, when users have permission to post HTML, the auto cleaning is bypassed as Matt advised:

 

Link to comment
Share on other sites

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...