Template - Bootstrap3 - Anpassung


Datei 'style.ini' anpassen und '*.css'-Dateien hinzufügen

Folgende Dateien in das Verzeichnis '/var/www/10_DW_WERKSTATT/lib/tpl' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen:

icke_nav_reset.css
icke_nav_frame_blau.css
icke_nav_frame_kupfer.css

Datei '../tpl/04-links-wiki-data-bootstrap3/style.ini' editieren und nach dem Abschnitt '; Template styles' folgenden Abschnitt hinzufügen:

; icke-nav-style
../icke_nav_frame_blau        = all
;css/icke_nav_popouts.less    = all
;css/icke_nav_pagetools.css   = all
../icke_nav_reset.css         = all
;css/icke_nav_mobile.css      = allÊ

'Logo' und 'Brand' in 'navbar' sowie 'favicon' anpassen

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl/images' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen::

logo.png
logo_msh.png
favicon.ico

Datei '../tpl/icke_nav_frame_kupfer.css' öffnen und folgenden Abschnitt einfügen:

/*____________  modifikation  - navbar-brand - logo ____________*/


.navbar-header a.navbar-brand {
      padding-top: 20px;
      padding-bottom: 10px;
    }

    #dw__logo {
      margin-left: -15px;
      margin-right: 20px;
      height: 40px !important;
    }

    #dw__title {
      padding-left:0 px;
      display: inline-block;
    }

    #dw__tagline {
      margin-top: 5px;
      font-size: 1.1em;
      display: block;
      line-height: 1em;
      white-space: nowrap;
    }


#dw__admin .dropdown-menu-large {
    width: 730px;
}

Verschieben der 'Such-Maske' von der 'navbar' in die 'sidebar'

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl' kopieren:

tj_navbar-searchform.php

Datei '../tpl/navbar.php' - Zeile 80 - Befehl auskommentieren:

// Search form
// include_once('navbar-searchform.php');

Datei '../tpl/sidebar' öffnen - Zeile 29 - folgende Zeilen einfügen:

<div class="row">
   <?php require_once('tj_navbar-searchform.php'); // TJ search form ?>
</div>

Datei '../tpl/icke_nav_frame_kupfer.css' öffnen und folgenden Abschnitt einfügen:

/*____________ search ____________*/

#dw__search.form-inline div.input-group {
margin-top: -7px;
margin-bottom: 1px;
}

#dw__search.form-inline div.input-group input#qsearch.form-control {
height: 33.5px;
}

form#dw__search.form-inline div.input-group input#qsearch.form-control {
width: 100%;
margin-left: 2px;
}

Anpassung 'Sie befinden sich hier' und 'Zuletzt angesehen'

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl' kopieren:

tj_breadcrumbs.php
tj_youarehere.php

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 69 - Befehl auskommentieren:

<?php // require_once('tpl/breadcrumbs.php'); // TJ?>

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 98 - unterhalb '<article id=dokuwiki__content ...>' Zeile hinzufügen:

<?php require_once(template('tpl/tj_youarehere.php')); // TJ ?>

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 180 - oberhalb von '</article>' folgende Zeile hinzufügen:

<?php  require_once('tpl/tj_breadcrumbs.php'); // TJ?>
</article>

Datei '../tpl/icke_nav_reset.css' öffnen und folgenden Abschnitt einfügen:

/*____________ breadcumbs ____________*/

#dw__breadcrumbs {

margin-top: 10px;
margin-bottom: 10px;

   hr {
    margin: 0px 0;
    margin-top: 3px;
    padding: 0;

border: none;
border-top: 1px solid darkgrey;
color: #fFFFFF;
background-color: #fFFFFF;
height: 1px;
    font-size: 0.9em;
  }

  .breadcrumb {
    background: transparent;
    border: 0 none;
    padding-left: 0px;
    padding-right: 0px;
    /*display: inline;  */
    color: black;
     font-size: 0.8em;
     margin-bottom: 3px;
     margin-left: 5px;
     margin-right: 5px;
  }

.form-control  {
   height: 18px;
   padding-top: 1px;

   padding-bottom: 1px;
   font-size: .3em;
   }

.breadcrumb >  li
{
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
}

}

.breadcrumb > li + li::before {
margin: 0px;

}

