HTML5 footnote coding with "NAME" - html

I have hundreds of footnotes in scores of documents.
All are in HTML4 format. I have needed to update all the pages to HTML5.
When using a code checker for HTML5, I am informed that "NAME" as be deprecated and it I am getting warnings in to change the code.
I can't find a code example to resolve this. I am not looking to do anything fancy. I don't want to display the footnote by hovering the mouse over the call to the footnote. I just want to be able to click on a footnote number and get to it at the bottom of the page and then return! I don't see how that is done without "NAME."
Currently as an example, this is what a my code looks like. (I make have ten or more footnotes on any given page.
<P>This is in the regular text
<A NAME="sdfootnote1anc" HREF="#sdfootnote1sym"><SUP>1</SUP></A>></P>
AND it calls this at the bottom of the page.
<p><DIV ID="sdfootnote1">
<A NAME="sdfootnote1sym" HREF="#sdfootnote1anc">1</A> - Here I am explaining it before I go on after the break to the next footnote.</DIV><BR>

Change name to id
<A CLASS="sdfootnoteanc" id="sdfootnote1anc" HREF="#sdfootnote1sym">
<A CLASS="sdfootnotesym" id="sdfootnote1sym" HREF="#sdfootnote1anc">1</A>

Related

Can we auto-expand an HTML 'details' when a hyperlink points to it?

I am creating a page with language information. Since it is extremely long, I collapse each language with details/summary tags and have them in alphabetic sections with each initial letter also a collapsed details. Currently, each language is coded like
<details>
<summary id="am"><b>am — Amharic</b></summary>
<p><img src="/wp-content/uploads/2018/05/GBV-Amharic-150.jpg"/>About 22 million native speakers, … [more info]</p><br clear="all"/>
</details>
If I put a link elsewhere like http://domain.TLD/path/#am, I'd like to take the user to that page, scroll to that section, and expand the details. If that's possible, do I have the wrong syntax for one or both sides? It is not working now—nothing expands and it goes to the top of the page as if the # were not there. But the address field shows the full URI of the link, #id included.
"path/" is interpreted by Wordpress and/or a Wordpress-generated .htaccess, so perhaps that somehow prevents it working correctly.
You have the correct syntax for directing a user to an element with the id "am."
You can check the URL the browser used to display the page with jQuery. For your example if a link sent a user to http://domain.TLD/path/#am the following code would trigger if the browser contained "path/#am" as part of the URL.
jQuery(document).ready(function($) {
if(window.location.href.indexOf("path/#am")){
/* do something to the element in jQuery -- likely apply a class.
*/
}
There are many animation and scrolling libraries related to jQuery as well.

Creating HTML link to a span in a page on Wikipedia

I would like to know if it is possible to create a link to a specific span in someone else's page. For putting on a website or blog one might create for themselves, or even a local page one uses to put links to something interesting they found maybe.To be more clear, I want the link this way so that when someone clicks on the link, it goes to a specific location on the page, mostly for a long page where you want someone to go directly to the relevant information - when that part of the page doesn't have an anchor element you can make use of. I am using Wikipedia as an example, even though it might not be the best example, because I know Wiki uses it's own way of doing certain things. Say you wanted to link to the Wiki page "List of fallacies" and the span for the sublist titled "Red herring fallacies".
The page link is :
"https://en.wikipedia.org/wiki/List_of_fallacies"
Using Inspect Element, I got this for span :
<span class="mw-headline" id="Red_herring_fallacies">Red herring fallacies</span>
I tried to combine them like this :
<a href="https://en.wikipedia.org/wiki/List_of_fallacies<span class="mw-headline" id="Red_herring_fallacies">Red herring fallacies</span>">Red
herring logic fallacies list</a>
I am just wondering; am I a) doing it incorrectly for just using HTML, b) it can be done, but you have to use additional assets (CSS, JavaScript, etc), or c) it isn't possible to do at all?
I would like to do it using just HTML if possible, but if that is not possible, then I would appreciate it if someone can tell me how you might do it some other way - if it isn't impossible altogether. Thanks
Edit: My page is marked as a duplicate of answers to an earlier question, and from looking at the page it appears that this IS true. But I think my question heading itself was more clear to a beginner without much knowledge of advanced topics in creating webpages. Thanks for all of the help, and if the moderator believes my point is not relevant then please feel free to do whatever you do with duplicate questions.
you are missing a close "> just before the span started and you are missing the anchor in your href like this #Red_herring_fallacies, because span has that ID
<a href="https://en.wikipedia.org/wiki/List_of_fallacies#Red_herring_fallacies">
<span class="mw-headline" id="Red_herring_fallacies">Red herring fallacies</span>
Redherring logic fallacies list
</a>
The span has an ID. Use that as the parameter in your URL in the link.
Red herring logic fallacies list
To target an id you must add #theId at the end of your url.
The result will look ass follow:
<a href="https://en.wikipedia.org/wiki/List_of_fallacies#Red_herring_fallacies">
Red herring logic fallacies list
</a>

