The way tags are exported in HTML (without colons!) -- no workaround for searches!

The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Sébastien Vauban]

#+TITLE:     HTML export of tags
#+DATE:      2010-11-25
#+LANGUAGE:  en_US

* Abstract

In HTML exports, one can wanna search on a tag name, via the Web browser's
simple =find= command (=Ctrl-F=).

In the Org file, such a simple search is easily done (let's say from Vim), as
tags are delimited by colon markers. So, just search on ":tagname:".

In the HTML file, there is no such marker. That means, finding a tag can be
really tough.

* Example

Format of the source Org file:

#+begin_src org
** TODO Order a new book                                                 :me:

In the meanwhile, give me something else to read than the AsciiDoc tutorial.
#+end_src

Searching the tag (string) "me" through the HTML output will be matched
4 times:

#+begin_src html
** TODO Order a new book   me
                           ^

In the meanwhile, give me something else to read than the AsciiDoc tutorial.
       ^               ^    ^
#+end_src

* Workaround?

Maybe adding a colon before and after the tag would help?  CSS to the rescue:

#+begin_src
.tag:before {
    content: ":";
}

.tag:after {
    content: ":";
}
#+end_src

Answer is: no! In the HTML display, we now do well see a ":me:", but searches
on that same string fail to find it.

* Solution?

- Really add a colon marker in the exported file (to HTML)

- As well, clearly make a separation between the different tags, instead of
  concatenating them as one big chunck, so that we could put a background
  color that'd be cut between the consecutive tags:

      +----+  +----+  +----+
      |tag1|  |tag2|  |tag3|
      +----+  +----+  +----+

Best regards,
  Seb

-- 
Sébastien Vauban


_______________________________________________
Emacs-orgmode mailing list
Please use `Reply All' to send replies to the list.
Emacs-orgmode-mXXj517/zsQ@public.gmane.org
http://lists.gnu.org/mailman/listinfo/emacs-orgmode

Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Bastien]

Hi Sébastien,

Sébastien Vauban <wxhgmqzgwmuf@spammotel.com> writes:

> - As well, clearly make a separation between the different tags, instead of
>   concatenating them as one big chunck, so that we could put a background
>   color that'd be cut between the consecutive tags:
>
>       +----+  +----+  +----+
>       |tag1|  |tag2|  |tag3|
>       +----+  +----+  +----+

Each tag in the HTML output comes with its own CSS class.

For example:

,----
| * Heading1					       :tag1:tag2:
`----

is exported as

,----
| <div id="outline-container-1" class="outline-2">
| <h2 id="sec-1">Heading1
|   <span class="tag">
|     <span class="tag1">tag1</span>&nbsp;
|     <span class="tag2">tag2</span></span>
| </h2>
`----

You can tweak your .css to visually separate the tags.

HTH,

-- 
 Bastien

Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Sébastien Vauban]

Hi Bastien,

Bastien wrote:
> Sébastien Vauban <wxhgmqzgwmuf-geNee64TY+gS+FvcfC7Uqw@public.gmane.org> writes:
>> - As well, clearly make a separation between the different tags, instead of
>>   concatenating them as one big chunck, so that we could put a background
>>   color that'd be cut between the consecutive tags:
>>
>>       +----+  +----+  +----+
>>       |tag1|  |tag2|  |tag3|
>>       +----+  +----+  +----+
>
> Each tag in the HTML output comes with its own CSS class.
>
> For example:
>
> ,----
> | * Heading1					       :tag1:tag2:
> `----
>
> is exported as
>
> ,----
> | <div id="outline-container-1" class="outline-2">
> | <h2 id="sec-1">Heading1
> |   <span class="tag">
> |     <span class="tag1">tag1</span>&nbsp;
> |     <span class="tag2">tag2</span></span>
> | </h2>
> `----
>
> You can tweak your .css to visually separate the tags.

Thanks for the above. Much appreciated.

>> - Really add a colon marker in the exported file (to HTML)

What about really adding the colon marker, so that one can easily find tags in
the exported file?

Best regards,
  Seb

-- 
Sébastien Vauban


_______________________________________________
Emacs-orgmode mailing list
Please use `Reply All' to send replies to the list.
Emacs-orgmode-mXXj517/zsQ@public.gmane.org
http://lists.gnu.org/mailman/listinfo/emacs-orgmode

Re: Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Jeff Horn]