/*change breadcrumb separator to raquo symbol*/
.breadcrumb > li + li:before {
     content: "\00BB";
     color: #555555 ;
}

}

'Padding-Bottom' von 'page-content' justieren

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 131 - Befehl auskommentieren und Zeile hinzufügen:

// echo '<div class="dw-content">';
echo '<div class="dw-content" style="padding-bottom: 5px;">' ; // TJ

Fuss-Zeile austauschen

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl' kopieren und Rechte (www-data:www-data, 770) für die Datei setzen::

tj_footer.php

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 189 - Befehl auskommentieren und Zeile hinzufügen:

// Footer DokuWiki page
// require_once('tpl/footer.php');
require_once(template('tpl/tj_footer.php'));  // TJ

Bei Bedarf die Position der Elemente verändern (Rand-Abstände!) ⇒ Datei '…/04-links-wiki-data-bootstrap3/tpl/tj_footer.php' und Zeile 50 editieren.

'Page-Icons' anpassen

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl' kopieren und Rechte (www-data:www-data, 770) für die Datei setzen::

tj_page-icons.php

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 105 - Befehl auskommentieren und Zeile hinzufügen:

// Page icons (print, email, share link, etc.)
// require_once('tpl/page-icons.php'); // TJ 
require_once('tpl/tj_page-icons.php'); // TJ

'Page-Tools' anpassen

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/tpl' kopieren und Rechte (www-data:www-data, 770) für die Datei setzen::

tj_pagetools.php

Folgende Dateien in das Verzeichnis '../tpl/04-links-wiki-data-bootstrap3/images' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen::

page-background.svg
page-gradient.png
pagetools-build.php
pagetools-help-passive-sprite.png
pagetools-home-active-sprite.png
pagetools-home-passive-sprite.png
pagetools-move_main-active-sprite.png
pagetools-move_main-passive-sprite.png
pagetools-pdfexport-sprite.png
pagetools-sprite.png

Folgende Dateien in das Verzeichnis '/var/www/10_DW_WERKSTATT/lib/css' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen:

icke_nav_pagetools.css 
icke_nav_mobile.css 

Datei '../tpl/04-links-wiki-data-bootstrap3/style.ini' editieren und nach dem Abschnitt '; Template styles' folgenden Abschnitt hinzufügen:

; icke-nav-style
../icke_nav_frame_blau        = all
css/icke_nav_popouts.less     = all
css/icke_nav_pagetools.css    = all
../icke_nav_reset.css         = all
css/icke_nav_mobile.css       = all

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 101 - Befehl auskommentieren:

<?php // require_once('tpl/page-tools.php'); // Page Tools ?>

Datei '../tpl/04-links-wiki-data-bootstrap3/main.php' - Zeile 180 - untehalb '<?php $TPL->includeSidebar('right'); // Right Sidebar ?>' folgende Zeile hinzufügen:

<?php $TPL->includeSidebar('right'); // Right Sidebar ?>
<?php require_once('tpl/tj_pagetools.php'); // TJ ?>

Datei '.. /css/icke_nav_pagetools.css' - Position bzw. Abstand der 'Page-Tools' in Relation zum rechten Rand der WebSite und zum Seiten-Inhalt justieren - Zeile 41 (⇒ right: -15px; ) bearbeiten:

#dokuwiki__pagetools {
    position: absolute;
    /* on same vertical level as first headline, because .page has 2em padding */
        /* Edit: higher */
    top: 6.5em;
    right: -15px;
    width: 40px;
    z-index: 1200;

}

Datei '.. /css/icke_nav_pagetools.css' - Position bzw. Abstand der 'Page-Tools' in Relation zum oberen und unteren Rand der WebSite justieren - Zeile 40 (⇒ top: 6.5em; ) bearbeiten:

#dokuwiki__pagetools {
    position: absolute;
    /* on same vertical level as first headline, because .page has 2em padding */
        /* Edit: higher */
    top: 6.5em;
    right: -15px;
    width: 40px;
    z-index: 1200;
}

'#dw__toc.affix' - Position unterhalb navbar festlegen


Datei '././04-links-wiki-data-bootstrap3/Template.php' - Zeile 307 - den Wert '+ 20' in der Zeile ändern:

 $styles[] = ' #dw__toc.affix { top: ' . ($navbar_padding + 20 ) . 'px; position: fixed !important; }';

