TeamBasu Homepage für Stadt Liestal

Wir haben eine Internetseite für die Stadt Liestal erstellt, wo alles Wichtige zu finden ist. Es kann über aktuelle Anlässe der Stadt, über bekannte Personen informiert sowie im Forum Beiträge geschrieben werden.

Das Konzept wurde so gehalten, dass jeder zu Recht kommt, von Jung bis Alt, einfach zu bedienen und übersichtlich dargestellt.

Heidschnucken

Die Webseite, welche wir erstellt haben, handelt von Heidschnucken. Die Heidschnucke ist eine Rasse der Schafe. Ziel der Seite ist es, das Interesse an Heidschnucken zu wecken. Zudem werden wichtige Informationen zur Haltung, Geschichte und Events mitgeteilt.

Die Website ist auf acht einzelnen Seiten Aufgebaut.

Home

Auf der „Home“ Seite wird kurz beschrieben für was die Webseite zuständig ist. Zudem ist ein Karte mit unserer Adresse ersichtlich. Zusätzlich sind unsere Social Media Kanäle verlinkt.

Geschichtliches und Pflege

Auf den Seiten Geschichtliches und Pflegen sind allgemeine Informationen über die Rasse eingetragen.

Galerie

Die Seite Galerie, wie der Name es sagt, eine Galerie, wo einige Bilder hochgeladen wurden.

Events

Auf der Seite Events können Events erstellt, gesucht und gefunden werden.

Austauschforum

Um den Kontakt mit anderen Interessierten und Fachpersonal zu halten, wurde ein Austauschforum eingerichtet.

Aktuelles

Bei der Seite Aktuelles sind die News aufgelistet. Zudem kann durch das klicken auf das Ohrmarken Bild, wird man auf die Seite der Tierverkehrsdatenbank weitergeleitet.

Hilfreiche Links

Bei Hilfreiche Links sind drei Links hinterlegt, die den Nutzern den Zugang zu diesen Seiten erleichtern soll. Wie beim Aktuelles wird man direkt auf diese Seiten weitergeleitet.

Blogs

Des Weiteren wurde eine Seite mit Blogs erstellt. Es werden kleine Geschichten über Heidschnucken und deren Besitzer erzählt.

  • Verwendete Plugins:
    • Elementor
    • Event Organiser
    • Jetpack by WordPress
    • Rumble Talk Chat
    • WP Blog and Widget

Reitverein Aaretal-Münsingen

Homepage des RVAM

Die Seite des Reitverein Aaretal-Münsingen soll Informationen für Interessierte und Tournierteilnehmer bereitstellen aber auch als Informationsportal für die Mitglieder dienen.

Sponsoren Image Carousel

Sponsoren sind wichtig für den Verein. Sie werden in einem Image Carousel vorgestellt und die Bilder agieren als Link zu den Sponsorenwebseiten. Dazu musste die Programmierung des Image Carousel angepasst werden. Diese Anpassung muss leider nach jedem Update von Elementor erneuert werden.

Reitplatzinformationen

Auf dieser Seite ist gooleMaps eingebettet, damit Tournierteilnehmer den Reitplatz finden können.

Für die Vereinsmitglieder ist ersichtlich ob der Reitplatz zur Zeit durch einen Kurs belegt ist oder nicht. Dazu wurde ein Kalender eingebettet.

Kontaktformular

Ein Kontaktformular ermöglicht die Kontaktaufnahme mit dem Vorstand des Vereins. Die Nachrichten werden per Mail an die Sekretärin gesendet.

Mitgliederbereich

Im Mitgliederbereich werden verschiedene Dokumente zur Verfügung gestellt. Diese Seite ist nur für angemeldete Mitglieder ersichtlich. Wenn sich die Mitglieder anmelden, werden sie direkt auf diese Seite verwiesen und die Seite „Mitglied werden“ wird aus dem Menu entfernt.

Mit alten Prüfungen zum Erfolg

