DPC-iT notizBLOG

Rund um IT und Webdesign was ich sonst vergesse

Dieser Beitrag wurde von https://www.stom66.co.uk/resources/bootstrap-4-template.html übernommen und dienst lediglich als mein Öffentliches Bookmark.

Hier also das Template und die Vorgehensweise zur Installation.

This is my generic Bootstrap 4 template for use with CMSMS. It provides a central settings file to easily change the template, as well as a flexible template with 9 content sections. Sections can be styled through the Content Manager using the Bootstrap classes. It has the following dependencies:

Recommended CMSMS modules:

  • CGSmartImage
  • CGExtensions
  • CSSPreProcessor
  • SitemapMgr
  • Markdown1

Links to the template, stylesheets and required UDTs:

Template Files:
CSS Files:
Smarty plugins:

Place these in /assets/plugins/

Usage:

  • Create a new design in Design Manager called Bootstrap4
  • Create each of the templates above, using the same names (eg „Bootstrap4 Settings“).
  • The default template shoudl be set to:
    • Bootstrap4 Nonuple Cols
  • The following templates should be set as unlisted:
    • Bootstrap4 Core
    • Bootstrap4 Settings
  • Create a new folder under /assets/themes called bootstrap4

Setting up the CSS.

Setting up the app-manifest
  • Create a new page.
  • Name it app-manifest.json
  • Make sure the alias includes the extension
  • Insert a placeholder in the content area. This will not be shown.
  • Set it to use the Bootstrap4 AppManifest template type.
  • Hide it from the menu
  • Update the $manifest_alias variable found around line # in the Bootstrap4 Settings template.

Anker bei Fixed Navbar treffen nicht

Posted by Daniel Pest under CSS

If you’re using a .navbar-fixed-top fixed to top navbar in Twitter Bootstrap you probably have noticed your anchor ahref links no longer line up correctly.

The easiset way to fix this is to the use the <section id="MyAnchor"> tag with a padding-top equal to the padding you’ve added to the body.

So for example if you have:

.body {
padding-top:40px
}

You will then want to add the same padding to your section CSS:

section {
padding-top:40px;
}

If the 40px gap above each section is going to mess with your design mojo you can add a negative margin-bottom. So for example:

section {
padding-top:40px;
margin-top:-40px;
}

 

Quellenangabe: https://www.servermule.com.au/help/bootstrap-anchors-fixed-nav/

CSS LoVe HAte

Posted by Daniel Pest under CSS

The selectors she is referencing is for anchor elements:

a:link
a:visited
a:hover
a:active

DD Rescue Image direkt auf HDD kopieren

Posted by Daniel Pest under Linux

dd if=/mnt/sdb4.img | pv | dd of=/dev/sdd1

Wobei sdb4 für die 4. Partition von Festplatte 2 (sdb) steht.

sdd1 ist in diesem Fall eine Festplatte welche über USB Adapter an das System angeschlossen wurde

YouTube-Video einbetten ohne Konkurrenz-Filme am Ende

Deaktivieren Sie nun die Option „Nach Ende des Videos vorgeschlagene Videos anzeigen“.
Der ursprüngliche Einbettungs-Code ändert sich nun von z.B.

<iframe width=“560″ height=“315″ src=“//www.youtube.com/embed/abcd12345“ frameborder=“0″ allowfullscreen></iframe>

in

<iframe width=“560″ height=“315″ src=“//www.youtube.com/embed/abcd12345?rel=0“ frameborder=“0″ allowfullscreen></iframe>

 

Durch die Ergänzung „?rel=0“ wird also verhindert, dass am Ende des Videos weitere Filme angezeigt werden und es wird das Startbild des Videos angezeigt.

Minify einbinden in CMSms

Posted by Daniel Pest under WebDesign
  1. Modul aus dem CMS made simple Forge herunterladen und installieren
  2. Folgendes ins Template (kurz vor Ende des Body Tags):

    <script type="text/javascript" src="modules/Minify/min/?f=uploads/PathToScript/script.js,another-script.js,etc-script.js"></script>

Falls das CMS in einem Unterordner installiert wird und über www.domain.de/unterordner aufgerufen wird, lautet der Aufruf:

<script type="text/javascript" src="modules/Minify/min/?b=unterordner&f=uploads/PathToScript/script.js,another-script.js,etc-script.js"></script>