2011/2/3 Sébastien Vauban <wxhgmqzgwmuf@spammotel.com>:
> What about really adding the colon marker, so that one can easily find tags in
> the exported file?

Use the CSS content property.

    http://www.w3schools.com/Css/pr_gen_content.asp

As an example, check out the links and how they are styled at

    http://almostobsolete.net/

-- 
Jeffrey Horn
http://www.failuretorefrain.com/jeff/

Re: Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Bastien]

Jeff Horn <jrhorn424@gmail.com> writes:

> 2011/2/3 Sébastien Vauban <wxhgmqzgwmuf@spammotel.com>:
>> What about really adding the colon marker, so that one can easily find tags in
>> the exported file?
>
> Use the CSS content property.

I think the column belongs to Org's internal, so I second Jeff's
proposal here.

-- 
 Bastien

Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Sébastien Vauban]

Hi Jeff,

Jeff Horn wrote:
> 2011/2/3 Sébastien Vauban <wxhgmqzgwmuf-geNee64TY+gS+FvcfC7Uqw@public.gmane.org>:
>> What about really adding the colon marker, so that one can easily find tags in
>> the exported file?
>
> Use the CSS content property.
>
>     http://www.w3schools.com/Css/pr_gen_content.asp

If you read my post of [2010-11-25 Thu 11:34] in this thread, you'll see I did
try that, but it's not working for the searches:

>>> * Workaround?
>>>
>>> Maybe adding a colon before and after the tag would help? CSS to the
>>> rescue:
>>>
>>> #+begin_src
>>> .tag:before {
>>>     content: ":";
>>> }
>>>
>>> .tag:after {
>>>     content: ":";
>>> }
>>> #+end_src
>>>
>>> Answer is: no! In the HTML display, we now do well see a ":me:", but
>>> searches on that same string fail to find it.
>>>
>>> * Solution?
>>>
>>> - Really add a colon marker in the exported file (to HTML)

Best regards,
  Seb

-- 
Sébastien Vauban


_______________________________________________
Emacs-orgmode mailing list
Please use `Reply All' to send replies to the list.
Emacs-orgmode-mXXj517/zsQ@public.gmane.org
http://lists.gnu.org/mailman/listinfo/emacs-orgmode

Re: Re: The way tags are exported in HTML (without colons!) -- no workaround for searches!

[Christian Moe]

This bookmarklet finds an Org tags in exported HTML in Firefox, at 
least (just a proof of concept). To try it just copy-paste the whole 
thing into the address field.

javascript:
t=window.prompt("Tag?", "");
e=document.getElementsByClassName(t);
for(i=0;i<e.length;i++)
    {e[i].scrollIntoView(true);
     if(! window.confirm("Next?"))
     {break;}
    }
void(0);

Probably not what you wanted, but fun anyway.
:)

CM


On 2/4/11 9:41 AM, Sébastien Vauban wrote:
> Hi Jeff,
>
> Jeff Horn wrote:
>> 2011/2/3 Sébastien Vauban<wxhgmqzgwmuf@spammotel.com>:
>>> What about really adding the colon marker, so that one can easily find tags in
>>> the exported file?
>>
>> Use the CSS content property.
>>
>>      http://www.w3schools.com/Css/pr_gen_content.asp
>
> If you read my post of [2010-11-25 Thu 11:34] in this thread, you'll see I did
> try that, but it's not working for the searches:
>
>>>> * Workaround?
>>>>
>>>> Maybe adding a colon before and after the tag would help? CSS to the
>>>> rescue:
>>>>
>>>> #+begin_src
>>>> .tag:before {
>>>>      content: ":";
>>>> }
>>>>
>>>> .tag:after {
>>>>      content: ":";
>>>> }
>>>> #+end_src
>>>>
>>>> Answer is: no! In the HTML display, we now do well see a ":me:", but
>>>> searches on that same string fail to find it.
>>>>
>>>> * Solution?
>>>>
>>>> - Really add a colon marker in the exported file (to HTML)
>
> Best regards,
>    Seb
>