Die WordPress Website dient zur besseren Übersicht über alte Prüfungen und deren Lösungen. Das Lösen von alten Prüfungen hilft sehr bei der Prüfungsvorbereitung. Die Website soll zudem mit lustigen Memes und Beiträgen die Stimmung aufhellen. Die Website wird nach dem Kurs wieder gelöscht und nicht zur Verfügung gestellt.

Auf der Startseite wurden verschieden Reiter verwendet um die Navigation auf der Website zu vereinfachen.

Auf der Startseite wurde mit Hilfe vom Elementor Videos eingefügt.

Startseite

Die Seiten „Chemie“ und „Physik“ sind die Hauptseiten der WordPress Website. Auf der Chemie-Seite befinden sich die Links zu alten Prüfungen sowie zu Lösungen. Zudem wurden Bilder eingefügt.

Die Seite der Erfolgsgeschichten zeigt Studenten, die mit unserer Website bereits Erfolge erzielt haben.

Unter Team sind die Verfasser dieser Website ersichtlich.

Hofarbeit, ledig, sucht!

Auf der fiktiven Seite „Hofarbeit, ledig, sucht!“ bietet die Familie Gämpperli verschiedene Aktivitäten auf ihrem Hof an. Durch diese Aktivitäten versucht die Familie der Bevölkerung ihre Tätigkeit näher zu bringen und dabei einen Zusatzverdienst zu erwirtschaften.

Startseite „Hofarbeit, ledig sucht!“

About us / Rezessionen

In diesem Abschnitt wird die Familie Gämpperli vorgestellt. Wir haben hierbei den fiktiven Standort des Hofes durch eine interaktive Google Maps Karte dargestellt.

Auf der rechten Seite sind links zu Rezessionen in Form von Beiträgen in einer bestimmten Kategorie dargestellt. Die einzelnen Rezessionen können im Anschluss kommentiert werden. Weiter sind unten rechts in Form von Widgets einzelne Zitate von Kunden aufgelistet.

Google Maps Standort des Betriebes
Rezession und Kommentar dazu

Aktivitäten

In einem weiteren Teil werden die Aktivitäten auf einzelnen Seiten präsentiert:

  • Miststocken
  • Schafe zügeln
  • Mausen

Erlebnis buchen / Kontakt

Um auch direkt ein Erlebnis buchen zu können, haben wir ein Contact Form angepasst, damit die einzelnen Erlebnisse ausgewählt und gebucht werden können. Dies ist eine stark vereinfachte Form, da daraus einfach ein Mail generiert wird.

Mein Erlebnis buchen

Im Hintergrund sieht die Konfiguration dann wie folgt aus:

Code für „Erlebnis buchen“

Ein anderes Formular wurde ebenfalls für das Kontaktformular verwendet.

Weitere Features

Im weiteren haben wir folgende Features implementiert:

  • Gewähltes Theme: ColorMag by ThemeGrill
  • Wechselnde Bilder im Header der Webseite
  • Suchfunktion über die ganze Seite
  • Google Analytics implementiert, um genaue Statistiken über die Besuche machen zu können
Google Analytics Auswertung

Animal’s Hair

Animal’s Hair est une société fictive créée pour les besoins du cours « Technologies du Web ».  Tout d’abord active dans le domaine de l’entretien du pelage des animaux, elle a ensuite étoffé son offre en proposant une gamme de produits dédiés au soin des onglons. Finalement, elle s’est lancée dans une service de suivi personnalisé, avec des conseils d’experts.

Le style du site est basé sur le thème « Naturelle ». La page d’accueil contient un en-tête principal, avec le nom de la société et un slogan. S’en suit une courte description de la société et des prestations proposées, ainsi que quelques liens. Une barre de menu présente tout au long du site permet d’accéder aux différentes pages. Quelques modifications ont en outre été apportées au thème principal, directement dans le code.

La page « Produits » permet au client d’avoir un aperçu de la gamme de produits proposée par Animal’s Hair. Elle liste les différentes catégories d’articles vendus et propose des liens vers ceux-ci. On remarquera aussi la présence d’une barre latérale avec une zone de recherche, un calendrier, ainsi qu’une liste de toutes les pages du site. Cette dernière est insérée sur tout le site, sauf sur les pages d’accueil et de contact. Bien que ce site n’ait qu’un but didactique, on pourrait encore étoffer la description des différents produits pour aller plus loin.