Geschützt: CMSms Bootstrap

Posted by Daniel Pest under CMS

Dieser Inhalt ist passwortgeschützt. Um ihn anzuschauen, gib dein Passwort bitte unten ein:

Leider wird diese Tool nicht mehr weiterentwickelt.
Viele, ich selbst eingeschlossen, finden das schade und können nicht ohne diese sinnvolle MySQL Datenbankbackup Programm leben.
Zum Glück hat sich einer dem Problem angenommen und ein Fork des Tools herausgebracht.

Das Tool nennt sich MyOOS und basiert auf MySQL Dumper.
Hier kann man es direkt beim Entwickler herunterladen.

Sollte der Link mal nicht funktionieren, könnt ihr es auch direkt beim mir im Blog herunterladen.

Leider ist Dokumentation in diesem Fall sehr schlecht. Daher schreibe ich hier eine kurze Anleitung um ein komfortabeles Backend Menü für Bootstrap basierte Seiten im CMS made simple Content Management System.
Lange Rede kurzer Sinn, jetzt gehts an´s Eingemachte:

Download des Moduls (kostenpflichtig):

tinyMce Bootstrap Plugin

Hochladen der Dateien

Die Ordner bootstrap und css per FTP  (den ganzen Ordner, nicht nur den Inhalt) in folgendes Verzeichnis hinein kopieren:

/modules/TinyMCE/lib/js/tinymce/plugins/bootstrap/

Da, das Modul nur in englischer und französischer Sprache vorliegt, haben wir jetzt 2 Möglichkeiten um es zum Laufen zu überreden:
1. Wir benennen die Dateien: en_EN.php und en.php im Ordner:

/modules/TinyMCE/lib/js/tinymce/plugins/bootstrap/langs/ auf de_DE.php und de.php um.
2. Oder wir übersetzen die Dateien anhand der englischen Exemplare.

Zurück zum CMS:

Activieren des Plugins:
Unter Erweiterungen -> TinyMCE WYSIWYG Editor ein Profil auswählen. Dort unter Erweiterungen -> Erweiterungen: bootstrap eintragen. Bei mir sieht das so aus:
 autolink anchor code fullscreen image link media paste table visualblocks hr emoticons bootstrap

Plugin zur Wrekzeugauswahl hinzufügen:

Unter Werkzeuge -> Werkzeugleiste – zweite Zeile habe ich dann noch folgendes eingetragen: bootstrap

Damit die Werkzeuge auch richtig funktionieren, werden jetzt noch einige Einstellungen benötigt. Unter Vorlagen bitte folgendes hinzufügen:

paste_as_text: true,
image_caption: true,
bootstrapConfig: {
imagesPath:  ‚http://ihredomain.tld‘ + ‚/uploads/images‘,
bootstrapCssPath: ‚http://ihredomain.tld‘ + ‚/uploads/bootstrap/css/bootstrap.min.css‘
}

Wer die Einstellungen jetzt speichert und beispielsweise „Insert/Edit Bootrap Pager“ testet, wird mit einer netten Fehlermedlung begrüßt. So ist es zumindest derzeit bei CMS made simple Version 2.1.6 (so zumindest mit aktiverierter htaccess Datei) :

Forbidden

You don’t have permission to access /cms/modules/TinyMCE/lib/js/tinymce/plugins/bootstrap/bootstrap-pager.php on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.

In meinem Fall ist dies die .htaccess Datei welche sich im cms root Verzeichnis befindet. Dort sind Umleitungen vorhanden die vor direktem Ausführen einiger php Dateien schützen sollen.
Leider werden aber auch unsere Bootstrap php Dateien blockiert.
Die Quick and Dirty Lösung lautet:
suche folgende Einträge:
RedirectMatch 403 ^.*/plugins/.*\.php$
RedirectMatch 403 ^.*/modules/.*\.php$

durch eine vorangestellte Raute kann man die Befehle der htaccess Datei enträftigen.

Das Ganze sieht dann in etwa so aus:
#RedirectMatch 403 ^.*/plugins/.*\.php$
#RedirectMatch 403 ^.*/modules/.*\.php$

… fertig, jetzt kann man das TinyMCE Bootstrap Plugin in CMS made simple (2) nutzen.

Optimization WordPress Plugins & Solutions by W3 EDGE