Skip to content
GitLab
Commit ec4f0d6b authored by Wolfgang Knopki's avatar Wolfgang Knopki
Browse files

added manual gitlab-pages template

parent fc1951ab
Hide whitespace changes
Inline Side-by-side
help/gitlab-pages.html
View file @ ec4f0d6b
......@@ -163,15 +163,203 @@
<div class="col-auto" style="background-color: #ffffff;">
<p>
Wir stellen eine Vorlage für Projektwebseiten zur Verfügung.
<!-- content: basic setup. adding logo to pages, adding new links to menu (or change existing), adding new pages-->
</p>
<ol>
</ol>
</div>
<div class="help">
<div class="card">
<div class="card-header">
<h3 class="card-title">
<a class="collapsed" data-toggle="collapse" href="#collapse7" aria-expanded="false" aria-controls="collapse7">
<small>Erste Schritte</small></a>
</h3>
</div>
<div id="collapse7" class="card-body collapse" style="">
<p>
Um unsere Vorlage zu benutzen, müssen Sie folgende Schritte ausführen:
</p>
<ol>
<li> Anpassen der Standardwerte in settings.js
<p><b> Wichtig: </b> Werden diese Werte nicht angepasst, wird das Projekt nicht auf unseren Servern ausgerollt und die deployment-Pipeline wirft einen Fehler
</p>
<p>
Klicken Sie dazu im Ordner <em> public </em> auf die Datei <em> settings.js </em> und editieren Sie die Datei.
</p>
<img src="/img/help/select_settings.png" width="95%"/>
<p>
Passen Sie die Werte für projektname und projektseitenlink an, indem Sie die entsprechenden Werte in die Anführungszeichen schreiben.
</p>
<img src="/img/help/edit_settings.png" width="95%"/>
<p>
Klicken Sie anschließend auf <em> commit changes </em>, um die Änderungen zu speichern.
</p>
</li>
<li> Anpassen der Kontaktperson in <em> kontakt.html </em>
<p><b> Wichtig: </b> Wird die Kontaktperson nicht angepasst, wird das Projekt nicht auf unseren Servern ausgerollt und die deployment-Pipeline wirft einen Fehler
</p>
<p>
Klicken Sie dazu im Ordner <em> public </em> auf die Datei <em> kontakt.html </em> und editieren Sie die Datei.
</p>
<img src="/img/help/select_contact.png" width="95%"/>
<p>
Passen Sie die Kontaktperson und die Mailadresse an, indem Sie alle Vorkommen von Max Mustermann und die Mailadresse durch Ihre Werte ersetzen.
</p>
<img src="/img/help/edit_contact.png" width="95%"/>
<p>
Klicken Sie anschließend auf <em> commit changes </em>, um die Änderungen zu speichern.
</p>
</li>
<li>
Nun können Sie den Administrator kontaktieren, der Ihr Projekt am Runner registriert, um das Projekt auf unserem Server auszurollen.
</li>
</ol>
<a class="btn btn-primary text-center d-inline-flex d-lg-flex flex-column flex-grow-1 flex-shrink-1 flex-fill justify-content-between align-items-baseline align-content-center align-self-baseline flex-wrap order-3 mb-auto justify-content-md-center align-items-md-end align-items-lg-center justify-content-xl-center mx-auto"
role="button" style="background-color: #E0001B;" href="mailto:support-transfer@hft-stuttgart.de"><strong>Administratorkontakt</strong></a>
</div>
</div>
<br/>
<div class="card">
<div class="card-header">
<h3 class="card-title">
<a class="collapsed" data-toggle="collapse" href="#collapse3" aria-expanded="false" aria-controls="collapse3">
<small>Logo hinzufügen</small></a>
</h3>
</div>
<div id="collapse3" class="card-body collapse" style="">
<p> Um ein Logo zum Projekt hinzuzufügen, müssen Sie folgende Schritte ausführen:
<ol>
<li>
Öffnen Sie den Ordner <em> public </em>
</li>
<li>
Klicken Sie auf das + im Oberen Bereich, und anschließend auf <em> Upload File </em>
<img src="/img/help/publicplus.png" width="95%"/>
</li>
<li>
Fügen Sie die gewünschte Datei hinzu und klicken Sie auf <em> Upload File </em>
<img src="/img/help/upload_logo.png" width="95%"/>
</li>
<li>
Öffnen Sie nun im Ordner <em> public </em> die Datei <em> settings.js </em> und editieren diese.
<p>
In der Zeile mit <em>projektlogourl</em> schreiben Sie nun ./DATEINAME in die Anführungszeichen, um den Pfad zum Logo anzugeben. Ein Klick auf <em> Commit changes </em> speichert die Datei.
</p>
<img src="/img/help/settings_logo.png" width="95%"/>
</li>
<li>
Nun erscheint auf all Ihren Seiten das Projektlogo neben dem Logo der Hochschule.
</li>
</ol>
</p>
</div>
</div>
<br/>
<div class="card">
<div class="card-header">
<h3 class="card-title">
<a class="collapsed" data-toggle="collapse" href="#collapse4" aria-expanded="false" aria-controls="collapse4">
<small>Neue Seite hinzufügen</small></a>
</h3>
</div>
<div id="collapse4" class="card-body collapse" style="">
<p>
Um Ihrem Projekt neue Seiten hinzuzufügen, führen Sie folgende Schritte aus:
<ol>
<li>
Klicken Sie im Ordner <em> public </em> auf das +, das sich oben neben dem Pfad befindet
<img src="/img/help/publicplus.png" width="95%"/>
</li>
<li>
Klicken Sie dort auf <em> New File </em>
</li>
<li>
Geben Sie einen Dateinamen (<b> wichtig: </b> Endung .html) an und fügen Sie folgenden Standardtext ein:
<textarea rows="28" cols="64" disabled="true">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="generator" content="GitLab Pages">
<title>Neue Seite</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="topbar">
<div id="menu" class="navbar"></div>
</div>
<div class="content">
<h1 id='projectname'></h1> <!--Projektname kommt aus settings.js, hier nichts einfügen-->
<!-- ÄNDERUNGEN NUR NACH DIESER ZEILE -->
<h2> Seitentitel: </h2>
<p>
Content
</p>
<!-- KEINE ÄNDERUNGEN NACH DIESER ZEILE -->
</div>
<script src="settings.js"> </script>
</body>
</html>
</textarea>
<img src="/img/help/editnewpage.png" width="95%"/>
</li>
<li>
Nun können Sie noch den Inhalt der Seite anpassen. Wenn Sie mit dem Inhalt der Seite zufrieden sind, speichern Sie sie durch Klick auf <em> Commit changes </em>
</li>
<li>
Ihre Seite wird nun automatisch auf den Server übertragen und ist unter folgender Adresse erreichbar:
<p>https://transfer.hft-stuttgart.de/pages/PROJEKTNAME/DATEINAME</p>
</li>
</ol>
</p>
</div>
</div>
<br/>
<div class="card">
<div class="card-header">
<h3 class="card-title">
<a class="collapsed" data-toggle="collapse" href="#collapse5" aria-expanded="false" aria-controls="collapse5">
<small>Menü bearbeiten</small></a>
</h3>
</div>
<div id="collapse5" class="card-body collapse" style="">
<p>
Wenn Sie das Menü am oberen Seitenrand bearbeiten wollen, führen Sie folgende Schritte durch:
<ol>
<li>
Öffnen Sie im Ordner <em> public </em> die Datei <em>settings.js</em> und editieren Sie diese.
</li>
<li>
Im Menüblock kopieren Sie einen bereits bestehenden Teil und fügen diesen im Anschluss ein. Ein solcher Block besteht dabei aus folgenden Anweisungen:
<img src="/img/help/settingmenublock.png" width="95%"/>
<ul>
<li>
<em>//Link 4: Kontakt </em> Dies ist ein Kommentar, der der Ordnung und Verständlichkeit des Codes dient
</li>
<li>
<em>let NAME = document.createElement("a") </em> Dies legt einen neuen Eintrag fest
</li>
<li>
<em>NAME.href = "addresse" </em> Dies legt die Adresse fest, auf die der neue Menüeintrag verweist. Dies kann zum Beispiel eine neu angelegte Seite sein.
</li>
<li>
<em>NAME.innerHTML="" </em> Dies legt den Text des Eintrags fest, also was später im Menü angezeigt wird
</li>
<li>
<em> menu.appendChild(NAME); </em> Dies fügt letztlich den Eintrag dem Menü hinzu.
</li>
</ul>
</li>
<li>
Nachdem Sie den Block entsprechend Ihrer Wünsche bearbeitet haben, klicken Sie auf <em> Commit changes </em>, um Ihre Änderungen zu speichern.
<img src="/img/help/settingsnewmenublock.png" width="95%"/>
</li>
</ol>
</p>
</div>
</div>
</div>
</div>
</div>
</div>
......
help/jitsi.html
View file @ ec4f0d6b
......@@ -19,11 +19,7 @@
<div style="background-color: #dadada;">
<div class="container" style="background-color: #ffffff;margin-bottom: 30px;">
<div class="row">
<!-- <div class="col-md-12">
<h4 class="text-center">Jitsi</h4>
</div>
--> </div>
</div>
</div>
<div id="Jitsi" style="margin-top: 40px;margin-bottom: 30px;">
<div class="container" style="background-color: #ffffff;">
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Dies ist die Gitlab-Instanz des Transferportals der Hochschule für Technik Stuttgart. Hier geht es zurück zum Portal