template:bootstrap3
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revisionNext revisionBoth sides next revision | ||
| template:bootstrap3 [2017-04-04 15:03] – [Pagetools: option for no pagetools on start page] mburnicki | template:bootstrap3 [2019-05-23 00:06] – lotar | ||
|---|---|---|---|
| Line 5: | Line 5: | ||
| author | author | ||
| email : giuseppe.diterlizzi@gmail.com | email : giuseppe.diterlizzi@gmail.com | ||
| - | lastupdate_dt | + | lastupdate |
| - | compatible | + | compatible |
| depends | depends | ||
| conflicts | conflicts | ||
| Line 27: | Line 27: | ||
| ===== Features ===== | ===== Features ===== | ||
| - | * HTML5 | + | * HTML5 and CSS3 |
| * Responsive | * Responsive | ||
| * Bootstrap 3.x based template | * Bootstrap 3.x based template | ||
| - | * Different themes for namespaces or pages | ||
| * Glyphicons and FontAwesome icons | * Glyphicons and FontAwesome icons | ||
| * AnchorJS support | * AnchorJS support | ||
| + | * Typeahead support | ||
| * High customizable via the configuration manager | * High customizable via the configuration manager | ||
| * Many html and DokuWiki hooks | * Many html and DokuWiki hooks | ||
| - | * Sidebar support (**left** or **right** position) | + | * Sidebar support ( left and/or right ) |
| - | * Right Sidebar support | + | * [Bootswatch](https:// |
| - | * Many themes made from [[https:// | + | * Theme switcher |
| - | * Theme switcher | + | |
| * Cookie Law Banner Notice | * Cookie Law Banner Notice | ||
| * Google Analytics integration | * Google Analytics integration | ||
| + | * Avatar support for Gravatar, Libravatar and Office365 | ||
| ==== Includes ==== | ==== Includes ==== | ||
| Line 47: | Line 47: | ||
| * Glyphicons and FontAwesome icons | * Glyphicons and FontAwesome icons | ||
| * Anchor.JS | * Anchor.JS | ||
| + | * Typeahead | ||
| See the [[#Visual Tour|visual tour]]. | See the [[#Visual Tour|visual tour]]. | ||
| Line 74: | Line 75: | ||
| * [[: | * [[: | ||
| * [[: | * [[: | ||
| + | * [[: | ||
| === Requested Plugin Integration(s) === | === Requested Plugin Integration(s) === | ||
| Line 84: | Line 86: | ||
| * Chinese | * Chinese | ||
| + | * Czech | ||
| * French | * French | ||
| * German | * German | ||
| * Hungarian | * Hungarian | ||
| + | * Indonesian | ||
| * Italian | * Italian | ||
| * Japanese | * Japanese | ||
| * Korean | * Korean | ||
| * Norwegian | * Norwegian | ||
| + | * Persian | ||
| * Polish | * Polish | ||
| * Portuguese | * Portuguese | ||
| Line 106: | Line 111: | ||
| Refer to [[: | Refer to [[: | ||
| - | ===== Configurations | + | ===== Guide ===== |
| - | The template can be widely configured via the [[:plugin:config|Configuration Manager]] or manually edit the ''< | + | * [[template:bootstrap3:config|Configurations]] |
| + | * [[template:bootstrap3: | ||
| + | * [[template: | ||
| + | * [[template: | ||
| - | <code .php> | ||
| - | $conf[' | ||
| - | </ | ||
| - | |||
| - | (This adds a button to turn on / off fluid layout. See the fluidContainerBtn option below.) | ||
| - | |||
| - | ==== Theme ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Sidebar ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Navbar ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Semantic ==== | ||
| - | |||
| - | Adds Schema.org markup to enable basic support for semantic data. For full support use the [[: | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Layout ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== TOC ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Discussion ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Cookie Law ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | The Cookie Law Banner Notice add a cookie called '' | ||
| - | |||
| - | **JavaScript Snippet:** | ||
| - | |||
| - | <file javascript> | ||
| - | if (DokuCookie.getValue(' | ||
| - | // Your JS code (eg. in userscript.js or in 3th-party plugin) | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | **PHP Snippet:** | ||
| - | |||
| - | <file php> | ||
| - | if ( ! (get_doku_pref(' | ||
| - | || get_doku_pref(' | ||
| - | // Your PHP code (eg. in 3th-party plugin) | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | ==== Google Analytics ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Browser Title ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | |||
| - | ==== Page ==== | ||
| - | |||
| - | ^ Option ^ Description ^ Default Value ^ | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | | '' | ||
| - | |||
| - | ===== Customize the theme ===== | ||
| - | |||
| - | To customize the theme, edit your '' | ||
| - | |||
| - | Bootstrap3 theme provides a special class and attribute in ''< | ||
| - | |||
| - | === Styling the theme === | ||
| - | |||
| - | <code css> | ||
| - | /** Vanilla Bootstrap Theme */ | ||
| - | |||
| - | body.default .page-header { | ||
| - | font-weight: | ||
| - | } | ||
| - | |||
| - | |||
| - | /** Optional Bootstrap Theme */ | ||
| - | |||
| - | body.optional .img-responsive { | ||
| - | display: inline-block; | ||
| - | } | ||
| - | |||
| - | |||
| - | /** Custom Bootstrap Theme */ | ||
| - | |||
| - | body.custom .btn-success { | ||
| - | background-color: | ||
| - | } | ||
| - | |||
| - | |||
| - | /** Lumen - Bootswatch.com theme */ | ||
| - | |||
| - | body.lumen .navbar-default { | ||
| - | background-color: | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | === Styling the page or namespace === | ||
| - | |||
| - | <code .css> | ||
| - | |||
| - | /** Single page (eg. " | ||
| - | |||
| - | body[data-page-id=" | ||
| - | background-color: | ||
| - | } | ||
| - | |||
| - | |||
| - | /** Namespace (eg. " | ||
| - | | ||
| - | body[data-page-id^=" | ||
| - | background-color: | ||
| - | } | ||
| - | </ | ||
| - | |||
| - | For more information see [[https:// | ||
| - | |||
| - | |||
| - | ==== Change the logo and favicon ==== | ||
| - | |||
| - | The Logo, Favicon and Apple Touch (bookmark) icons are referenced from multiple locations. The default icons (DokuWiki logo) provided by the template can easily be changed by uploading new image files to the given locations using the **Media Manager** popup or **Fullscreen Media Manager**. | ||
| - | |||
| - | === The site's logo === | ||
| - | |||
| - | * '': | ||
| - | * '': | ||
| - | |||
| - | === The favicon === | ||
| - | |||
| - | * '': | ||
| - | * '': | ||
| - | |||
| - | === The bookmark icon used by Apple and Android devices === | ||
| - | |||
| - | * '': | ||
| - | * '': | ||
| - | |||
| - | ==== Namespaced theme ==== | ||
| - | |||
| - | Since v2016-12-12 release it's possible use different Bootstrap theme for namespace. To enable this feature enable '' | ||
| - | |||
| - | **NOTE**: To manage '' | ||
| - | |||
| - | < | ||
| - | ns: | ||
| - | </ | ||
| - | |||
| - | Example: | ||
| - | |||
| - | < | ||
| - | wiki | ||
| - | wiki: | ||
| - | playground | ||
| - | </ | ||
| - | ===== Available Hooks ===== | ||
| - | |||
| - | ==== HTML Hooks ==== | ||
| - | |||
| - | All files must be located in the template directory ('' | ||
| - | |||
| - | ^ File Name ^ Position of included HTML ^ | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | ^ '' | ||
| - | |||
| - | :!: ** NOTE for navbar.html ** | ||
| - | |||
| - | This [[https:// | ||
| - | |||
| - | If you want to add only the Home-Page link, set the '' | ||
| - | |||
| - | ==== DokuWiki hooks ==== | ||
| - | |||
| - | You can customize various parts of your page by creating simple DokuWiki " | ||
| - | |||
| - | ^ Page name ^ Description ^ Per namespaces ^ | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | | '': | ||
| - | |||
| - | |||
| - | === Navbar === | ||
| - | |||
| - | This " | ||
| - | |||
| - | This is an example: | ||
| - | |||
| - | {{ http:// | ||
| - | * [[: | ||
| - | * DokuWiki | ||
| - | * [[: | ||
| - | * [[: | ||
| - | * [[: | ||
| - | * [[: | ||
| - | ~~NOCACHE~~ | ||
| - | </ | ||
| - | |||
| - | |||
| - | :!: It is possible to create different navbars for every namespaces with the same behavior of sidebar page. | ||
| ===== Sites using this Template ===== | ===== Sites using this Template ===== | ||
| - | * http:// | + | * http:// |
| - | * http:// | + | |
| - | * http:// | + | |
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| - | * http:// | + | * https:// |
| * [[http:// | * [[http:// | ||
| - | * https:// | ||
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| - | * http:// | ||
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| - | * http:// | ||
| * https:// | * https:// | ||
| * https:// | * https:// | ||
| * http:// | * http:// | ||
| * http:// | * http:// | ||
| + | * http:// | ||
| + | * https:// | ||
| + | * https:// | ||
| + | * https:// | ||
| + | * https:// | ||
| + | * http:// | ||
| + | * https:// | ||
| + | |||
| ===== Visual Tour ===== | ===== Visual Tour ===== | ||
| Line 479: | Line 179: | ||
| === Known Bugs and Issues === | === Known Bugs and Issues === | ||
| - | |||
| - | |||
| === ToDo/Wish List === | === ToDo/Wish List === | ||
| Line 486: | Line 184: | ||
| ===== FAQ ===== | ===== FAQ ===== | ||
| - | ===== Discussion ===== | ||
| - | |||
| - | ==== I want to use the landingpage function. Can you briefly describe how I can use them. It is not clear what is meant by regex and where I have to take the page. Thank you ==== | ||
| - | |||
| - | The landing page is a special page without a sidebar (left and right) and the panel around the content. The landing page is enabled when the current page matches with the doku pages stored in the config '' | ||
| - | |||
| - | * '' | ||
| - | |||
| - | ---- | ||
| - | |||
| - | Thanks for the great template. What I like best that the toolbox is supported with Plugins. my page that I run here with the template: [[http:// | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== Is there a way to add H3, H4 and even H5 to the TOC? Currently only H1 and H2 is viewable in the TOC. ==== | ||
| - | |||
| - | The H3~H5 tags are collapsed in TOC and are displayed only during the scroll of the page. This behavior save much space in TOC especially with page with more sections (eg. : | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== Can I remove the filename " | ||
| - | |||
| - | The function '' | ||
| - | |||
| - | The correct way to remove the page info, is change value to '' | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== Is there an easy way to use Google CSE (google.com/ | ||
| - | |||
| - | To implement the Google CSE see this steps (adapted from [[https:// | ||
| - | |||
| - | Copy and paste in your '' | ||
| - | |||
| - | <code javascript> | ||
| - | < | ||
| - | (function() { | ||
| - | var cx = ' | ||
| - | var gcse = document.createElement(' | ||
| - | gcse.type = ' | ||
| - | gcse.async = true; | ||
| - | gcse.src = (document.location.protocol == ' | ||
| - | '// | ||
| - | var s = document.getElementsByTagName(' | ||
| - | s.parentNode.insertBefore(gcse, | ||
| - | })(); | ||
| - | </ | ||
| - | </ | ||
| - | |||
| - | Select and save the **two-page** layout in the Google CSE Control Panel. On one page, implement a stand-alone search box, changing the '' | ||
| - | |||
| - | Copy and paste this code in the sidebar (or in one of many hooks or in your preferred location): | ||
| - | |||
| - | <code html> | ||
| - | < | ||
| - | </ | ||
| - | |||
| - | |||
| - | To implement a stand-alone search results page, create a new DokuWiki page (eg. search) and paste the results code snippet into your results page: | ||
| - | |||
| - | <code html> | ||
| - | < | ||
| - | </ | ||
| - | |||
| - | Now you can trigger search results on this page by passing a '' | ||
| - | |||
| - | http:// | ||
| - | |||
| - | :!: NOTE: If you use the ''< | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== How can one add text in the cookies banner? === | ||
| - | |||
| - | :?: How can I add something like: "this site is using cookies, ... you have to accept..." | ||
| - | |||
| - | Adding text in the cookie banner is simple: | ||
| - | |||
| - | * Enable the flag '' | ||
| - | * Create a new DokuWiki page with a text "this site is using cookies, ... you have to accept..." | ||
| - | * Optional, create a policy page (the default DokuWiki page is '': | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== Display license ==== | ||
| - | |||
| - | Hello, thanks for your awesome template. I would like everyone passing by to see the license of the wiki, in other template is pretty visible at the bottom, is there a way to enable it with this template too or I should tweak around? | ||
| - | --- [[user> | ||
| - | |||
| - | ---- | ||
| - | |||
| - | ==== browserTitle - adding some part of namespace ==== | ||
| - | :?: Hi. Is there any way to add some part of namespace to < | ||
| - | I have dozens of pages witch same ID but in different namespaces. It would be nice to display in page title mayby two last namespaces. | ||
| - | |||
| - | Example:\\ | ||
| - | Now: | ||
| - | < | ||
| - | http:// | ||
| - | http:// | ||
| - | </ | ||
| - | Nicer it would look like this: | ||
| - | < | ||
| - | http:// | ||
| - | http:// | ||
| - | </ | ||
| - | --- [[user> | ||
| - | |||
| - | |||
| - | Thank You for this functionality. I like it. | ||
| - | There is one bug. When first header contains sign ' (#39), e.g. | ||
| - | ====== I'm very old ===== | ||
| - | then its printed twice | ||
| - | < | ||
| - | I'm change ' (#39) to ` (#96) | ||
| - | |||
| - | --- [[user> | ||
| - | |||
| - | ---- | ||
| - | |||
| - | |||
| - | ==== Sidebar on mobile won't stay open ==== | ||
| - | |||
| - | // | ||
| - | First of all, this is a really impressive template. Thank you! | ||
| - | On mobile phones (both iPhone and Android), my sidebar is especially long and won't stay open. When a user opens the sidebar and scrolls up/down, the sidebar automatically disappears. Is there a way to fix this? If it helps, my site is [[http:// | ||
| - | |||
| - | > This behavior iwas fixed in the v2016-01-25 release of template ([[https:// | ||
| - | > --- [[user> | ||
| - | |||
| - | |||
| - | ==== List of used fonts and where to change them ==== | ||
| - | |||
| - | Is there a list of used fonts and where they are defined? | ||
| - | |||
| - | Just a table as the one below would be fine. | ||
| - | ^FontNameInCSS ^description ^FontFamilyName ^FileName ^ | ||
| - | |< | ||
| - | |…|…|…|…| | ||
| - | |||
| - | E.g. I tried to change the edit window font face and size but defining the //''< | ||
| - | |||
| - | <file css / | ||
| - | … | ||
| - | dokuwiki textarea.edit, | ||
| - | | ||
| - | | ||
| - | } | ||
| - | … | ||
| - | |||
| - | </ | ||
| - | |||
| - | --- [[user> | ||
| - | |||
| - | ==== Simplifications ==== | ||
| - | |||
| - | I'm sorry, but the last time I really got into PHP is long ago. I'd just like to: | ||
| - | - stop the edit/last revisions/ | ||
| - | - remove the bottom footer | ||
| - | |||
| - | But I just don't understand it. Any help is greatly appreciated! | ||
| - | |||
| - | --- clemo // | ||
| - | |||
| - | Hi, for the first question, can your send a screenshot of your page (via email or via GitHub issue) ? | ||
| - | For remove the bottom footer elements (eg. badges, pageinfo) see '' | ||
| - | |||
| - | --- [[user> | ||
| - | |||
| - | Hi, since the **v2016-12-12** template version it's possible disable the page-tools animation via '' | ||
| - | |||
| - | --- [[user> | ||
| - | |||
| - | ==== Easy way to disable pagetools animation ==== | ||
| - | The pagetools animations are a little bit bugged. Hover over the lowest button and moving up to the one above works. But moving the mouse from a upper button to lower button triggers the animations two times in a row. | ||
| - | Now i added another color at hover in css and would like to disable the animations completely. | ||
| - | Is there a more elegant way to disable the animations than removing the function in template.js in row 617ff (developer branch)? | ||
| - | |||
| - | --- bobdeh // | ||
| - | |||
| - | Hi, since the **v2016-12-12** template version it's possible disable the page-tools animation via '' | ||
| - | |||
| - | --- [[user> | ||
| - | |||
| - | ==== Easy way to add a link the the Navbar back to the parent website Home page? ==== | ||
| - | |||
| - | For a moment I thought I had found the answer with " | ||
| - | I'd really like to have a " | ||
| - | That would be really helpful. | ||
| - | Thank you. | ||
| - | |||
| - | ==== Does not work on latest Dokuwiki ==== | ||
| - | |||
| - | 2017-02-19a " | ||
| - | > didn't notice that. Works perfectly for me. By the way, you can report on [[https:// | ||
| - | |||
| - | > I suggest: | ||
| - | > | ||
| - | > - Fix file permission (specially for the new jQuery/ | ||
| - | > - Flush Cache (DokuWiki + Browser cache) | ||
| - | > - Touch configuration file (or change an option in Configuration Manager) | ||
| - | > | ||
| - | > --- [[user> | ||
| - | |||
| - | ==== Pagetools: option for no pagetools on start page ==== | ||
| - | |||
| - | Is there any way of disabling pagetools on the " | ||
| - | |||
| - | As far as I can see you can go to the Admin / Configuration page, lookup | ||
| - | < | ||
| - | tpl»bootstrap3»showPageTools | ||
| - | Enable the DokuWiki-style Page Tools | ||
| - | </ | ||
| - | and change the associated selection box to '' | ||
| - | |||
| - | However, if you do change only this setting then there' | ||
| - | < | ||
| - | tpl»bootstrap3»showTools | ||
| - | Display Tools in navbar | ||
| - | </ | ||
| - | to the same setting as above. | ||
| - | |||
| - | Unfortunately this doesn' | ||
| - | |||
| - | It would be nice if there was a global DW configuration option where you could disable these tools menus, as well as prevent users from viewing the page source, older revisions of the page, etc., and wouldn have to make these settings in a specific theme template like bootstrap3. | ||
| - | |||
| - | --- [[user> | ||
template/bootstrap3.txt · Last modified: 2024-03-16 12:38 by michaelsy