Anchor - Anker - Ancla
° How to use anchor in your Hive posts
° Wie man Anker in Hive Posts benutzt
° Cómo usar ancla en tus publicaciones de Hive
Edit: For some reason it doesn't work anymore like it did before in PeakD, but it stills works in Ecency like it should.
In order for the whole thing to work you need two code snippets. Once the link to the anchor that you can click and once the anchor itself where you then jump to.
Your anchor looks like this:
<a data-id="anchor"></a>
You can name your anchor whatever you want, but of course you must use the same name in the link and add a hash in front. The target part is important to jump within the post and not open a new window.
Your link looks like this:
<a href="#anchor" target="_self">anchor link</a>
In this post here it looks like this for the language selection on the left:
<center>
<sup>
<a href="#english" target="_self">English</a> °
<a href="#deutsch" target="_self">Deutsch</a> °
<a href="#espanol" target="_self">Español</a>
</sup>
</center>
And here are all the anchors, of course placed in the right places in the text:
<a data-id="english"></a>
<a data-id="deutsch"></a>
<a data-id="espanol"></a>
I hope I could help you with that. If you have any questions, ask them in the comments.
Hallo liebe Hivianer
Sicher habt ihr auch schon mal überlegt wie der Leser zu einem bestimmten Punkt im Text springen kann. Gerade für Blogger die multilingual schreiben, ist das ein großes Thema. Ich hab oft gesehen das einige mit zwei Spalten arbeiten oder im Text hin und her springen zwischen den Sprachen.
Was wäre wenn du in deinem Text so tolle Sprungmarken hättest wie ich es hier benutzt habe?
Der Leser könnte von Sprache zu Sprache wechseln. Oder du hast ein Inhaltsverzeichnis und der Leser kann direkt zu einem Thema springen.
Also lasst uns den Anker werfen
Falls du schon mit HTML zu tun hattest, dürfte es relativ einfach für dich sein. Für die anderen ist hier eine kleine Anleitung wie es funktioniert.
Damit das ganze funktioniert brauchst du zwei Code Schnipsel. Einmal den Link zu dem Anker, den man klicken kann und einmal den Anker selbst wo man dann hin springt.
Dein Anker sieht so aus:
<a data-id="anker"></a>
Du kannst deinen Anker benennen wie du willst, aber du musst natürlich im Link den gleichen Namen benutzen und eine Raute vorne hinzufügen. Der Target Teil is wichtig, damit innerhalb des Posts gesprungen wird und nicht ein neues Fenster geöffnet wird.
Dein Link sieht so aus:
<a href="#anker" target="_self">Anker Link</a>
In diesem Post hier sieht das so für die Sprachauswahl Links aus:
<center>
<sup>
<a href="#english" target="_self">English</a> °
<a href="#deutsch" target="_self">Deutsch</a> °
<a href="#espanol" target="_self">Español</a>
</sup>
</center>
Und hier sind alle Anker die natürlich an den richtigen Stellen im Text plaziert sind:
<a data-id="english"></a>
<a data-id="deutsch"></a>
<a data-id="espanol"></a>
Ich hoffe ich konnte euch damit helfen. Falls ihr fragen habt, stellt sie in den Kommentaren.
Hola compañeros Hivianos
Seguro que ya has pensado en cómo el lector puede saltar a un punto determinado del texto. Este es un gran tema, especialmente para los blogueros que escriben en varios idiomas. Muchas veces he visto que algunos trabajan con dos columnas o saltan de un idioma a otro en el texto.
¿Qué pasaría si tuviera grandes marcas de salto en su texto como las que usé aquí?
El lector podía cambiar de idioma a idioma. O tiene una tabla de contenido y el lector puede saltar directamente a un tema.
Así que echemos el ancla
Si ya ha trabajado con HTML, debería ser relativamente fácil para usted. Para los demás, aquí hay una pequeña guía sobre cómo funciona.
Para que todo funcione, necesita dos fragmentos de código. Una vez que el enlace al ancla en el que puede hacer clic y una vez que el ancla misma donde luego salta.
Tu ancla se ve así:
<a data-id="ancla"></a>
Puede nombrar su ancla como desee, pero, por supuesto, debe usar el mismo nombre en el enlace y agregar un hash al frente. La parte de destino es importante para saltar dentro de la publicación y no abrir una nueva ventana.
Su enlace se ve así:
<a href="#ancla" target="_self">enlace de anclaje</a>
En esta publicación aquí se ve así para la selección de idioma a la izquierda:
<center>
<sup>
<a href="#english" target="_self">English</a> °
<a href="#deutsch" target="_self">Deutsch</a> °
<a href="#espanol" target="_self">Español</a>
</sup>
</center>
Y aquí están todos los anclajes, por supuesto colocados en los lugares correctos del texto:
<a data-id="english"></a>
<a data-id="deutsch"></a>
<a data-id="espanol"></a>
Espero poder ayudarte con eso. Si tienes alguna duda, hazla en los comentarios.
I used Google Translator - Please let me know if there are any misspells.
Images and screenshots are from me or free pixabay pictures
#oneup #pizza #hive-engine #neoxian #ocd #pob #pgm #alive #posh