For my site, I prefer to use a small arrow graphic in place of the "Back to top" label.

I did this by changing line 193 from:

  return '<div class="toc-filter-back-to-top' . $class . '"><a href="#top">' . $variables['label'] . '</a></div>';

to:

  return '<div class="toc-filter-back-to-top' . $class . '"><a href="#top"><img src="/sites/all/modules/toc_filter/back-to-top.gif"></a></div>';

Also, to move the graphic down to the same position as the h3 subheading, I added "div.toc-filter-back-to-top a:link, div.toc-filter-back-to-top a:visited {padding-top: 1em;}" to my theme's CSS.

Just a suggestion: could you add this as an option?

A side note: my original motivation to do this is that I run a multilingual site, and I found difficulty trying to get the "Back to top" label to show up for translation, and decided to avoid the problem and use a graphic instead.

Thanks!

Comments

jrockowitz’s picture

jrockowitz commented

One immediate issue is that $variables['label'] needs to passed thru the t() function and translatable.

I intentionally did not include a 'back to top' graphic assuming it could easily be added via the theme using something like the below code.

/**
 * Override: Format back to top anchor link.
 */
function phptemplate_toc_filter_back_to_top($variables) {
  $class = (($variables['class']) ? ' ' . $variables['class'] : '');
  return '<div class="toc-filter-back-to-top' . $class . '"><a href="#top"><img src="/sites/all/modules/toc_filter/back-to-top.gif"></a></div>';
}

BTW, The 'back to top' graphic could also be added using CSS.

shadlaws’s picture

shadlaws commented

Good point - it makes more sense to move the change to CSS. On my end, it's done.

Re: getting the string to translate, I still can't figure it out. I should admit that I'm still wrapping my head around how Drupal works with t(), but looking at the documentation in:
http://api.drupal.org/api/drupal/includes%21common.inc/function/t/6

... it seems that the way lines 182 and 193 were configured before was correct, namely that the variable is = t('text') and the output merely includes the whole thing. The documentation for v7 (as opposed to v6) seems to be much less complete for some reason.

That said, there's also a strong likelihood everything you've done is perfect and I simply don't understand t() yet :-)

Thanks!

jrockowitz’s picture

jrockowitz commented

I don't do any multilingual work but the basic concept is every rendered string should always be passed through the t() function which will allow it to be translated using a few related modules.

BTW, the String Overrides module (http://drupal.org/project/stringoverrides) is great example of how the t() function can be used to manipulate text.

shadlaws’s picture

shadlaws commented

Good news: you're correct that the most recent revision sends the string along for translation nicely, and it's now translated into French. No changes needed.

Bad news: although I do indeed get the basic concept of the t() command, some of the nitty-gritty specifics are still fuzzy to me :-). For example, your code seems to be an example of the "incorrect" case in the link I posted above (excerpt given below), and if I modify the code to be like the "correct" case, it stops working.

Thanks!
Shad

-------------------------------
Extraction of translations is done based on the strings contained in t() calls. If a variable is passed through t(), the content of the variable cannot be extracted from the file for translation.

Incorrect:

$message = 'An error occurred.';
drupal_set_message(t($message), 'error');
$output .= t($message);
Correct:

$message = t('An error occurred.');
drupal_set_message($message, 'error');
$output .= $message;
The only case in which variables can be passed safely through t() is when code-based versions of the same strings will be passed through t() (or otherwise extracted) elsewhere.

jrockowitz’s picture

jrockowitz commented

I was not aware of this requirement for the t() function.

I will update my code to use t('Back to top').

Thanks.

jrockowitz’s picture

jrockowitz commented
Status: Active » Fixed

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

marcoka’s picture

marcoka commented
Issue summary: View changes

just for reference. easy fontawesome usage

div.toc-filter-back-to-top {
  margin: 20px 0 5px 0;
  a {

  }
  a:after {
    content: "\f062";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: black;
    padding: 0 0 0 10px;
  }


}