Standalone Page Buttons

By michal frackowiak

Description

Somehow it might be convenient to hide the default page options and present only selected buttons to the users. The syntax for it is:

[[button type options]]

Where the type is:

• edit
• edit-append
• edit-sections
• history
• print
• files
• tags
• source (view page source)
• backlinks
• talk — works similar as in MediaWiki/Wikipedia, e.g. links to the talk: page (if someone wants it)

Possible attributes are:

• text — alternative text to be displayed
• class — CSS class of the A element
• style — CSS style definition

Code

For some nice "view source" and "print" buttons with icons you can use the following code:

[[>]]
[[button source style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]]
[[button print style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;color: #444"]]
[[/>]]

to get:

view source
print

A very nice set of icons can be found at the Tango Project.

Another Example

The following code creates four buttons with a very brief text description:

[[button edit text="edit" style="background-image: url(http://community.wikidot.com/local--files/nav:side/accessories-text-editor-32x32.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button edit-sections text="sec" style="background-image: url(http://community.wikidot.com/local--files/nav:side/accessories-text-editor-32x32.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button source text="src" style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button print text="prt" style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;color: #444"]]

This set of four buttons will fit nicely into most sidebars:

edit sec src prt

Some speculations

You can use the buttons in a number of ways — e.g. if you want to make clear that your pages are Wiki pages (editable by anyone) — you can place a large edit button somewhere in the side bar. You could also add buttons to the nav:top bar.

With option text="Imprimer" you can translate "print" into French.
With option text=" " the icon appears alone, without text.

Or you could hide the default options at the bottom of each page and present only your hand-made buttons. If you decide to use icons (via the CSS option background-image as shown above) you could ultimately tweak your Wiki! ;-)

---

Thanks to tsangk for this great snippet: conditional-blocks

---

text above inserted with:

[[include :snippets:if START |unique=1|type=equal|var1=%%name%%|var2=conditional-blocks]]
**##red|Thanks to tsangk for this great snippet:##** [[[code:conditional-blocks]]]
[[include :snippets:if END]]

---

---

Other snippets posted by michal frackowiak

MyBlogLog recent visitors - 06 Jun 2021 04:03
Include Any Page - 06 Jun 2021 03:20
Babelfish Translation - 06 Jun 2021 03:14
Collapsible Text Block - 02 Dec 2020 10:24
Todo List - 18 Aug 2014 15:28
Multicolumn Layout - 17 Dec 2012 19:51
Zoho Writer - 16 Feb 2012 01:57
Zoho Sheet - 16 Feb 2012 01:56
Zoho Show - 16 Feb 2012 01:55
Zoho Polls - 16 Feb 2012 01:53
WoW Tooltips - 16 Feb 2012 01:52
Widgetbox Panel - 16 Feb 2012 01:52
Video from Revver - 16 Feb 2012 01:50
Tabs - 16 Feb 2012 01:45
Social Bookmarking - 16 Feb 2012 01:42
Simple Gallery - 16 Feb 2012 01:41
Remember The Milk Todo - 16 Feb 2012 01:39
Recent Changes (mini) - 16 Feb 2012 01:36
Rating Summary - 16 Feb 2012 01:35
Quimble Poll - 16 Feb 2012 01:33
Quikmaps Maps - 16 Feb 2012 01:33
Photobucket Widget - 16 Feb 2012 01:29
Page Previews (Snap.com) - 16 Feb 2012 01:29
Pabpixies Gadgets - 16 Feb 2012 01:28
Meebo me - 16 Feb 2012 01:20
Layout With Tables - 16 Feb 2012 01:19
Instacalc - 16 Feb 2012 01:12
Import the Digg Feed - 16 Feb 2012 01:11
Import a News Feed - 16 Feb 2012 01:10
Google Gadgets - 16 Feb 2012 01:05
Gabbly chat - 16 Feb 2012 01:02
Forum Summary for the Front Page - 16 Feb 2012 01:02
Footnotes - 16 Feb 2012 01:01
Foldable List - 16 Feb 2012 01:01
Flickr Images By Tags - 16 Feb 2012 01:00
Feedburner - 15 Feb 2012 00:53
Extra Side Bar - 15 Feb 2012 00:51
Embed Code From Other Services - 15 Feb 2012 00:50
EditGrid Spreadsheets - 15 Feb 2012 00:49
Cornify - 15 Feb 2012 00:39
Compact Feed Display - 15 Feb 2012 00:35
Center Video - 15 Feb 2012 00:28
Bibliography/Footnotes/Comments Listed in TOC - 15 Feb 2012 00:26
Automatic Sitemap - 15 Feb 2012 00:25
Alexa traffic ratings - 15 Feb 2012 00:23
3d tagcloud - 15 Feb 2012 00:22

---

Rate this solution

If you think this solution is useful — rate it up!

Join Button

bschaffnerunr 10 Apr 2011 02:22

Hi! I'm trying to add a join button to my wiki, but can't get it to work… I can get a link to a tab that allows a user to register, but I'm not able to get it in a pop-up window like I see on other wikis… any suggestions? Thanks

---

Brett Schaffner
UNR Entrepreneurship Club President

Re: Join Button

leiger 10 Apr 2011 08:04

Hey bschaffnerunr,

You are using this code:

To join, simply click [*https://www.wikidot.com/default--flow/login__CreateAccountScreen?originSiteId=311313&openerUri=http://unreclub.wikidot.com here.]

It's probably better to use the Join module directly, because that means existing Wikidot users can join your site as well!

To join, simply click [[module Join button="here" class="non-existent"]].

By using some class that doesn't exist, the button's default CSS won't be applied and you'll be left with a plain link. Therefore, it should look the same as you currently have it on your page.

Hope that helps.

And please post a link to your site to help us out… so we don't need to go searching for it :)

---

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server | NEW: Wikiroo, backup tool (in development)

Re: Join Button

bschaffnerunr 10 Apr 2011 16:28

Thanks for getting back to me, leiger, but I put in this code and it didn't work. Instead, it just literally puts [[module Join button="here" class="non-existent]]. Any ideas?

Sorry about the link… I forgot…

https://unreclub.wikidot.com/

---

Brett Schaffner
UNR Entrepreneurship Club President

Re: Join Button

leiger 11 Apr 2011 11:32

Hmm, it's a module, so it must need to be on a new line. I forgot about that.

Try this?

To join, simply click \
[[module Join button="here" class="non-existent"]]

Otherwise, if that doesn't work, you might just have to put the whole thing as a link: (on a new line)

[[module Join button="To join, simply click here" class="non-existent"]]

Note that the Join button disappears if you are signed in and are a member of the site, so to see if it's working you'll have to actually sign out, or use a different browser that you haven't signed into yet (you can have e.g. Internet Explorer signed out, and Mozilla Firefox signed in).

You might also want to consider the default appearance… but looking at the link you have I think you've already done this before? (in this code, I removed the custom CSS class)

[[module Join button="To join, simply click here"]]

Edit: Definitely try the default appearance first, if you haven't yet (that last code block) - as that will be what most other wikis are using. If you don't like it's appearance we can help you to change that too :)

---

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server | NEW: Wikiroo, backup tool (in development)

Last edited on 11 Apr 2011 11:33 by leiger Show more

I put this in a div class for more control

VastOne 06 Nov 2010 19:37

I use this on my site in the Top Menu and wanted to share how I used a div class to manipulate exactly where I wanted them.

[[div class="noprint" style="position:absolute; top:21px; right: 50;  margin: 0px; text-align:right;z-index:900;"]]
[[button edit text="edit" style="background-image: url(http://community.wikidot.com/local--files/nav:side/accessories-text-editor-32x32.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button edit-sections text="sec" style="background-image: url(http://community.wikidot.com/local--files/nav:side/accessories-text-editor-32x32.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button source text="src" style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]] [[button print text="prt" style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;color: #444"]]
[[/div]]

Example here at Guayadeque Wiki

---

Recent Builds

Conky-PitStop

Last edited on 06 Nov 2010 22:38 by VastOne Show more

Backlinks without clicking

WikiKrag 27 Apr 2009 15:06

I think I found what I was looking for over here: http://www.wikidot.com/doc:backlinks-module
I' leaving my original question here in case anyone else ends up here with the same question. Feel free to delete it if that's more appropriate, thanks.

Hello, I'm trying to display in a page the list of pages that link to it. In essence, the same list displayed when I click the
Options > Backlinks button.
For this, I am using
[[button backlinks text="Click here to get the list of backlinks"]]
However, I'd love to be able to display the list without requiring the user to click on the button.
Also, are there ways I can customize the result produced by clicking the backlinks button (e.g.: the "Other pages that
depend on this page" text at the top of the backlinks list, perhaps its position, and so on) ?

Last edited on 27 Apr 2009 15:20 by WikiKrag Show more

ms0815 03 Mar 2009 15:16

I'd also love to see the parent button added to the list.

Does it have for PARENT button?

xenogew 14 Jun 2008 04:45

I want to use it because it frequency use for my wiki.

buttons for links to pages

ethical patriot 28 Jun 2007 20:24

Hello,

I'd quite like to use buttons (i.e. clickable images) to link to pages in my wiki, this is to increase accessibility for dyslexics and speakers of other languages.

There doesn't seem to be a type for that.

I'm stuck with just putting text links underneath images, and the " _ " option in tables doesn't seem to work.

Jack

Re: buttons for links to pages

leiger 12 Aug 2008 01:12

Try this:

[[>]]
[[button source style="background-image: url(http://www.wikidot.com/local--files/files/view-source.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px; color: #444"]]
[[button print style="background-image: url(http://www.wikidot.com/local--files/files/document-print.png); background-repeat: no-repeat; background-position: bottom right; padding-right: 20px;color: #444"]]
[[/>]]

Then alter as needed.

• Replace the url parameter of background-image with the url of your image.
• If you only want images and no text, replace the text parameter with text=" "

---

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server | NEW: Wikiroo, backup tool (in development)

Adding a discussion button

Carlitox 22 Jun 2007 16:59

I'm trying to add the discuss button, but keep getting a "The button type is not recognized" error.
What's the type of the discuss button?

Re: Adding a discussion button

leiger 12 Aug 2008 01:09

talk

---

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server | NEW: Wikiroo, backup tool (in development)

Last edited on 12 Aug 2008 01:09 by leiger Show more

Non user-friendly error messages with a page being created

gerdami 28 Jan 2007 10:49

Thanks for these buttons.

However, I got non user-friendly error messages when using buttons on a page being created.
Consider this page:

The page does not (yet) exist.
The page hhhhhh you want to access does not exist.
* create page

Error was (when using button print on left side):

A nasty error has occurred. If the problem repeats, please fill (if possible) a bug report.
exception 'ProcessException' with message 'No such page' in /var/www/www.wikidot.com/wikidot/php/screens/PrinterFriendly.php:32 Stack trace: #0 /var/www/www.wikidot.com/wikidot/php/utils/WikiFlowController.php(189): PrinterFriendly->render(Object(RunData)) #1 /var/www/www.wikidot.com/wikidot/web/index.php(85): WikiFlowController->process() #2 {main}

Also, button types [[button edit-append]] , [[button edit-sections]] were not recognized.

---

gerdami - Visit Handbook en Français - Rate this howto:import-simple-excel-tables-into-wikidot up!

Re: Non user-friendly error messages

michal-frackowiak 19 Feb 2007 23:08

This is fixed now.

---

Michał Frąckowiak @ Wikidot Inc.
Visit my blog at michalf.me

Re: Non user-friendly error messages

vada 27 Mar 2007 11:46

how about go-top go-home buttons? I can't add them - they are not recognized or maybe I'm doing something wrong

Re: Non user-friendly error messages

leiger 20 Jan 2008 09:49

go-top and go-home are not recognized. Look at the list above for the possibilities, or they are here:

• edit
• edit-append
• edit-sections
• history
• print
• files
• tags
• source
• backlinks
• talk

---

~ Leiger - Wikidot Community Admin - Volunteer
Wikidot: Official Documentation | Wikidot Discord server | NEW: Wikiroo, backup tool (in development)