DokuWiki

It's better when it's simple

User Tools

Site Tools


tips:back_to_top

Back to top links after headers

Why and What

  1. better access to the TOC from anywhere on the page…

Don't create the link “back to top” for header level 1. Create link “back to top” before each title.

:!: The example is written for DokuWiki 2008-05-05 and will not fit directly into recent versions.

Quick & dirty approach

Top Example

[[|Top]] # Links to top of page

So how?

In inc\parser\xhtml.php change the function header by this one :

(line 134)

    function header($text, $level, $pos) {
 
        $hid = $this->_headerToLink($text,true);
 
        //only add items within configured levels
        $this->toc_additem($hid, $text, $level);
 
        // write the header
        $this->doc .= DOKU_LF;
		if($level > 1){
				$this->doc .= html_topbtn2();
		}
		$this->doc .='<h'.$level.'><a name="'.$hid.'" id="'.$hid.'">';
        $this->doc .= $this->_xmlEntities($text);
        $this->doc .= "</a></h$level>".DOKU_LF;
    }

then : create the function “html_topbtn2” under “html_btn” in “inc\html.php”

(line 165)

function html_topbtn2(){
  global $lang;
 
  $ret  = '';
  $ret  = '<a href="#dokuwiki__top" onclick="window.scrollTo(0, 0)" title="'.$lang['btn_top'].'" >'. $lang['btn_top'].' </a>';
 
  return $ret;
}

Top button beside edit button

--- html.php-orig       2008-07-06 04:28:06.241410000 +0200
+++ html.php    2008-07-06 04:40:15.171058000 +0200
@@ -94,6 +94,7 @@

   $secedit  = '';
   $secedit .= '<div class="secedit">';
+  $secedit .= html_topbtn();
   $secedit .= html_btn('secedit',$ID,'',
                         array('do'      => 'edit',
                               'lines'   => "$section",
@@ -115,12 +116,17 @@
     $text = preg_replace_callback('#<!-- SECTION "(.*?)" \[(\d+-\d*)\] -->#',
                          'html_secedit_button', $text);
   }else{
-    $text = preg_replace('#<!-- SECTION "(.*?)" \[(\d+-\d*)\] -->#','',$text);
+    $text = preg_replace_callback('#<!-- SECTION "(.*?)" \[(\d+-\d*)\] -->#','html_topbtn_div',$text);
   }

   return $text;
 }

+function html_topbtn_div ()
+{
+    return '<div class="secedit">'.html_topbtn().'</div>';
+}
+
 /**
  * Just the back to top button (in its own form)
  *

Somewhere else i also rewrite:

$lang['btn_top'] = '['.$lang['btn_top'].']';

I use this with the monobook template, looks nice.

6.7.2008 Peter

Would be good to know what path you refer here. I did not find the right file or section or the file changed heavily in the meantime.

2011-02-18 Taggic

Superseded

:?: Isn't this essentially superseded by the Up Arrow plugin? — Luis Machuca Bezzaza 2009/09/21 19:37

No, adding this code automatically generates a back_to_top link before headers <h2>, <h3>, etc. All except for <h1>.
John 2009/11/4

tips/back_to_top.txt · Last modified: 2013-11-23 17:02 by 86.168.201.186

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki