Guide for using Anchor in your posts

in Ecency2 years ago (edited)


       Source: Eric Chandler

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.

English ° Deutsch ° Español
## Hello fellow Hivians Surely you have already thought about how the reader can jump to a certain point in the text. This is a big topic, especially for bloggers who write multilingually. I've often seen that some work with two columns or jump back and forth between languages ​​in the text. *What if you had great jump marks in your text like I used here?* The reader could switch from language to language. Or you have a table of contents and the reader can jump directly to a topic. ## So let's drop anchor If you've already dealt with HTML, it should be relatively easy for you. For the others, here is a little guide on how it works.

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 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 id="english"></a>
<a id="deutsch"></a>
<a id="espanol"></a>

I hope I could help you with that. If you have any questions, ask them in the comments.


English ° Deutsch ° Español

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 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 id="english"></a>
<a id="deutsch"></a>
<a id="espanol"></a>

Ich hoffe ich konnte euch damit helfen. Falls ihr fragen habt, stellt sie in den Kommentaren.


English ° Deutsch ° Español

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 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 id="english"></a>
<a id="deutsch"></a>
<a id="espanol"></a>

Espero poder ayudarte con eso. Si tienes alguna duda, hazla en los comentarios.

Top

I used Google Translator - Please let me know if there are any misspells.

chaosmagic23
Support chaosmagic23 on buymeberries
Posted using Ecency Love

Images and screenshots are from me or free pixabay pictures

#oneup #pizza #hive-engine #neoxian #ocd #pob #pgm #alive #posh


Crypto Games Crypto Trading Marketing
Gods Unchained Free BitCoin Pro Chart Tradingtool ListNerds
Splinterlands Free LiteCoin Binance Trading & Earning LeadsLeap
Prospectors Cointiply Kucoin Trading Traffic Ad Bar
Rising Stars Geomining Terra LUNA staking
Eternal Pi Network Bot Trading
Womplay CFD Trading
Pipeflare
BetFury
Sort:  

Your language links doesn't work for me. When I touch the link, the ecency wants to open links in browser, when I touch 'open in browser' then got message 'Failed to open link'. Seems that's an Ecency issue in Android?

Thank you for testing and commenting. I noticed it too this morning when I wanted to brag about it to my wife. 😅 I showed it to her on the phone but the links don't work as they should. I have Android too. That's a bummer!

As I mention I'm not sure which issue is this. Ecency, text editor in Ecency for posting, Android?

I talked to @melinda010100 and posted the problem in Ecency Discord #issues. She told me the devs are already working on that. Pretty neat!
Btw it will not work while you edit your text. That's unfortunate. You have to publish the post and then check if everything is okay.

Thanks for putting this together! It is now included in #EcencyHelp

Very nice! I hope this will be helpful and people understand how it works.

I posted it in Ecency Spanish. Since dual languages are often used there knowing this may be helpful.

Awesome! That's why I translated it also in Spanish, knowing the Spanish community is huge. I hope the translation is correct and they understand everything I wrote. 😅

palomap3 is coordinating the Spanish room. Reach out to her and tell her that you are available to answer questions. She could be a good connection for us all!

The Spanish translation is ok, thank you for open your tutorial to Latin community. 😍

I think you may like this helpful guide. @bradleyarrow

Ein sehr feines Tutorial :)
!WINE !hivebits


Hi @sportsbuddy, This Post Is Older Than 3 Days Days.
Please Try Another Post.
(We Will Not Send This Error Message In Next 24 Hrs).

wine_logo


Contact Us : WINEX Token Discord Channel
WINEX Current Market Price : 0.168


Swap Your Hive <=> Swap.Hive With Industry Lowest Fee (0.1%) : Click This Link
Read Latest Updates Or Contact Us

Success! You mined .9 HBIT & the user you replied to received .1 HBIT on your behalf. mine | wallet | market | tools | discord | subscribe | <>< daily

Vielen Dank!

This is an awesome share. Thank you.

You are welcome. I hope you can use it in your posts.

Great and helpful information! Thanks for sharing it with such awesome details.
!ALIVE
!CTP

Thank you! I tried to explain it easy enough for people who don't know HTML.
Thx for the token!

You're welcome and Thank you, @chaosmagic23! You do a great job of that! 😀
Happy Monday! 😀

Happy Monday to you too and thank you.

You're welcome and Happy Friday Now! Enjoy your weekend. 😀
!CTP

@chaosmagic23! You Are Alive so I just staked 0.1 $ALIVE to your account on behalf of @lisamgentile1961. (10/10)

The tip has been paid for by the We Are Alive Tribe through the earnings on @alive.chat, feel free to swing by our daily chat any time you want.

Good Morning and Thank you, @youarealive! Enjoy your day.😀

I haven't used this one in years when I was trying to use some HTML coding but I think I'll put it again to good use soon enough, thanks for bringing it up!

Voted on ListNerds!

Thank you for dropping in via ListNerds. I would at least consider it if you write longer posts, so the reader can jump to specific sections. For short posts, it doesn't make much sense in my opinion. Or if you write bilingual but I did not see any bilingual posts on your blog list.

You're right, I might be using it for the longer articles, no point in using it for the short Actifit posts...

Yay! 🤗
Your content has been boosted with Ecency Points, by @unklebonehead.
Use Ecency daily to boost your growth on platform!

Support Ecency
Vote for new Proposal
Delegate HP and earn more

Thank you Ecency! 🙏

This is really helpful, thank you for sharing! !PIZZA

Very good that it helps you and thank you for the !PIZZA.

Großartiger Post, diese Funktion vermisse ich schon länger und wusste, dass das mit HTML gehen muss....aber wie nur :D

