Formatting "TM" in page name property

Permalink
I have a client who wants a little superscript "TM" to appear in an Auto-nav block where the page name property is a trademarked product.

Can it be done?

siteadvice
View Replies: View Best Answer
whimsmedia replied on at Permalink Reply
whimsmedia
Shouldn't be a problem.

The HTML bit for that is:

whimsmedia replied on at Permalink Reply
whimsmedia
Obviously that turned into the TM sign. I meant to write:

ampersand "trade" semicolon (no spaces)
™
siteadvice replied on at Permalink Reply
siteadvice
Ah, okay, it does work with the TM, you're right.

My problem is with the equivalent registered trademark: ®

Unlike the TM symbol, ® doesn't appear as superscript, but that's how the client wants it. Is there any way to style something within a page name in auto-nav?
TooqInc replied on at Permalink Reply
TooqInc
I was able to figure this out.

First, you'll need to add this to your CSS file:
.sup {position: relative; bottom: 0.5em; font-size: 0.8em;}


Then, for each use on the site (I know, not ideal) you have to tag the the superscript as follows:

<span class="sup">®</span>


Most symbols seem to work, but this was the only fix that I found for the registered mark.
Hope that helps.
siteadvice replied on at Permalink Reply
siteadvice
Hi myTooq

This didn't work for me.

When I try to enter...

<span class="sup"> etc


...into the Name field in the Page Properties, Concrete5 removes the styling, so all I am left with is the unformatted symbol.

I tested it in Concrete5 v5.4.2.2 - what about you? Perhaps the latest version allows HTML/style code in the Page Properties field...?
TooqInc replied on at Permalink Reply
TooqInc
I had success in 5.5
I should also point out that in the TinyMCE editor, I jumped over using the HTML toggle to add the tags.
Make sure you clear your cache too.
siteadvice replied on at Permalink Reply
siteadvice
Hi again myTooq

I am not sure where you are adding this code.

The problem I'm trying to solve is styling a registered trademark symbol in a page name in the Autonav block.

As far as I know, the Autonav block is populated solely from the list of page names in page properties. These names are plain text and the form won't allow you to enter HTML. There is no option to enter content into this field via Tiny MCE.

Have you found another way to do this other than using the page properties input form?
weyboat replied on at Permalink Best Answer Reply
weyboat
Another way would be to create your trademark as a png image and position the image using "absolute" and "z-index" css positioning,
If you need this on every page of your web, you could hard code into your template wrapped in a div...
siteadvice replied on at Permalink Reply
siteadvice
That's a pretty good idea, weyboat. Feels like "cheating" a little bit (!) and of course it's bound to throw up problems of its own, especially if we ever want to change the list of pages in the Auto-nav. But it's the best solution so far unless myTooq can explain the other method (s)he suggested.
weyboat replied on at Permalink Reply
weyboat
Hmmm not sure about this but take a look at one of my siteshttp://www.meer-kat.com and see if that is what you are trying to achieve?
siteadvice replied on at Permalink Reply
siteadvice
Not quite, weyboat - this is fine, but in this instance the client wanted the registered trademark symbol to be in "superscript" (not realising, of course, that there really isn't any such thing in HTML/CSS!)
Mainio replied on at Permalink Reply
Mainio
Why don't you just try setting up the vertical align:
.sup {vertical-align: super; font-size: 0.8em;}


http://www.w3schools.com/cssref/pr_pos_vertical-align.asp...
siteadvice replied on at Permalink Reply
siteadvice
Hi Mainio and thanks for your response.

Unless I am missing something that you and myTooq know about and I do not, then there is no way to use any sort of styling on a Page Name element in Page Properties - it is a plain text field.
Mainio replied on at Permalink Reply
Mainio
Oh, you want to use it in the browser tab title? Then, that will not work but neither will an image.

If you're using the label somewhere in your page, I'd create a separate title attribute for the page that could override the default page name in case it's defined.
autotheist replied on at Permalink Reply
This is very simple
<sup>®</sup>
. The only problem I have found with it is that it tends to increase the line spacing above the line you put the registration mark. Also, the registration mark is larger in Firefox than it is in IE which has the effect that the line spacing in Firefox is noticeably bigger between lines and the registration mark is almost unreadable as a registration mark in IE.