Table of contents on mobile

[Arthaey]

I just installed this skin, and generally I'm quite impressed with it. Thank you for making MediaWiki look clean and modern! :)

I noticed that it doesn't show the Table of Contents sections on mobile, though. Is there a configuration option to easily enable that?

[thaider]

Hi. The sidebars' content will move to the bottom of the page on small screens. Can you find the TOC down there or does it really disappear?

You would have to write your own PageRenderer in order to move the TOC to the top of the page. You should however consider that you will fill up the most precious screen estate. You should probably add some collapse functionality – something that is not currently provided by Tweeki.

[Arthaey]

Ah, yes, I do see it… all the way down at the end of the page. Unfortunately that means the more I want to use the ToC to help (because the page is longer), the further away the ToC is located.

I don't really want it above the content like with the default-Wikipedia skin, either, though.

What I'd looked for was the section names in the hamburger menu. Could a custom renderer place them there?

[thaider]

This is actually a little bit more complicated. If you're familiar with CSS, PHP, and Javascript you could try to implement a solution following Tweeki's approach. That means:

• create a new Special Navigational Element similar to Tweeki's TOC
• place your newly created element in the navbar
• use some custom Javascript to move the TOC (see how Tweeki does it) and probably adapt the markup
• use some custom CSS for styling (if necessary)

Let me know if you want to give it a try and need more specific hints...

[Arthaey]

My day job is software engineering, so while I'm new to MediaWiki and PHP, I'm not at all new to web dev in general. :)

I'll give it a stab when I have some free time. Thank you for the pointers to help me get started!

[filipemosca]

Hi guys. I'm new to mediawiki and I'm loving this theme. I also have this problem because I would prefer the TOC to be displayed at the beginning of the article on smartphones.

On my old site I put a floating button in the corner of the screen that when clicked moved the screen of the smartphone to the TOC. It was a simple html link ( tag). How could I do something similar with Tweekie?

Thus, at any point in the article the reader could easily jump back into the TOC.

[iubito]

Hi, I bumped into the same problem. The solution could be very easy: an option to instert the sidebar-left BEFORE content in the HTML flow. In include/TweekiTemplate.php, renderPage function

this option would move the if block if( !$skin->checkEmptiness( 'sidebar-left' ) ) before the content div <div id="contentwrapper"

I did it in the file without creating new template or element, and it worked perfectly. An option "sidebar left inserted before content" will solve the problem, then just put the TOC in sidebar-left

[sneakers-the-rat]

Bumping this, seems very odd to me to put a TOC on the bottom on mobile. I get the screen real estate thought, but the purpose of a TOC is to be able to jump to different sections in a document, and if you have to scroll to the bottom to do that then it sort of defeats the purpose, no? agreed that just putting it up at the top whole hog uses a lot of space, but as said previously collapsible/slideable menus and navigation would work and is pretty common design at this point. Never want to just wish development labor on people as if it's free, but seems like ^^ wouldn't be too hard to implement?