Danke! Jetzt weißt du ja wie es geht. Falls du fragen dazu hast, einfach hier oder mich noch einfacher auf Discord anschreiben.

Sehr cool. Hab lange nicht mehr mit HTML gearbeitet und werde das morgen ausprobieren. Danke für den Post !LUV

Sehr gerne. Sag bescheid ob es funktioniert hat. In der Ecency App gibt es wohl noch kleine Probleme damit, aber die Devs wissen bescheid und arbeiten schon daran.
Danke fürs kommentieren und den Token.

Klasse Chris. Das wird vielen Leuten - inklusive mir - sehr weiterhelfen.
Der Zucchini-Auflauf-Artikel wird meine ersten Sprungmarken bekommen :o).

!PIZZA

Dafür war es gedacht. Ich bin gespannt auf deinen Auflauf.

You said Anchor and the Podcaster in me got excited you gonna talk about posting podcast episodes, lol!

🤣 Well, I don't know nothing about podcasts. Don't be sad. I'll sing you a song:

Sail away, sail away
We will cross the mighty ocean into Charleston Bay
Sail away, sail away
And we will cross the mighty ocean into Charleston Bay

Songtext from Joe Cocker


The rewards earned on this comment will go directly to the people( @chaosmagic23 ) sharing the post on Twitter as long as they are registered with @poshtoken. Sign up at https://hiveposh.com.

Danke! !PIZZA

Freut mich wenn es dir hilft. 👍

Juhu juhu! Perfekt!

This is the very best for bilingual posts, I am so happy it also works with ecency now.
Thank you for this easy to use explanation
!LUV

I'm happy that you say it's easy to understand. Most times if you know something or you come from a tech perspective, it could be that you explain it to complicated for normal people.

wow! Fascinating, I must try to see if I got the code right, thank you very much for sharing it 😊

I'm glad you like it. Just try it out. If you need help let me know or contact me via ecency discord.

untitled.gif

Oh no? I can't resist cats.

PIZZA! PIZZA! PIZZA! PIZZA! PIZZA!

PIZZA Holders sent $PIZZA tips in this post's comments:
hannes-stoffel tipped chaosmagic23 (x1)
@qwerrie(4/5) tipped @chaosmagic23 (x1)
thoth442 tipped chaosmagic23 (x1)
freedomprepper tipped chaosmagic23 (x1)
chaosmagic23 tipped thoth442 (x1)

Join us in Discord!

Perfectly explained! Tbh, i was looking for this as I'm trying to get better in formatting and learning this HTML this is really helpful.

Thank you for sharing with us.! Really appreciate.

Thank you for commenting. I'm happy that it helps so many people. I also try to makes the post more clear and gives it a good look. Doesn't have to be perfect, but you don't want to jump up and down or read small columns as a reader.

Congratulations @chaosmagic23! You have completed the following achievement on the Hive blockchain and have been rewarded with new badge(s):

You made more than 3500 comments.
Your next target is to reach 4000 comments.

You can view your badges on your board and compare yourself to others in the Ranking
If you no longer want to receive notifications, reply to this comment with the word STOP

Check out the last post from @hivebuzz:

Hive Power Up Day - August 1st 2022

Wow.
My first time hearing this, and it's interesting. Thanks for this info👌

You can test it in this post here... There are 3 links for English, German and Spanish.
You're welcome!

Just tested at Peakd interface (latest version of Chrome) - links worked.

Really? It works again? Thank you for telling me.

it did, but I am on desktop, did not tested it on android / mobile.
cheers, and thank you too for reminding me about this useful feature.
a decade ago I was not bad with HTML 🤔
a !PIZZA back

I know it doesn't work on Ecency mobile App but it worked on desktop for Ecency and PeakD.
!ALIVE

@qwerrie! You Are Alive so I just staked 0.1 $ALIVE to your account on behalf of @chaosmagic23. (2/10)

The tip has been paid for by the We Are Alive Tribe through the earnings on @alive.chat, feel free to swing by our daily chat any time you want.

Servus @chaosmagic23
Habe jetzt wieder einen Post mit dem Tool erstellt. Aber irgendwas läuft falsch. Auf ecency ist alles prima. Aber bei Hive hat es mir heute früh immer eine neue Seite aufgemacht, und jetzt linkt er mich plötzlich nur noch auf meine Posts.

https://peakd.com/hive-195370/@eddwood/rising-star-next-mission-completet

Du meinst die Anker? Ich hab gerade deine Posts auf Ecency und PeakD getestet und es funktioniert. Allerding bin ich auf auf dem PC. Ich weiß aber dass es auf dem Handy teils nicht geht..

Hm, seltsam. Bin auch am PC mit Chrome als Browser.
Das komische ist, dass es sich seit heute früh geändert hat. Ohne den PC neu zu starten oder Chrome neu zu öffnen.
Vormittag gleich nach dem veröffentlichen auf Peakd hat sich ein neues Fenster geöffnet mit dem richtigen Inhalt und dem Anker. Und jetzt springt es auf mein Postprofil und man sieht die Posts vor exakt einer Woche.
Echt strange. Bei ecency alles wie gewollt.
Werde später mal meinen PC neu starten. Mal schauen was es dann macht.:))

Das ist wirklich seltsam. Ich hatte mit meinen Posts bei PeakD auch Probleme. Mal scheint es zu gehen und dann mal wieder nicht. HTML Technisch ist der Code aber korrekt und sollte aber gehen.

Tags like education and tutorial or html would help when people search maybe just a suggestion. I wil try it out on my heyhaveyaRead blog tomorrow and will spread it in discord
Happy Friday

!LADY

Added the tutorial and html tag. Let me know if it worked fine.

It works !

I meant if the code works in your post. 😏