Tutorial Projekt Sicherheit

<!DOCTYPE html> <html lang="de"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"> <link rel="shortcut icon" href="assets/images/logo-mobirise-250x250-128x128.png" type="image/x-icon"> <meta name="description" content="Mobirise Webbaukasten Tutorial Projekt Sicherheit und Settings"> <title>Tutorial Projekt Sicherheit</title> <link rel="stylesheet" href="assets/web/assets/mobirise-icons/mobirise-icons.css"> <link rel="stylesheet" href="assets/icon54-v2/style.css"> <link rel="stylesheet" href="assets/web/assets/mobirise-icons2/mobirise2.css"> <link rel="stylesheet" href="assets/Material-Design-Icons/css/material.css"> <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" href="assets/bootstrap/css/bootstrap-grid.min.css"> <link rel="stylesheet" href="assets/bootstrap/css/bootstrap-reboot.min.css"> <link rel="stylesheet" href="assets/web/assets/gdpr-plugin/gdpr-styles.css"> <link rel="stylesheet" href="assets/popup-overlay-plugin/style.css"> <link rel="stylesheet" href="assets/dropdown/css/style.css"> <link rel="stylesheet" href="assets/socicon/css/styles.css"> <link rel="preload" href="https://www.mobirise-tutorials.com/assets/myfonts/style.css?family=Jost:100,200,300,400,500,600,700,800,900,100i,200i,300i,400i,500i,600i,700i,800i,900i&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'"> <noscript><link rel="stylesheet" href="https://www.mobirise-tutorials.com/assets/myfonts/style.css?family=Jost:100,200,300,400,500,600,700,800,900,100i,200i,300i,400i,500i,600i,700i,800i,900i&display=swap"></noscript> <link rel="preload" as="style" href="assets/mobirise/css/mbr-additional.css?v=1ojDRU"><link rel="stylesheet" href="assets/mobirise/css/mbr-additional.css?v=1ojDRU" type="text/css"> <script src="https://consent.cookiefirst.com/sites/mobirise-tutorials.com-f6a24dff-9a33-4bc8-bd8d-af58db844677/consent.js"></script>  <style> .hamburger-icon { height: .1px !important; background-color: #fff !important } </style>  <style> /* Image */ .goog-te-gadget img { display: none !important; } /* Powered */ .goog-te-gadget { color: #e2e2e2 !important; } /* Link */ .VIpgJd-ZVi9od-l4eHX-hSRGPd { color: #6592e6 !important; } /* Link Hover */ .VIpgJd-ZVi9od-l4eHX-hSRGPd:hover { color: #326ede !important; } </style> <style> /* WCAG Focus */ *:focus-visible { outline: 2px solid red !important; } </style> </head> <body> <section data-bs-version="5.1" class="menu menu2 cid-tnpqY1ZQhj" once="menu" id="menu2-7h"> <nav class="navbar navbar-dropdown navbar-fixed-top navbar-expand-lg"> <div class="container"> <div class="navbar-brand"> <span class="navbar-logo"> <a href="index.html"> <img src="assets/images/logo-mobirise-96x96.png" alt="" title="Mobirise Tutorials" style="height: 4.2rem;"> </a> </span> <span class="navbar-caption-wrap"><a class="navbar-caption text-white text-primary display-7" href="index.html">Mobirise</a></span> </div> <button class="navbar-toggler" type="button" data-toggle="collapse" data-bs-toggle="collapse" data-target="#navbarSupportedContent" data-bs-target="#navbarSupportedContent" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <div class="hamburger"> <span></span> <span></span> <span></span> <span></span> </div> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav nav-dropdown nav-right" data-app-modern-menu="true"><li class="nav-item dropdown"><a class="nav-link link dropdown-toggle text-white display-4" href="#" data-toggle="dropdown-submenu" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">Foto Galerien</a><div class="dropdown-menu" aria-labelledby="dropdown-270"><a class="dropdown-item text-white display-4" href="Fotos.html">Foto Beispiele</a><a class="dropdown-item text-white display-4" href="Lytebox.html">Fotoalbum mit Lytebox</a><a class="dropdown-item text-white display-4" href="Fotouploadalbum.php">Fotoalbum mit Upload</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorials/Masonsry-Gallery.html" target="_blank">Lightbox 2</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorials-3/Lightbox.html" target="_blank">Lightbox KI generiert</a><a class="dropdown-item text-white display-4" href="Slider.html">Slider</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/BusinessM4/Visual-Lightbox.html" target="_blank">Visual Lightbox</a><a class="dropdown-item text-white display-4" href="WOW-Slider.html" target="_blank">WOW Slider</a></div></li> <li class="nav-item dropdown"><a class="nav-link link dropdown-toggle text-white display-4" href="#" data-toggle="dropdown-submenu" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">Kontakt</a><div class="dropdown-menu" aria-labelledby="dropdown-333"><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Formular/" target="_blank">Kontakt zu mir</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Formular/Generator-Arclab.html" target="_blank">Formular Generatoren</a><a class="dropdown-item text-white display-4" href="Gastbuch.php" target="_blank">Gästebuch</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Event-Kalender-SQLite/" target="_blank">Kalender</a><a class="dropdown-item text-white display-4" href="Google-Maps.php" target="_blank">Karte Google Maps und andere</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorials-2/Kommentar-Box.php" target="_blank">Kommentare hinterlassen</a><a class="dropdown-item text-white display-4" href="Kontakt-Formular.php" target="_blank">Mobirise Formular mit eigenem Mailskript</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Spenden/" target="_blank">Spenden als Beitrag zu diesem Projekt</a></div></li><li class="nav-item dropdown"><a class="nav-link link dropdown-toggle text-white display-4" href="#" data-toggle="dropdown-submenu" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">Verweise</a><div class="dropdown-menu" aria-labelledby="dropdown-357"><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Download-Archiv/" target="_blank">Download Archiv</a><a class="dropdown-item text-white display-4" href="Linkliste.html" target="_blank">Linkliste</a><a class="dropdown-item text-white display-4" href="https://secure.2co.com/myaccount/" target="_blank">Mobirise 2Checkout Konto</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Testseiten/AI-Generated-5/" target="_blank">Mobirise AI</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Mobirise-Links/Documents-Mobirise.php" target="_blank">Mobirise Dokumentation</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Mobirise-Links/HelpCenter-Mobirise.php" target="_blank">Mobirise Help Center</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Mobirise-Links/Gesamtpaket-Mobirise-Erweiterungen.php" target="_blank">Mobirise Komplett Paket</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Mobirise-Links/Gesamtpaket-Mobirise.php" target="_blank">Mobirise Komplett Paket mit AI</a><a class="dropdown-item text-white display-4" href="https://tommys-web-online.mobirisesite.com/" target="_blank">Mobirise Online Builder mit AI</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Mobirise-Links/History-Mobirise.php" target="_blank">Mobirise neueste Version</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Download-Archiv/" target="_blank">Werner-Zenk.de - Archivseite</a></div></li><li class="nav-item dropdown"><a class="nav-link link dropdown-toggle text-white display-4" href="#" data-toggle="dropdown-submenu" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">Tutorials</a><div class="dropdown-menu" aria-labelledby="dropdown-599"><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorial-Links/" target="_blank">Alle Tutorials im Überblick</a><a class="dropdown-item text-white display-4" href="MP3-Music.html" target="_blank">Audio Player</a><a class="dropdown-item text-white display-4" href="Code-Editor.html" target="_blank">Code Editor</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Formular-Generator/" target="_blank">Formular Generator</a><a class="dropdown-item show text-white display-4" href="https://www.mobirise-tutorials.com/Local-Fonts/" target="_blank">Google Fonts entfernen</a><a class="dropdown-item show text-white display-4" href="https://www.mobirise-tutorials.com/News/direkteinbau/" target="_blank">Nachrichten Skript CMS</a><a class="dropdown-item show text-white display-4" href="https://www.mobirise-tutorials.com/PHP/" target="_blank">PHP Version meiner Domain</a><a class="dropdown-item show text-white display-4" href="Publizieren.html" target="_blank">Publizieren mit Mobirise</a><a class="dropdown-item show text-white display-4" href="Projekt-Sicherheit.html" target="_blank">Sicherheit und Settings</a><a class="dropdown-item show text-white display-4" href="https://www.mobirise-tutorials.com/BusinessM4/video.html" target="_blank">Video Player</a></div></li><li class="nav-item dropdown"><a class="nav-link link dropdown-toggle text-white display-4" href="https://www.mobirise-tutorials.com/Forum/" target="_blank" data-toggle="dropdown-submenu" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">Weiteres</a><div class="dropdown-menu" aria-labelledby="dropdown-614"><a class="dropdown-item text-white text-primary display-4" href="https://amp.dev/de/" target="_blank">AMP was ist das</a><a class="dropdown-item text-white display-4" href="Eigene-Anker.html" target="_blank">Anker setzen</a><a class="dropdown-item text-white display-4" href="https://mobirise-tutorials.com/News-PHPJabbers/blog.html" target="_blank">Blogging Software CMS</a><a class="dropdown-item text-white display-4" href="https://getbootstrap.com/" target="_blank">Bootstrap was ist das</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/CMS-Dynpage/" target="_blank">CMS in Mobirise</a><a class="dropdown-item text-white display-4" href="javascript: void();" onclick="cookiefirst_show_settings();">Cookie Einstellungen ändern</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Datenschutz/" target="_blank">Datenschutz</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/LawyerM4-Tutorials/Fullscreen-Background.html" target="_blank">Fullscreen Hintergrund</a><a class="dropdown-item text-white display-4" href="Mitglieder.php" target="_blank">Mitglieder Bereich</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorial-Links/Mobirise-Themen.html" target="_blank">Mobirise Themen Beispiele</a><a class="dropdown-item text-white display-4" href="https://www.mobirise-tutorials.com/Tutorials/Spotify.html" target="_blank">Music Player Mobirise</a></div></li><li class="nav-item"><a class="nav-link link text-white display-4" href="https://www.mobirise-tutorials.com/Forum/" target="_blank"><span class="icon54-v2-speach-bubbles-1 mbr-iconfont mbr-iconfont-btn"></span>Forum</a></li> <li class="nav-item"><a class="nav-link link text-white display-4" href="Suchen.php"><span class="mbri-search mbr-iconfont mbr-iconfont-btn"></span>Suchen</a> </li></ul> </div> </div> </nav> </section> <section data-bs-version="5.1" class="header6 cid-tkuRE3uOMj mbr-fullscreen" id="header6-3h"> <div class="mbr-overlay" style="opacity: 0.3; background-color: rgb(0, 0, 0);"></div> <div class="align-center container"> <div class="row justify-content-center"> <div class="col-12 col-lg-10"> <h1 class="mbr-section-title mbr-fonts-style mbr-white mb-3 display-2"><strong><br></strong><br><strong>Projekt Sicherheit</strong><br><strong><br></strong></h1> <p class="mbr-text mbr-white mbr-fonts-style display-7"> Wie sichere ich meine Projekte richtig <br>und welche Einstellungen gibt es.<br><br><br></p> <div class="mbr-section-btn mt-3"><a class="btn btn-secondary display-4" href="Projekt-Sicherheit.html#Tutorial"><span class="mobi-mbri mobi-mbri-pages mbr-iconfont mbr-iconfont-btn"></span>Zum Tutorial</a> <a class="btn btn-secondary display-4" href="Projekt-Sicherheit.html#Google"><span class="mdi-action-translate mbr-iconfont mbr-iconfont-btn"></span>Translator</a></div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkuRIvT7Lx" id="Tutorial"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Vorwort</h4> <p class="mbr-text mbr-fonts-style display-7">Zunächst kann dieses Tutorial nur einzelne und wichtige Möglichkeiten der Einstellungen und Sicherungen beschreiben. Bitte guckt euch sämtliche, möglichen Einstellungen unbedingt selbst an. Das sollte man gleich zu Beginn der Arbeit mit dieser Software tun, sodass man keine wichtigen Dinge übersehen kann. Dann sollte man zunächst ein Projekt zum Testen erstellen und nicht gleich mit dem eigentlichen Projekt beginnen. Manchmal kann es schwierig sein entstandene Fehler wieder zu beseitigen.<br></p> </div> </div> </div> </section> <section data-bs-version="5.1" class="content8 cid-tkw2NYCy4l" id="content8-44"> <div class="container"> <div class="row justify-content-center"> <div class="counter-container col-md-12 col-lg-10"> <div class="mbr-text mbr-fonts-style display-7"> <ul> <li><strong><a href="Projekt-Sicherheit.html#Folder" class="text-primary">Verzeichnis</a><br></strong><span style="font-size: 1.2rem;">Verzeichnisse zusammen legen</span></li> <li><a href="Projekt-Sicherheit.html#Video" class="text-primary">Video zum Verzeichnis</a><br>Ein kleines Video zum besseren Verständnis des Mobirise Projekt Verzeichnisses</li> <li><a href="Projekt-Sicherheit.html#Projekt" class="text-primary">Neues Projekt erstellen</a><br>Wie erstelle ich mein erstes Projekt</li><li><a href="Projekt-Sicherheit.html#MeinProjekt" class="text-primary">Erstellte Projekte</a><br>Übersicht meiner bereits erstellten Mobirise Projekte</li><li><a href="Projekt-Sicherheit.html#SiteSettings" class="text-primary">Site Settings</a><br>Globale Einstellungen für das gesamte Projekt</li><li><a href="Projekt-Sicherheit.html#CookiesAlert" class="text-primary">Cookies Alert</a><br>Datenschutzhinweis als Popup zur Bestätigung und Anerkennung der verwendeten Cookies und Anwendung</li><li><a href="Projekt-Sicherheit.html#GlobalHTML" class="text-primary">Globale HTML</a><br>HTML Einstellungen über das gesamte Projekt</li><li><a href="Projekt-Sicherheit.html#PageSettings" class="text-primary">Page Settings</a><br>Seiteneinstellungen für jede Seite</li><li><a href="Projekt-Sicherheit.html#Extensions" class="text-primary">Extensions</a><br>Themen & Erweiterungen, die kostenpflichtig gekauft werden können</li><li><a href="Projekt-Sicherheit.html#BlockAnsicht" class="text-primary">Block Ansicht</a><br>Mobirise Blöcke aus den Themen verwenden</li><li><a href="Projekt-Sicherheit.html#AppSettings" class="text-primary">App Settings</a><br>Einstellung der Mobirise Software</li> </ul> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkuW0ZmfTY" id="Folder"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5">Mobirise Pfade zusammen legen</h4> <p class="mbr-text mbr-fonts-style display-7">Es ist wie immer mit das Wichtigste seine Projekte richtig zu sichern, denn wenn mal der PC kaputt geht oder auch nur abstürzt, kann gut und gerne die gesamte Arbeit weg sein. <br> <br>Insofern solltet ihr Sicherungen auch nicht nur am PC erstellen, sondern diese auch zwingend auf ein <strong>externes Laufwerk</strong> kopieren. Ich habe hier z.B. ein 10 TB externes Laufwerk ständig am Laptop, das permanent alles was ich mache sichert. Das kann man heutzutage auch am Windows 10 sehr leicht mit der App "Dateiversionsverlauf" einstellen und das hat mir schon oft große Hilfe geleistet und viel Arbeit gerettet. <br> <br>Natürlich ist auch jeder andere, externe Datenträger zur Sicherung geeignet, wie z.B. ein einfacher USB-Stick. <br> <br>Mobirise sichert per Default bei jedem Start und bei jedem Beenden der Software ein neues Projekt in ungefähr diesem Pfad in dem Verzeichnis "projects": <br> <br><span class="notranslate">C:\Users\User-Name\AppData\Local\Mobirise.com\Mobirise\projects</span><br><br>Dabei wird dort nur die Projekt-Datei <strong>project.mobirise</strong>, die verwendeten Fonts und das <strong>History</strong> Verzeichnis gesichert. Im History-Verzeichnis findet man Sicherungen von jeder Änderung seines Projektes. <br> <br>Die Projekt-Dateien, also alle HTML-Seiten und "Assets" - Anlagen wie Bilder, CSS und JS Dateien, usw. - werden dagegen im Verzeichnis der <strong>Lokalen Publizierung</strong> abgelegt. <br> <br>Zur Sicherung ist also das lokale Publizieren unerlässlich wichtig. <br><br>Ich persönlich finde das etwas unübersichtlich und verwende daher folgenden "Trick" für meine Projekte, um das alles zusammen in einem Verzeichnis zu haben. Diese Routine erstelle ich immer sogleich und einmalig als erstes bei einem neuen Projekt.<br> <br>Ich importiere zunächst meine Datei <strong>project.mobirise</strong> erneut aus dem lokalen Verzeichnis in das Verzeichnis meiner "Lokalen Publizierung". <br> <br>> Menü > Sites > Import Mobirise Site > am Link an schwarzer Kachel oben links<br><br>Durch den Import befinden sich dann auch die Projekt-Datei <strong>project.mobirise</strong>, sowie das wichtige Verzeichnis <strong>history </strong>in dem gleichen Verzeichnis der <strong>Lokalen Publizierung</strong> und die Dateien werden dort von Mobirise weiter gepflegt. <br><br>Somit befinden sich nun sämtliche Dateien im Verzeichnis meiner lokalen Publizierung und ich kann dann dieses gesamte Verzeichnis dann auch sichern.<br><br>Guckt euch meine <a href="https://www.mobirise-tutorials.com/Forum/viewtopic.php?t=160" class="text-primary" target="_blank">Anleitungen</a> auch in meinem <strong>Forum</strong> an, sowie mein <strong>Video</strong> unten zu diesem Thema.<br></p> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkuYJiFqNy" id="Video"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-7"><strong> Video alle Dateien in einem Verzeichnis</strong>. Ihr könnt unten rechts für den Vollbildmodus klicken</h4> <p class="mbr-text mbr-fonts-style display-7">  <video id="Unterwasser" width="640" controls="controls"> <source src="https://www.mobirise-tutorials.com//videos/2022-05-23-Import-Mobirise-Projekt.mp4" type="video/mp4"> Dieses HTML5 Video wird von Deinem Browser nicht unterstützt. </video>  </p> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkv0EX3wCQ" id="Projekt"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Neues Projekt erstellen</h4> <p class="mbr-text mbr-fonts-style display-7">Um ein neues Projekt zu erstellen, könnt ihr aus den Themen und Templates (Vorlagen) wählen, die ihr bereits unter den Erweiterungen (Extensions) installiert habt. Um eine leere Seite zu wählen, müsst ihr auf den Tab "Themes" wechseln.<br><br>Ganz oben könnt ihr hier dem Projekt euren eigenen Namen geben, dort wo jetzt "Site-10-17_0828" steht. Das könnt ihr aber auch später noch unter den "Site Settings" tun oder ändern.<br><br>> Menü > Sites > an schwarzer Kachel oben Links auf das ➕ Zeichen klicken.</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvpNSWFzK" id="image3-3m"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/neues-projekt-erstellen-1600x851.jpg" alt="Neues-Projekt"> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Neues Projekt aus einem der Themen erstellen</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvrImpTxl" id="MeinProjekt"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5">Erstellte Projekte</h4> <p class="mbr-text mbr-fonts-style display-7"> Unten im Screenshot sehr ihr die Ansicht "Sites". Dort werden alle eure erstellten Projekte aufgeführt und man kann das jeweilige Projekt mittel Klick öffnen. Man kann hier auch ganze Seiten klonen, am Pinsel den Site-Style bearbeiten und am Zahnrad kommt man zu den wichtigen "<strong>Site Settings</strong>" ⚙️ (Projekt Einstellungen).<br><br>Sollten diese Kacheln mal nicht mehr angezeigt werden, sind die Projekte nicht etwas verloren oder weg, sondern diese Anzeige  ist vielleicht durch einen Absturz des Programms verloren gegangen. Die Projekte könnte man nun einzeln wieder importieren, wie bereits ober beschrieben oder auf den Button "<strong>RESTORE DELETED SITES</strong>" (stelle gelöschte Seiten wieder her) oben rechts klicken. Damit werden alle jemals erstellten Projekte automatisch wieder importiert, also auch irgendwelche Tests, die ihr längst wieder gelöscht und vergessen habt.</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvsai675z" id="image3-3o"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/erstellte-projekte-1600x848.jpg" alt=""> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Meine bereits erstellten Projekte</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvvHChu8p" id="SiteSettings"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Site Settings</h4> <p class="mbr-text mbr-fonts-style display-7">Wichtige Projekt-Einstellungen findet ihr in den "Site Settings" (Projekt Einstellungen):<br><br>> Menü > Sites > an Projekt-Kachel auf das Zahnrad ⚙️ klicken > Site Settings<br><br>Unten einige Screenshots zu den "Site Settings". Unter "Common" findet ihr gleich oben das Mobirise-Thema eures Projektes, hier ist es das Standard-Thema "Mobirise5". Darunter könnt ihr eurem Projekt einen Arbeitsnamen geben. An den beiden Buttons kann man das Projekt exportieren, was ich aber nie verwende. Die lokale Publizierung erfüllt den gleichen Zweck.<br><br>Dort findet ihr auch den ganz wichtigen Button "<strong>HISTORY</strong>". Dort kann man eine automatische Sicherung wählen, falls mal etwas falsch gelaufen ist oder das Projekt beschädigt worden ist. Wählt also eine Sicherung am Datum und klickt dann dann auf den Button "REVERT BACK" (wiederherstellen).</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image4 cid-tkvwDFNVYm" id="image4-3q"> <div class="container"> <div class="row"> <div class="col-12 col-lg-6"> <div class="image-wrapper"> <img src="assets/images/history-587x402.jpg" alt="History"> <p class="mbr-text mbr-fonts-style mt-2 align-center display-4"> Automatische Sicherungen</p> </div> </div> <div class="col-12 col-lg-6"> <div class="image-wrapper"> <img src="assets/images/site-settings-696x663.jpg" alt="Site Settings"> <p class="mbr-text mbr-fonts-style mt-2 align-center display-4"> Site Settings - Projekt Einstellungen</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="image1 cid-tkvyEx7Dxz" id="CookiesAlert"> <div class="container"> <div class="row align-items-center"> <div class="col-12 col-lg-6"> <div class="image-wrapper"> <img src="assets/images/cookie-alert-1096x827.jpg" alt="Cookie Alert"> <p class="mbr-description mbr-fonts-style pt-2 align-center display-4"> Cookies Alert</p> </div> </div> <div class="col-12 col-lg"> <div class="text-wrapper"> <h3 class="mbr-section-title mbr-fonts-style mb-3 display-5"><strong>Cookies Alert</strong></h3> <p class="mbr-text mbr-fonts-style display-7"> Die Option "Cookies Alert" findet ihr ebenfalls bei den "Site Settings".<br><br>Damit kann man einen Hinweis auf den Datenschutz erstellen, was heute durch die Datenschutzverordnung "DSGVO" wichtig ist. <br><br>Man muss also zunächst sein Einverständnis zur Verwendung von Cookies und Anwendungen hier bestätigen.<br><br>Es wird dann ein Cookie gesetzt, sodass dieses Popup danach im gleichen Browser nicht mehr erscheint, zumindest solange bis dieses Cookie wieder im Browser gelöscht wurde.<br><br>Bitte denkt daran, dass es notwendig sein kann ein sogenanntes "Cookie Consent Tool" zu verwenden, mit dem man eine Auswahl der zu verwendenden Cookies treffen kann. Ich verwende hier die API von <a href="https://cookiefirst.com/de/" class="text-primary" target="_blank">CookieFirst</a>, da der "Cookie Alert" von Mobirise eventuell nicht ausreichend sein kann.<br></p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvzWIbuJ6" id="GlobalHTML"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Globale HTML</h4> <p class="mbr-text mbr-fonts-style display-7"> Hier findet ihr auch unter dem Bereich "<strong>Global HTML Insert</strong>", den gleichen Editor, den ihr auch bei den "Page Settings" also den Seiteneinstellungen, habt. Nur werden die Einstellung hier automatisch auf jeder Seite - also "global" über alle Seiten des Projektes angewendet. Hier trägt man zum Beispiel auch die Sprache seine Webseite ein - im Beispiel <strong>de</strong> für Deutschland</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvB72On39" id="image3-3t"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/site-settings-globale-html-1584x850.jpg" alt="Globale HTML"> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Image Description</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvRYiOY1a" id="PageSettings"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Page Settings - Seiteneinstellungen</h4> <p class="mbr-text mbr-fonts-style display-7"> Jede einzelne Seite erstellt ihr unter "Pages" (Seiten). Bereits vorhandene Seiten kann man am Symbol neben dem Zahnrad auch klonen. Ansonsten klickt man oben auf den Button "Create New Page" (neue Seite erstellen) und kann dann zwischen einer leeren Seite "Add Blank Page" oder einem eventuell vorhandenen Template zum Thema wählen. Die Seiten können mit der Maus gegriffen werden und auf diese Weise in der Seitenansicht sortiert werden. Die Startseite (index) muss immer oben stehen und kann daher auch nicht verschoben werden. Diese sollte auch auf keinen Fall anders als "index" heißen, denn danach wird gesucht, wenn kein Seitenname explizit in der URL eingetragen ist, also z.B. nur der Domain-Name angegeben wurde.<br><br>Die Seiteneinstellungen einer jeden Seite nehmt ihr am Zahnrad ⚙️ "Page Settings" vor.<br><br>Hier werden wichtige Einstellungen vorgenommen die auch für die SEO (Suchmaschinen Optimierung) sehr wichtig sind. Dabei trägt man ein:<br><br><strong>Seitentitel</strong> = das ist das "title" Tag im Quelltext<br><strong>Seitenbeschreibung</strong> = das ist das Meta-Tag "description" im Quelltext<br><strong>URL der Sete</strong> = das ist der Seitenname (Dateiname), hier bitte keine Umlaute, Sonder- oder Leerzeichen verwenden<br><strong>Social Sharing Image</strong> = hier kann man ein kleines Bild einfügen, das z.B. bei einem Posting auf Facebook dann angezeigt wird<br><br>Für eine gute SEO sollten diese Bezeichnungen auf jeder einzelnen Seite entsprechend dem Inhalt der Seite mit großem Bedacht gewählt werden und nicht etwa auf jeder Seite das gleiche stehen.</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvRZg2LPw" id="image3-42"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/seiteneinstellungen-1600x847.jpg" alt="Page Settings"> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Seiteneinstellungen</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="image1 cid-tkvXHNzcHt" id="image1-43"> <div class="container"> <div class="row align-items-center"> <div class="col-12 col-lg-5"> <div class="image-wrapper"> <img src="assets/images/seitenbereiche-466x574.jpg" alt="HTML Bereiche"> <p class="mbr-description mbr-fonts-style pt-2 align-center display-4"> HTML Bereiche</p> </div> </div> <div class="col-12 col-lg"> <div class="text-wrapper"> <h3 class="mbr-section-title mbr-fonts-style mb-3 display-5"> <strong>Page Settings - HTML Bereiche</strong></h3> <p class="mbr-text mbr-fonts-style display-7">Etwas tiefer in den Seiteneinstellungen findet ihr die drei HTML Bereiche, in die man CSS oder auch Scripts einfügen kann.<br><br><strong>Inside <head> code</strong>:<br>Hier werden vornehmlich Links zu CSS-Dateien oder META Tags eingefügt.<br><br><strong>End of <body> code</strong>:<br>Hier werden meist JavaScripts eingefügt, sodass diese unterhalb der JavaScripts von Mobirise und Bootstrap zur Wirkung kommen.<br><br><strong>Before <!DOCTYPE>, <html> and <head> tags</strong>:<br>Dieser Bereich ist nur für Profis. Bitte Vorsicht!<br>Man muss sehr genau wissen, was man dort einfügen darf und was nicht. Dieser Bereich steht also noch vor allen HTML Tags ganz oben im Quelltext. Dort gehören solchen Dinge wie PHP-Anweisungen hin und es darf weder vor einem solchen Eintrag noch danach ein Leerzeichen verwendet werden.</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvCIxXMyz" id="Extensions"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Extensions - Themen & Erweiterungen</h4> <p class="mbr-text mbr-fonts-style display-7"> Im Screenshot unten seht ihr kostenpflichtige Erweiterungen von Mobirise. <br><br>Wenn ihr das <strong>Gesamtpaket</strong> der Themen und Erweiterungen erworben habt, dann könnt ihr oben am Link "<strong>Redeem</strong>" (Einlösen) den Freischalt-Code eintragen. Anschließend werden dann hier alle Themen und Erweiterungen geladen und angezeigt.<br><br>Ich rate allerdings sehr davon ab gleich sämtliche Erweiterungen am Link "<strong>Add All</strong>" (alle hinzufügen) zu installieren, denn das nimmt einen sehr großen Speicherplatz am Computer in Anspruch und die meisten Themen werdet ihr sowieso nie verwenden. <br><br>Ebenso rate ich davon ab das automatische Update zu aktivieren, denn dann bemerkt man gar nicht welche Themen & Erweiterungen ein Update erhalten haben und welche nicht. Wenn ein Update vorhanden ist wird neben dem Papierkorb Symbol ein gedrehter grüner Pfeil erscheinen, den ihr dann entweder einzeln oder oben am Link "<strong>Update All</strong>" (alle updaten) klicken könnt.<br><br>Am <strong>+</strong> Zeichen installiert man ein Thema oder eine Erweiterung und am "<strong>Papierkorb</strong>" 🗑️ Symbol kann man diese auch wieder deinstallieren. Letzteres aber nur, wenn man sie nicht mehr in Gebrauch hat. Nach einer Deinstallation erscheint dann wieder das <strong>+</strong> Zeichen zum erneuten Installieren. Die Deinstallation ist aber nur eine visuelle Anzeige an der Erweiterung, denn diese wird nicht tatsächlich deinstalliert und bleibt weiter am Computer erhalten.<br><br>Wenn die <strong>Jahres-Lizenz</strong> für diese Themen & Erweiterungen abgelaufen sein sollte, können diese nicht mehr verwendet werden. Diese Blöcke bleiben aber in den Projekten dennoch erhalten. Man kann aber keine neuen, kostenpflichtigen Blöcke ohne eine gültige Lizenz mehr verwenden.<br><br>Wie lange eure <strong>Lizenz</strong> noch gültig ist findet ihr auch unter:<br><br>> Menü > Account (Konto) > Licenses (Lizenz)</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvCJsmHRM" id="image3-3v"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/extensions-1600x846.jpg" alt="Extensions"> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Themen & Erweiterungen</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvJ1SPfaa" id="BlockAnsicht"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <h4 class="mbr-section-subtitle mbr-fonts-style mb-4 display-5"> Block Ansicht</h4> <p class="mbr-text mbr-fonts-style display-7"> Unten eine Ansicht der Mobirise-Blöcke. Dort werden immer die Blöcke des gerade aktiven Themas gezeigt. Hier, wie man oben rechts im Screenshot sieht, das Standard-Thema "Mobirise5". Klickt man darauf werden alle installierte Themen angezeigt und man kann eine anderes Thema mit seinen Blöcken wählen. Bitte dabei genau darauf achten was passiert, denn nicht alle älteren Blöcke aus "Mobirise4" Themen sind wirklich kompatibel.<br><br>Die meisten Menüleisten sind "global", daher kann man immer nur eine Menüleiste als Navigation pro Projekt einsetzen. Gleiches gilt für den Footer (Fußzeile). Klickt euch einfach mal durch alle Blöcke durch und lernt diese kennen.<br><br>Zum Einbau von fremden Skripten, wie zum Beispiel PHP Anwendungen, verwende ich immer gerne einen möglichst einfachen Block aus der Rubrik "Article".<br><br>Man greift also einen Block mit der Maus und zieht diesen dann in den linken Bereich seiner Mobirise-Seite.<br><br>Blöcke können später auf der Seite auch noch verschoben werden und auch als fertige "<strong>User Blöcke</strong>" (Benutzer Blöcke) abgespeichert werden, falls man diese sichern will beziehungsweise woanders erneut verwenden will. Die "User Blöcke" findet man in der Block-Ansicht dann ganz unten wieder.</p> </div> </div> </div> </section> <section data-bs-version="5.1" class="image3 cid-tkvJ3gCY19" id="image3-3x"> <div class="container-fluid"> <div class="row justify-content-center"> <div class="col-12 col-lg-12"> <div class="image-wrapper"> <img src="assets/images/block-ansicht-1600x850.jpg" alt=""> <p class="mbr-description mbr-fonts-style mt-2 align-center display-4"> Block Ansicht</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="image1 cid-tkvMMBEAbw" id="AppSettings"> <div class="container"> <div class="row align-items-center"> <div class="col-12 col-lg-6"> <div class="image-wrapper"> <img src="assets/images/app-settings-681x751.jpg" alt="App Settings"> <p class="mbr-description mbr-fonts-style pt-2 align-center display-4"> App Settings</p> </div> </div> <div class="col-12 col-lg"> <div class="text-wrapper"> <h3 class="mbr-section-title mbr-fonts-style mb-3 display-5"> <strong>App Settings</strong></h3> <p class="mbr-text mbr-fonts-style display-7"> Bevor ihr richtig anfangt, müsst ihr eure Mobirise Software unter:<br><br>> Menü > Account (Konto) > App Settings<br><br>zunächst einstellen. Dort gibt es Schalter, die selbsterklärend sind. <br><br>Ganz wichtig ist natürlich alle Block-Werkzeuge auf den Arbeitsseiten zu sehen, also den Schalter "<strong>Show All Block Buttons</strong>" einzuschalten.<br><br>Hier könnt ihr auch ganz unten für die kostenlosen Standard-Themen den Schalter "<strong>Remove 'Mobirise' from HTML</strong>" aktivieren, so wird dann die Werbung ("Branding") unter dem Footer ausgeschaltet. Ebenso werden verschiedene Beschriftungen im Quellcode der Seite entfernt.</p> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="content5 cid-tkvOyHLDcM" id="Google"> <div class="container"> <div class="row justify-content-center"> <div class="col-md-12 col-lg-10"> <p class="mbr-text mbr-fonts-style display-7"> Google Translator<br><span style="font-size: 0.8rem;"><a href="javascript: void();" onclick="cookiefirst_show_settings();" class="text-white">Funktionale Cookies akzeptieren</a></span> </p> <div class="d-flex justify-content-center"> <div style="text-align: center;" id="google_translate_element"></div> </div> </div> </div> </div> </section> <section data-bs-version="5.1" class="footer7 cid-tkfgC7kNaS" once="footers" id="footer7-3g"> <div class="container"> <div class="media-container-row align-center mbr-white"> <div class="col-12"> <p class="mbr-text mb-0 mbr-fonts-style display-7"><a href="https://www.mobirise-tutorials.com/Datenschutz/" class="text-white" target="_blank">Impressum</a> | <a href="https://www.mobirise-tutorials.com/Datenschutz/" class="text-white" target="_blank">Datenschutz</a> | <a href="https://www.mobirise-tutorials.com/Spenden/" class="text-white" target="_blank">Spenden</a><br><br>Copyright © Mobirise-Tutorials.com Thomas Frei-Herrmann <br>Private Homepage</p> </div> </div> </div> </section> <script src="assets/bootstrap/js/bootstrap.bundle.min.js"></script> <script src="assets/smoothscroll/smooth-scroll.js"></script> <script src="assets/ytplayer/index.js"></script> <script src="assets/dropdown/js/navbar-dropdown.js"></script> <script src="assets/theme/js/script.js"></script> <script> function googleTranslateElementInit() { new google.translate.TranslateElement({ pageLanguage: 'de' }, 'google_translate_element'); } </script> <script type="text/plain" data-cookiefirst-category="functional" src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> <div id="scrollToTop" class="scrollToTop mbr-arrow-up"><a style="text-align: center;"><i class="mbr-arrow-up-icon mbr-arrow-up-icon-cm cm-icon cm-icon-smallarrow-up"></i></a></div> </body> </html>

CINXE.COM

Tutorial Projekt Sicherheit