BackToTop

Last modified by slauriere on 2022/06/13 00:07

cogJavascript extension to add nice shortcuts (BackToHome and BackToTop) when you scroll down on a page of the Xwiki site.
TypeXAR
Category
Developed by

Pascal Bastien

Active Installs11
Rating
0 Votes
LicenseGNU Lesser General Public License 2.1

Installable with the Extension Manager

Description

This extension is not actively maintained. Please consider using the Back To Top Extension which implements the back to top feature.

This page add nice shortcuts (BackToHome and BackToTop) when you down scroll page of the XWiki site.

Here some screenshot:
Scrolling down...

Img01_back_to_top.png

... and this 2 shorcuts are display at the left side of the document

Img02_back_to_top.png

This extension contain only one xwiki document: Customization.BackToTop with 2 objects:

  • one StyleSheetExtension to place shortcut
  • and one JavaScriptExtension to display or not the image

To install it simply import the XAR and add a piece of HTML code on a page who's dispayed on all the xwiki site (detail below and on Customization.BackToTop document).

Prerequisites & Installation Instructions

We recommend using the Extension Manager to install this extension (Make sure that the text "Installable with the Extension Manager" is displayed at the top right location on this page to know if this extension can be installed with the Extension Manager). Note that installing Extensions when being offline is currently not supported and you'd need to use some complex manual method.

You can also use the following manual method, which is useful if this extension cannot be installed with the Extension Manager or if you're using an old version of XWiki that doesn't have the Extension Manager:

  1. Log in the wiki with a user having Administration rights
  2. Go to the Administration page and select the Import category
  3. Follow the on-screen instructions to upload the downloaded XAR
  4. Click on the uploaded XAR and follow the instructions
  5. You'll also need to install all dependent Extensions that are not already installed in your wiki

To finalize install: after XAR imported, you must add this HTML code on a page who's dispayed on all the xwiki site.

{{html}}
 <div id="btHomeTop">
   <a class="btHome" tooltiptext="Home" tooltipposition="top" style="display: none;" href="/xwiki/bin/view/Main/"></a>
   <a class="btTop" tooltiptext="Back to Top" tooltipposition="top" style="display: none;" href="#"></a>
 </div>
{{/html}}

You can insert the code by example in the ... header - "HTTP Meta Info" (it is a little bit dirty but footer zone text is too short) : Xwiki Preferences: replace in text zone HTTP Meta Info, this code:

<meta name="revisit-after" content="7 days" />
<meta name="description" content="$escapetool.xml($!tdoc.plainTitle)" />
#set($keywords = "wiki,$!doc.getTags()")

...cut...

<link rel="alternate" type="application/rss+xml" title="Blog RSS Feed" href="$xwiki.getURL('Blog.GlobalBlogRss', 'view', 'xpage=plain')" />
#end

by this one

<meta name="revisit-after" content="7 days" />
<meta name="description" content="$escapetool.xml($!tdoc.plainTitle)" />
#set($keywords = "wiki,$!doc.getTags()")
<meta name="keywords" content="$escapetool.xml($keywords.replaceAll('[|,]', ' ').trim())" />
<meta name="distribution" content="GLOBAL" />
<meta name="rating" content="General" />
<meta name="author" content="$escapetool.xml($!xwiki.getUserName($doc.getAuthor(), false))" />
<meta http-equiv="reply-to" content="" />
<meta name="language" content="$!xcontext.language" />
## We verify that we don't display RSS feeds on the login page since it causes problems if these feeds are
## protected. In addition it makes the login redirect to the feeds page in some cases.
#if($doc.fullName != "XWiki.XWikiLogin")
<link rel="alternate" type="application/rss+xml" title="Wiki Feed RSS" href="$xwiki.getURL('Main.WebRss', 'view', 'xpage=rdf')" />
<link rel="alternate" type="application/rss+xml" title="Blog RSS Feed" href="$xwiki.getURL('Blog.GlobalBlogRss', 'view', 'xpage=plain')" />
#end
<div id="btHomeTop"><a class="btHome" tooltiptext="Home" tooltipposition="top" style="display: none;" href="$xwiki.getURL('Main.WebHome', 'view')"></a><a class="btTop" tooltiptext="Back to Top" tooltipposition="top" style="display:none;" href="#"></a></div>

More customization

To Exclude shortcut from WebHome or Space

Add this condition in JavaScriptExtension object:
if ((XWiki.currentDocument.page != "WebHome") || (XWiki.currentDocument.space == "SpaceWithoutBackToTop")) {
require(['jquery'], function($) {
....
}

To Exclude shortcut from Edit mode

Insert this piece of code in JavaScriptExtension object:

...
jQuery(window).scroll(function() {
       if ((jQuery(this).scrollTop() > offset) && (XWiki.contextaction == "view")){
           jQuery('.btTop').fadeIn(duration);
...

Release Notes

v1.0

Initial version

Get Connected