Allow Image Titles to display Special Fonts

Please make it so image titles can display in Japanese language font or so special script like: ō can display. It looks very unprofessional now and our images must have titles and special characters. I don't think this would be too hard to fix!
1 person likes
this idea
+1
Reply
  • Are you referring to the title attribute of an image that most browsers display in a yellow "tooltip" when the cursor hovers over the image? A web site has no control over the font used or any styling of such tooltips, they're built into the browser. If the font the browser uses doesn't include the characters you want displayed, there's nothing to be done.

    Another possibility is you're getting a mix of character encodings (aka text encodings). OpenScholar publishes pages with a Unicode encoding (UTF-8) which is actually the best choice for a platform that will be publishing text in a wide variety of languages. If your browser is set to a specific encoding (like Western ISO-Latin-1) instead of set to auto-detect a page's encoding, that could make characters not covered by the chosen encoding from being displayed correctly.

    I made a test page in which I pasted some japanese I copied from another (UTF-8 encoded) web page into a paragraph and made the Title and Alternate Text for an image. The japanese was displayed correctly until I changed my browser's encoding setting from auto-detect to Western. Copying text from a Shift JIS page and pasting it as the title attribute for an image on the OpenScholar page also displayed correctly, I don't know if the operating system or browser automatically converted the text to UTF-8 or what. The character encoding setting is under the View menu in Safari and Firefox for OS X, I'm not sure where they are in Internet Explorer or Firefox for Windows.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited sad, anxious, confused, frustrated

  • I’m hoping for a resolution soon.
    Hi, I am not talking about the tooltips.
    When you open an image up in the lightbox, the title is displayed all crazy. Otherwise it works fine, but you can't even display "can't" in the title in a light box without it coming out "Can T"
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • Yeah, that's caused by entering text with a character encoding that differs from what the whole uses. Yes, even the apostrophe in can't can be affected if it's the curly version of the character instead of the straight one. Let me see what this community web site does when I paste text from files with different text encodings
    UTF-8 curly: ’ straight: '
    Western ISO curly: ’ straight: '

    curly: ’ straight: '
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • 1
    The problem is that this website is for the Petzold Scroll collection of the Yenching library. We need to title the images properly because we want to make this finding aid a scholarly resource ... The name shows up fine under the thumbnail, and on a scroll over and on the body of the light box it is just the lightbox header that displays the title incorrectly. We don't even need this header but there is no way to turn it off. It looks so unprofessional and we can't do anything to change the image title.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • I can definitely believe that OpenScholar is mishandling character encodings in some part of the tools, the lightbox view for media may not be something written from scratch at Harvard. The extra detail about the problem specifically being in the lightbox view will be helpful to the OpenScholar staff. They'll also want a URL to an example problem page, even if it's not a public site yet, they can access it, unlike the rest of us.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • Well I'm not sure how to link directly to a lightbox view but you can see it with most of the images in the gallery here http://projects.iq.harvard.edu/hylj/g...
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • Here is an image too if that helps clarify the issue
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • Posting the image here definitely helps. In the text in bold at the top, the accented characters in the romanized text are absent, the characters following the accented characters are capitalized, and the Japanese ideograms are completely absent.

    It looks like the bold text at the top comes from the Title set for the image and the text to the right of the image comes from the Description. Since the same Title text is displayed correctly along with the thumbnail images, it appears to be a problem with the code generating the lightbox overlay. The problem text is within a figure element but I wouldn't expect that to be relevant to the problem (I happen to have pointed out the figure element is being used incorrectly in a different context in OpenScholar's design).

    I was able to reproduce the problem in a media gallery on a site I admin. This sample rooms page is publicly accessible but isn't linked to from other pages; I changed the Title of the first image to match what it should be for the image in the screenshot, 日蓮上人立教開宗図 (Nichiren shōnin rikkyō kaishū zu).
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • I brought this bug up with one of the OpenScholar people after the abcd-openscholar meeting today. I hope it gets on the planning roadmap so the bug will be fixed so the image title text displays correctly in every part of the site's layout.

    In the meantime, today's abcd-openscholar meeting was about how to customize themes where I learned a way to at least hide this bad title text. You mentioned that you don't even feel the need to display the text so hiding it should be an acceptable workaround.

    • Go to Build > Layout
    • Site section: choose All Sections
    • Add new widget > choose Embed Media
    • In Add New "Embed Media" Widget, give it a Description, don't give it a Title (since it's not meant to be visually displayed)
    • under File or HTML, click Add button, then click Web
    • In the "URL or embed code of Internet media" text area, write your CSS. In this case, here's the CSS code needed to hide the title displayed above the image when its in the "lightbox" view:
    <style>#cboxContent figure {display:none;visibility: hidden;}</style>
    • Save the code entered then Save the new Embed Widget
    • Back in the Layout view, you'll see your new widget with its Description name in the horizontal scrolling list of widgets at the top (It's in under the All tab and the Media tab).
    • Drag 'n drop the widget's icon to the footer part of the layout then click Save
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned kidding, amused, unsure, silly happy, confident, thankful, excited sad, anxious, confused, frustrated

  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • Hi, I noticed for some reason the "Petzold Scrolls Gallery" is now displaying titles properly, this is great!
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • That's good news. Strangely, The test I made where I gave an image the same title as one of the scrolls, 日蓮上人立教開宗図 (Nichiren shōnin rikkyō kaishū zu) still isn't showing the correct text, the title still looks like it does in your screenshot.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited

  • From 4/23/2015 Accessibility Team review:
    Relative Importance = High
    Suggested Priority = 1

    Curtis Wilcox: This is a level A issue. In media gallery an issue. UTF text not stored correctly.
  • (some HTML allowed)
    How does this make you feel?
    Add Image
    I'm

    e.g. indifferent, undecided, unconcerned sad, anxious, confused, frustrated kidding, amused, unsure, silly happy, confident, thankful, excited