Support » Plugin: Knight Lab Timeline » Italian Problem

  • Hi all, I’m trying to change the english “B.C.” in italian “a.C.” but, even if I found the files (timeline.js and timeline-min.js) in which is contained I receive back the string always uppercase…
    Is there the possibility to obtain correctly “a.C.”?

    Thank you

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Contributor JoeGermuska


    The capitalization of the “era labels” is governed by the font choice you make. Timeline’s inventor made design choices for some font sets that using the CSS “text-transform: uppercase” made for the best presentation.

    If you don’t want it capitalized, you can either choose different fonts or override the rule for

    .tl-timeline .tl-timenav-slider .tl-timeaxis {
    text-transform: uppercase;

    A crude test suggests that these font sets don’t use the uppercase transformation:


    but you should try them to be sure.

    It’s difficult to point to the location in the Timeline Font CSS where this rule is implemented because of the minification, but the pre-compilation line that is the specific reason you’re seeing it in uppercase is

    I hope this helps. We will also be updating the Italian translation to use ‘a.C.’ as the prefix based on your information, in the next incremental update for TimelineJS.

    Hi Joe, I tried to change the uppercase to lowercase but, as imaginable, nothing changes indeed there is a strange “http error 500”. I tried also to find where the CSS call the font family but, my Version is, and it seems impossible, due to minification, to find the correct place…

    Plugin Contributor JoeGermuska


    It is, admittedly, a little involved. Remember, you could simply choose a different font-family which doesn’t apply the ‘uppercase’ transformation. But if that doesn’t satisfy…

    The typography is loaded from font-choice-specific CSS files which are generated with a LESS compiler. The base files are at

    If you don’t want to set up to do the compilation, you can edit the files directly. As the name suggests, by default, the one you would want to edit is …/css/fonts/font.default.css

    Yes, as a minimized file, it is hard to edit. Use a CSS formatter like to replace the minimized contents of the file with technically equivalent CSS rules that are easier to edit.

    Also, rather than ‘lowercase’ you probably want ‘none’, at least, if you want ‘a.C.’ (lowercase would get ‘a.c.’)

    Hopefully this helps.

    Hi Joe, I tried in so many ways but without result.
    In my custom css I addedd:
    .tl-timeline .tl-timenav-slider .tl-timeaxis {text-transform: none;}
    ane I edited font.default.css
    using some font families you reported but nothing happens…

    Thank you for your kind cooperation

    Hi Joe, at last I solved my problem but I had to modify the following:

    .vco-timeline .vco-navigation .timenav .time .time-interval div {text-transform: none !important;}
    .vco-timeline .vco-navigation .timenav .time .time-interval-major div {text-transform: none !important;}
    .vco-slider .nav-previous .date, .vco-slider .nav-next .date {text-transform: none !important;}

    Probably there is a simplest way but at the moment I found this…
    Please let me know if there is a possibility to simplify it

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Italian Problem’ is closed to new replies.