La section « Conseil » permet au visiteur de s’inscrire au service de conseil proposé par Animal’s Hair, à l’aide d’un lien vers la page « Contact ». Elle propose aussi différentes vidéos didactiques.

La page « A propos de nous » décrit en détail la société et permet d’accéder aux pages « Collaborateurs » et « Site ». Cette dernière contient en outre une carte permettant l’accès au siège et au magasin d’Animal’s Hair, et a été créée à l’aide du plugin Google Map Embed.

Finalement, une page « Contact » permet au visiteur de contacter Animal’s Hair en cas de question, pour passer commande ou pour s’inscrire au service de conseil. Le formulaire a été réalisé avec le plugin « Contact Form 7 ».

Wedding Website

Du fait que je me marie dans le courant de l’été je me suis dis qu’il était intéressant de faire un site de mariage. Sur celui-ci les invité/es peuvent s’informer, nous contacter mais surtout confirmer leur présence.

J’ai créer une page d’accueil, une du programme de la journée et une page de contact. Sur la page d’accueil j’ai insérer un compte à rebours qui inclut une part de JavaScript.

Ici nos maîtres de cérémonies avec leur contact.

Au fond de la page d’accueil il y a la possibilité de confirmer sa présence ou d’aller à la page suivante.

Lorsque une personne confirme sa présence elle a également la possibilité de confirmer la présence de 4 personnes supplémentaires. Une adresse mail est demandé. La confirmation m’est transmise sur ma boîte mail.

Programme

Sur la page du programme, les personnes ont un court aperçu du déroulement de la journée. Il y a également une carte google map au fond de la page. Cette dernière indique le lieu exact des différents emplacements.

Contact

Sur la page de contact chaque personne à la possibilité de nous contacter via E-mail, Messenger ou Instagram. Elles peuvent aussi contacter 3 nos Maîtres de cérémonies dont les informations personnelles sont sur la page d’accueil.

Webshop „Green Hoppers“

Die fiktive Firma „Green Hoppers“ verkauft in Ihrem Webshop Insekten als Nahrungsmittel. Die Website wurde mit dem Plugin „WooCommerce“ erstellt, dass sich bei Shop-Betreibern grosser Beliebtheit erfreut: 28% aller Webshops wurden mit WooCommerce gebaut. Das Erstellen geht relativ leicht, da bereits der ganze Shop/Warenkorb/Kassen-Teil zur Verfügung gestellt wird. Das Plugin „Jetpack“ wird gleich mitinstalliert. Zu tun geben dann „nur“ noch das Erstellen der Produkte und der generelle Aufbau der Seite.

Die Willkommens-Seite

Die Website besteht momentan aus einer Willkommens-Seite, wo unter dem Willkommen-Banner sofort die Produkte präsentiert werden. Dank der grossen Heuschrecke im Hintergrund weiss der potentielle Kunde gleich um was es geht…

Der Shop selbst

Im Shop gibt es momentan diese drei Produkte, in den Kategorien „verarbeitet“ bzw. „unverarbeitet“. Wie links bei den „Grillen“ zu sehen ist, können Angebote erstellt werden, wo beim Erstellen jeweils nur der Angebotszeitraum und der Angebotspreis angegeben werden müssen, der Rest wird vom Plugin übernommen.
Im Menü auf der rechten Seite, kann der Benutzer zu den Blogbeiträgen wechseln, wo es momentan die beiden Kategorien „Allgemein“ und „Rezepte“ gibt.

Eine Produktseite

Auf der Produktseite wird das Produkt näher beschrieben. Mittels der Links bei „Kategorie“ und „Schlüsselworte“ gelangt der Kunde zu weiteren Produkten. Unterhalb (hier nicht sichtbar) gibt es Platz für eine detailliertere Beschreibung wo Nährwert/Verwendung/Herkunft etc. angegeben werden können, sowie ein Kommentarbereich.

Der Blog