icke-sidebar implementieren


Folgende Dateien in das Verzeichnis '..tpl/01-archiv-werkzeuge-bootstrap3/tpl' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen:

  * tj_sidebar.php

Folgende Dateien in das Verzeichnis '../tpl/01-archiv-werkzeuge-bootstrap3/css' kopieren und Rechte (www-data:www-data, 770) für die Dateien setzen:

  * icke_nav_popouts.less

Datei '../tpl/01-archiv-werkzeuge-bootstrap3/style.ini' öffnen - Zeile 39 - Zeilen einfügen bzw. auskommentieren:

; icke-nav-style
../icke_nav_frame_blau         = all
css/icke_nav_popouts.less      = all
css/icke_nav_pagetools.css     = all
../icke_nav_reset.css          = all
css/icke_nav_mobile.css        = all

Datei '..tpl/01-archiv-werkzeuge-bootstrap3/icke/components.php' - Datei-Inhalt ersetzen mit:

<?php

function icke_sidebar() {
    global $USERINFO;
    global $ACT;


?>
    <div id="icke__wrapper" class="dokuwiki act_<?php echo act_clean($ACT) ?>">
        <ul id="icke__quicknav">
        <?php icke_tplCSS(); icke_tplSidebar(); ?>
        </ul><!-- END icke__quicknav -->
    <div class="wrap">
           
<?php
}

Datei '..tpl/01-archiv-werkzeuge-bootstrap3/main.php' - Zeile 15 - folgende Zeilen hinzufügen:

require_once('tpl/icke/functions.php')); // include hook for icke sidebar popup TJ
require_once('tpl/icke/components.php')); // include hook for icke sidebar popup TJ

Datei '..tpl/01-archiv-werkzeuge-bootstrap3/Template.php' - Zeile 1601 - Zeile auskommentieren und Zeile hinzufügen:

// @require $this->tplDir . 'tpl/sidebar.php'; // TJ
@require $this->tplDir . 'tpl/tj_sidebar.php'; // TJ

Datei '…/tpl/01-archiv-werkzeuge-bootstrap3/icke/IckeNavigation.phpicke' öffnen - Zeile 136 - folgende Zeile auskommentieren:

// Add toolbox
// icke_navi('','Settings','qnav_einstellungen',icke_toolbox(),false,false);

bootswrapper plugin - section edit de-aktivieren - zusätzliche Buttons - zusätzliche Panels

Datei '/var/www/10_DW_WERKSTATT/lib/plugins/bootswrapper/syntax/panel.php' editieren - Zeile 97 auskommentieren, um Section-Edit-Button nicht anzuzeigen:

if (defined('SEC_EDIT_PATTERN')) { // for DokuWiki Greebo and more recent versions
            //    $renderer->startSectionEdit($pos, array('target' => 'plugin_bootswrapper_panel', 'name' => $state));
            } else {
                $renderer->startSectionEdit($pos, 'plugin_bootswrapper_panel', $state);
            }

Datei '/var/www/10_DW_WERKSTATT/lib/plugins/bootswrapper/syntax/panel.php' editieren - Zeile 20 wie folgt aktualisieren, um zusätzliche Buttons zu generieren (in '/var/www/10_DW_WERKSTATT/lib/tpl/icke_nav_reset.css' definiert):

'values'   => array('default', 'primary', 'success', 'info', 'warning', 'danger', 'green', 'green2', 'gelb', 'orange', 'rot', 'burgund'),

Datei '/var/www/10_DW_WERKSTATT/lib/plugins/bootswrapper/syntax/button.php' editieren - Zeile 21 wie folgt aktualisieren, um zusätzliche Buttons zu generieren (in '/var/www/10_DW_WERKSTATT/lib/tpl/icke_nav_reset.css' definiert): <code>

          'values'   => array('default', 'primary', 'success', 'info', 'warning', 'danger', 'link', 'info-2', 'success-2'),

<code>

inline-style - body {margin-top: 70px !important;}

Zeile 42 in Quell-Text der WebSite:

<style type="text/css">@media screen { body { padding-top: 70px; } #dw__toc.affix { top: 60px; position: fixed !important;}} /style>

⇒ hardcoded / Inline-Style! ⇒ Datei '../tpl/01-archiv-werkzeuge-bootstrap3/Template.php' - Zeile 312