HTML5 tags are not working in RTF field for TRidion 2011

I came across with an issue where RTF field in TRidion 2011 is removing HTML5 tags while saving component.
Issue:
Source snippet
<div>
<a class="arrow button" data-role="button" data-inline="true" href="www.google.com">Information</a>
</div>
Tridion is saving above snippet
<div>
<a class="arrow button" href="www.google.com">Information</a>
</div>
In short Tridion is removing HTML5 attribute while saving the component.
Please give some hint to resolve above issue.
For this you can extend the RTF field to allow HTML5 tags for this you have to specify these tags in a file TcmXhtml.Config at the path
[Tridion]\web\WebUI\Core\Controls\FormatArea\TcmXhtml .
Tridion uses XHTML to store rich text fields. Since the attributes you specified are not valid XHTML, Tridion removed them.
You can modify the list of attributes and elements allowed in the Rich Text Area (see Ram's answer) but keep in mind that you are now allowing these attributes to be used in all Rich Text Fields, and you have to consider the impact of this change to your whole environment. If you're doing this as a quick work-around a design limitation (which is what it sounds like) remember that EDITORS will have to do the same. Structure data shouldn't necessarily be in a RTF, and perhaps certain elements of your output should be handled by a template and not by an editor.
In the \Tridion\web\WebUI\Core\Controls\FormatArea\TcmXhtml\TcmXHTML.config file, update the tag "drop-proprietary-attributes" to be "false":
From: drop-proprietary-attributes: true
To: drop-proprietary-attributes: false
Restart the COM+ and clear the browser cache.
To answer my question, take a look at the following entry in our Knowledge Base:
http://tridion.kb.sdl.com/kb/?ArticleId=4065&source=Article&c=12&cid=19#tab:homeTab:crumb:7:artId:4504
Additionally, you can add other HTML 5 tags in the configuration file mentioned in the article above.
For example, if you wanted to stop the following tags from being removed, add:
new-blocklevel-tags: article aside canvas details figcaption figure footer header hgroup nav output progress section video
new-inline-tags: audio datalist mark meter summary time
new-empty-tags: command source track

how to get page to a specific part of page?

I'm trying to create a page where a user clicks on a link on the left and is taking to a specific section on the page.
Here is example. I've added as much of the code I'm using as I can.
What your trying to do works with the Id or Name attribute.
To elaborate: The anchor tag that your rendering as the target of where your page needs to go should be:
<a id="myId"></a>
or
<a name="myId"></a>
or both..
When you build a link to another part of the page, you need two parts, the link (that you click), and the target (that the page scrolls to).
The link's href attribute needs to start with a '#'. This signifies that the link is 'internal' to the page, and not another, external page.
The target can be either a named anchor <a name="something"></a> or an element with an ID: <div id="something">. You don't include the '#' in the name or the ID.
That's the key part you're missing. Take the '#' off the front of your <a name=""> values and it will work.
Let us know if that works, and we can help you develop this further: There's a lot more polish you could add, but let's get the basics working first.

HTML - Auto navigation with Named Anchors #

well we can have name anchors in our page like the following code
<!---Some HTML Code-->
Mark 1
Mark 2
<!---After some HTML Code-->
<a name="Mark_1">
<!---After some HTML Code-->
<a name="Mark_2">
by doing so we provide links that to scroll up and down a page and all but
I have seen several times on the net that when you click a link and a new page is opened and it contains many subjects but page is scrolled to the desired position.
HOW THAT IS DONE
for example, in stackoverflow's recent activity when we click some activity the relevant page is opened and page is scrolled to that activity out of many... this is just an example.. i don't want how stackoverflow does it... what i want how is this done or is there any name for this technique
You can append a hash with following the the value of the id attribute of any HTML element. See this example: http://en.wikipedia.org/wiki/Html#Attributes
It links directly to the section about "Attributes". In this section it also discribes the technique :)
you need
Mark 1
note the hash
It's doing exactly what you're talking about, a named anchor. So the link looks something like this:
Notice the '#' in the href (... 3550910#3550910), that's the named part. Takes you right where you want to go.
Btw in your example above your link to the named anchor should be
Mark 1
Notice the hash
I think you have it right, but you just need to add the target attribute.
Mark 1
This will open the link in a new page and should position it down the the anchor. I normally use the full URL in the href section though.