3

I am trying to develop a plugin/extension for a browser (Firefox or IE or Chrome). The purpose of this is that the plugin/extension should recognize one of my own-custom tags.

Eg: 

<myowntag1>
     ...
     <mysubtag1  ... />
     ...
</myowntag1>

How do I make a browser recognize this using a plugin/extension?

Paul Sweatte
  • 24,148
  • 7
  • 127
  • 265
Nitish Shangari
  • 55
  • 1
  • 6
  • What do you mean "user-defined tag"? Can you explain more about what you are trying to accomplish? – abraham Mar 11 '11 at 06:53
  • I am trying to create my own XML tag, which will be clickable and will take me to more than one links. the project's domain is also involving semantics of web but my problem is not regarding that. Suppose i have a tag CLICK_HERE This is the XML tag. I want to develop a plugin/extension which will enable the browser to recognize this sort of a tag and when one clicks on CLICK_HERE, in 2 tabs both the URLs specified in the sub-tags should open.. – Nitish Shangari Mar 11 '11 at 06:55
  • isn't it way easier to solve this with pure javascript? when clicking on a link in a div, window.open all sibling tags. – ChrisR Mar 11 '11 at 08:02

4 Answers4

2

Your Question reminds me on the thread How XML used and interpreted? - your browser has no api for unknown tags, but it has one for transformation of xml to anything else (including html) named XSLT. The only way I know to do what you want is to write your webpage as XHTML (which is XML and is possible even with HTML5). Be aware that the first line containing the XML Declaration is at its place and add a second line containing the call for a XSLT stylesheet. Write this stylesheet - it must copy everything from the XML/XHTML source page except your self defined tags. These must be transformed into the desired HTML output. This solution works with every major browser, though it may be less complicated to use the transformed HTML from start. To open a new tab you could use the "target" attribute of the link (<a href="http://test.com" target="newtab">Test</a>). This opens a new tab or window depending on your browser preferences.

Community
  • 1
  • 1
Andreas
  • 1,220
  • 8
  • 21
  • Thanks for the help. I am working on these lines only right now. Now I have been asked to use a different approach. I want to have a PLUGIN/EXTENSION to a browser which can do this stuff. This plugin/extension should recognize my tags. Anything on this? – Nitish Shangari Mar 11 '11 at 07:52
  • Instead of defining a complete new element name you could attach a unique id on an element like a span. Write some javascript that locates the element with that id and inserts the desired link elements. Most browser support user defined javascript for plugins. You can even save the sript as bookmark and use it as "bookmarklet". – Andreas Mar 11 '11 at 08:24
1

The idea of being able to embed arbitrary XML (in a user-defined namespace) within an XML page, and have the namespace somehow associated to plug-in code that understands this XML vocabulary, is a dream which many of us have shared. Unfortunately the group defining HTML5 (WHATWG) are moving in the opposite direction: they don't see this kind of extensibility as a requirement, and embedding XML in HTML is becoming harder rather than easier. The only exception is for an XML vocabulary like SVG or MathML that for some reason appeals to the folks on WHATWG and gets endorsed by them.

Michael Kay
  • 156,231
  • 11
  • 92
  • 164
1

Seems like a doable task if you parse tags manually from a javascript. This is how Facebook FBML namespace tags are implemented for example.

Lets say we have this html with custom tag custom:header that should turn into h1:

<html xmlns:custom>
<body>
    <custom:header text="header text"></custom:header>
</body>
</html>

In a content script we can do:

$el = $("custom\\:header");
$el.html($("<h1>").text($el.attr("text")));

(I am using jQuery here). This will turn our tag into:

<custom:header text="header text">
    <h1>header text</h1>
</custom:header>

You can also inject a css file for your custom tags:

custom\:header {
    color:red;
}
serg
  • 109,619
  • 77
  • 317
  • 330
  • how do you get this to work on a normal HTML page that doesnt add the xmlns? with fb:button and fb:like you add some javascript that does something to add this code... what/how? any ideas? I would like to make a company tag that our customers can add to their site and thereby automatically calling our server-module for their website. – BerggreenDK Jun 16 '11 at 09:56
  • @BerggreenDK Sorry I didn't understand the question. I showed an example of a "normal" html, declaring xmlns doesn't make it special. If you want to create a company tag, you need to also provide a javascript that people would include to their pages that would parse your custom tags as I showed. – serg Jun 16 '11 at 15:27
  • @serg yes, okay, I can see the jQuery and how it works. But what I mean is, is the xmlns:custom really neccessary? what if I have more than one? like FB, Yahoo, Microsoft, Google etc. in one page? I think they do it with some javascript an iframe to encapsulate the html xmlns:custom thing – BerggreenDK Jun 20 '11 at 11:39
  • @BerggreenDK You can't just come up with your own html tag, like ``, it will be invalid html (well, unless you parse it on a server side so it never gets to the browser). What you can do is introduce your own namespace `` - this is a valid html, as long as you provide namespace declaration. – serg Jun 20 '11 at 15:27
  • @serg - I dont agree, have you had a look at how Facebook and Google intergrates their framework for Like buttons? Yes, they use JS to parse the clientside, and thats what I want too. But how? Cant get your example to work. – BerggreenDK Jun 21 '11 at 13:22
  • @BerggreenDK I don't understand what you are not agreeing with. I already provided all examples in the answer - how to create your own namespace and parse those tags with javascript, I can't add anything new. If you can't get my example to work then you need to create a new question and provide your code. – serg Jun 21 '11 at 15:16
  • @Serg okay, sorry for bothering you. – BerggreenDK Jun 21 '11 at 21:52
0

Use a custom DTD which is referenced in the doctype, such as the example using mymymy.dtd:

<!DOCTYPE html SYSTEM "mymymy.dtd">

Be aware of the pros and cons before uploading it to a server:

Paul Sweatte
  • 24,148
  • 7
  • 127
  • 265