Zu einem guten Webshop gehört natürlich auch ein Blog, wo allgemeine Themen im Zusammenhang mit den Produkten behandelt werden. Beim Green-Hoppers-Shop ergibt es Sinn, regelmässig Rezepte zu veröffentlichen, um die Kunden zu inspirieren und natürlich die Verkäufe anzukurbeln… Auch neu hinzugefügte Produkte könnten im Blog präsentiert werden, um entsprechend Aufmerksamkeit auf diese zu lenken. Auch bei jedem einzelnen Blog-Posting gibt es eine Kommentarfunktion.

Ein Rezept
Der Warenkorb

Es gibt zwar schon einen Warenkorb und eine Kasse, doch es fehlen noch die Zahlungsmethoden um einen „richtigen“ Shop daraus zu machen. Um den Shop zu vervollständigen bräuchte es dann, abgesehen vom Verarbeiten, Lagern, Verpacken und Versenden der Insektenprodukte, eine Datenbank für das Sortiment, den Versand und die Kunden.

WooCommerce soll ein flexibles und vielseitiges Plugin sein, mit dem auch mehrsprachige Shops aufgebaut werden können. Allerdings ist es wohl nicht besonders einsteigerfreundlich und kostet natürlich auch etwas (wie auch Jetpack), wenn man die volle Funktionalität haben will.

Liftgaudi

Die Website, welche wir erstellt haben gehört der Firma Liftgaudi. Ziel der Firma ist es, Getränke mithilfe einer mobilen Bar, direkt an der Talstation eines Skiliftes zu verkaufen. Somit werden sowohl die Wartezeiten als auch die Fahrt zu einem unvergesslichen Erlebnis.

Die Website ist auf sieben einzelnen Seiten Aufgebaut.

Home

Auf der Seite „Home“ ist unsere fiktive Firma kurz beschrieben.

Aktuell

Auf der Seite „Aktuell“ werden aktuelle Ereignisse publiziert.

Angebot

Die Seite „Angebot“ führt zu drei weiteren Seiten weiter. Sowohl im Menu als auch über die Schrift neben den Bildern gelangt man zu den spezifischen Seiten, auf welchen das Angebot genauer beschrieben ist. (Spirituosen, Biere und Softgetränke)

Standort

Der Standort wird via Google Maps angezeigt. Auf My Maps kann der Standort angepasst werden. Er wird anschliessend automatisch auf der Karte aktualisiert.


Philosophie

Dieser Abschnitt der Website enthält die wichtigsten Grundsätze, welche ausschlaggebend für die Gründung des Unternehmens waren.

Team

Auf dieser Seite sind die Mitwirkenden beschrieben.

Rückmeldungen

Dieser Abschnitt besteht aus einem Beitrag und dient dem kommentieren der Firma durch Besucher. Anschliessend kann die Administration entscheiden, ob der Kommentar auf der Seite publiziert wird.


Link zur Website:

Helikopterflug

Die Idee dieser Website ist es den Menschen einen Helikopterflug über die Alpen schmackhaft zu machen. Direkt buchen kann man diesen noch nicht.

Die Startseite meiner Webpage

Hauptsächlich habe ich mit dem PlugIn ELEMENTO gearbeitet um die Seiten zu gestalten. Auf der Startseite habe ich ein Video und den Titel schattiert, alles mit Elemento.

Der Helikopter

Die Seite Helikopter wurde auch mit Elemento gestaltet. Die Sterne sind ein Effekt und der Ordner unten mit Modell, Sicherheit.


Kontaktseite

Die Kontaktseite habe ich mit WordPress und Jetpack erstellt. Die Google Maps erscheint in einem neuen Fenster, wenn man auf die Adresse klickt.

Preistabelle

Die Preistabelle wurde erstellt mit Elemento und einem HTML-Code via Elemento.

Fotogallerie
Beitag

Beitrag von meinem erfundenen Redakteur. Erstellt mit Elemento und auch die Seite ist eine Vorlage von Elemento.

Mein Footer habe ich via WordPress PHP- Footer bearbeitet.

Das Theme der ganzen Website ist eine Vorlage von Elemento.