Animierte Landing-Page mit dunklem Motiv mit Elementor gestalten (kostenloses Plugin) | Ken Mbesa | Skillshare
Suchen

Playback-Geschwindigkeit


1.0x


  • 0.5x
  • 0.75x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Animierte Landing-Page mit dunklem Motiv mit Elementor gestalten (kostenloses Plugin)

teacher avatar Ken Mbesa, Build Beautiful Websites With Elementor

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu allen Kursen
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Wähle aus einer Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

    • 1.

      Einführung

      2:30

    • 2.

      Das Thema installieren

      2:33

    • 3.

      Schnelles Update – Der neue Elementor

      4:25

    • 4.

      Die Elementor

      10:29

    • 5.

      Das Website-Logo

      6:35

    • 6.

      Das Navigationsmenü

      10:29

    • 7.

      Animierte Texte

      13:12

    • 8.

      Animierte Hintergrund

      9:10

    • 9.

      Bild hinzufügen

      9:13

    • 10.

      Hinzufügen von Diensten

      9:43

    • 11.

      Einen Anruf zu Aktion hinzufügen

      8:07

    • 12.

      Erstellen einer Projektgalerie

      13:36

    • 13.

      Teammitglieder

      6:38

    • 14.

      Animierte Zähler

      11:58

    • 15.

      Die neuesten Blog-Beiträge

      13:45

    • 16.

      Hinzufügen eines Formulars

      13:11

    • 17.

      Hilf mir Elementor zu 10.000 Kursteilnehmerinnen und Kursteilnehmerinnen

      2:27

    • 18.

      Hinzufügen einer Google-Karte

      2:21

    • 19.

      Den Fußzeile erstellen

      9:27

    • 20.

      Responsives Design: Die Navbar

      6:26

    • 21.

      Responsives Design: Der Hauptkörper

      7:00

  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Jedes Niveau

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

185

Teilnehmer:innen

2

Projekte

Über diesen Kurs

Lerne mit dem leistungsstarken Elementor eine responsive dark zu entwerfen.

Dieser Anfänger-Kurs bringt dich schnell auf die kostenlosen Tools und Funktionen von Elementor mit sich, die du brauchst, um von Grund auf mobile-friendly Webseiten zu gestalten.

Für wen ist dieser Kurs geeignet?

Wenn du noch nie Elementor benutzt hast, aber anfangen möchtest, ist dieser Kurs perfekt für dich.

Ich habe es für beginner konzipiert, die gerne verstehen, wie man reagierende Webseiten von einem frühen Zeitpunkt auf ihrer Elementor entwirft.

Wenn du diesen Kurs nutzt, wirst du:

  1. Erfahren Sie, wie Sie mit Abschnitten, Spalten, Typografie, Widget-Einstellungen und Medieninhalten arbeiten, um mit den kostenlosen Tools von Elementor reaktionsschnelle Webseiten zu erstellen
  2. Gewinnen Sie mehr Vertrauen in Ihre Fähigkeit, premium auf mobilen Geräten zu entwerfen, die Sie auf Märkten wie Envato und kreativen Markt verkaufen können

Triff deine:n Kursleiter:in

Teacher Profile Image

Ken Mbesa

Build Beautiful Websites With Elementor

Kursleiter:in

Ever since I graduated from college and started working, I've always been driven by a strong desire to make a difference rather than a living.

By making a difference in people's lives through the content I create, I know I will never lack.

I joined Skillshare to (1) Help others learn the web design and 3D modeling skills I've gained over the years and, (2) Learn useful 21st Century skills from other amazing content creators.

I started as a self-taught graphic designer back in 2014 (I'm an Adobe Illustrator and Photoshop expert), then morphed into a WordPress web designer around 2018 (I started with Divi, and now I build websites with Elementor) and learned Blender 3D modeling by taking online courses and watching free tutorials.

I'm also a big fan ... Vollständiges Profil ansehen

Level: Beginner

Kursbewertung

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen auf Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. EINFÜHRUNG: Willkommen zurück zu einer anderen großartigen Elementarklasse mit mir, kann Besser ein WordPress-Experte sein, und ich benutze Elementor seit 4,5 Jahren, um meine Webseiten zu erstellen . Und ich zeige Leuten gerne, wie sie dieselben Fähigkeiten nutzen können , um Landingpages für ihre Websites und für ihre Kunden zu erstellen . In diesem Kurs bringe ich Ihnen bei, wie man eine Zielseite für Fotografen entwirft. Wenn Sie also ein Fotograf sind und wissen möchten, wie Sie eine Zielseite für Ihre Website erstellen können. Dieser Kurs ist für Sie, aber nur Fall, dass Sie kein Fotograf sind, aber dennoch lernen möchten, wie Sie Elementor verwenden um großartige Landingpages zu erstellen. Dieser Kurs ist für dich. Wenn Sie diese Klasse beenden, haben Sie die Fähigkeiten erworben, die Sie benötigen, um mit Elementor erstklassige Landingpages erstellen zu können . , ohne mehr Zeit zu verschwenden Lassen Sie mich Ihnen also die Zielseite zeigen, die Sie in der Klasse entwerfen werden , und dann loslegen. Nur drei. Das entwerfen wir also. Wenn du bereit bist und aufgeregt bist loszulegen, weiß ich, dass ich es bin. Lasst uns gleich eintauchen. 2. Installieren des Themas: Das erste, was wir tun möchten, ist in unser Dashboard zu springen und das Thema zu installieren, das steuert, wie unsere Website aussieht. Und das Thema ist das, was definiert, wie Ihre Website aussieht und funktioniert. Gehen wir also in das Dashboard und wenn Sie mehr über das Thema erfahren möchten, Cisco voraus und suchen Sie nach Tutorials einem WordPress-Theme auf YouTube oder einfach nur Google. In unserem Dashboard möchten wir also in die Erscheinungsthemen eingehen. Und wenn Sie WordPress zum ersten Mal installieren , wird standardmäßig ein Standardthema installiert. Und je nach Jahr wird der Schmerz den Namen desselben Jahres erhalten. Moment sind wir im Jahr 2020 eins, mein Thema ist 2021, aber Sie haben auch 2019 und 2020 für Sie verfügbar, nur für den Fall, dass Sie sie verwenden möchten. Aber was wir tun wollen, ist ein anderes Thema namens Astra zu installieren . Und wie Sie sehen können, ist Astra eines der hier aufgeführten Themen , da es eines der Themen ist, die ich am häufigsten verwende. Es muss für mich zu den Top gehören. Aber für den Fall, dass Sie es nicht sehen können, geben Sie Astra hier in die Suchleiste ein. Astra-Überschreibung. Also werde ich es am Freitag installieren. Also lasst uns weitermachen und aktivieren. Klicken Sie also auf Aktivieren. Und jetzt ist unser aktives Thema Astra, wie Sie hier in diesem Pop-up sehen können. Und sie haben diese Nachricht, mit der Astro geliefert wird nicht so bereit, Startervorlagen zu verwenden und all das. Aber wir lernen, unsere eigenen Webseiten von Grund auf neu zu erstellen . Also schließe ich das und schließe die Nachricht genau dort. Jetzt, da wir jetzt das Astra-Theme verkauft und aktiviert wurden , können wir, wenn wir bereit sind, etwas über Elementor zu erfahren, elementor zu installieren und einen Überblick über den elementaren Arbeitsbereich zu haben. Also lasst uns das in der nächsten Klasse machen. Wir sehen uns in Kürze. 3. Schnelles Update – Der neue Elementor: Willkommen zurück. Diese Lektion ist nun eine kurze Randnotiz oder eine kurze Aktualisierung des Elementor-Installationsprozesses. Wenn Sie an diesem Kurs im Mai 2022 und darüber hinaus teilnehmen, werden Sie feststellen, dass die Elementor-Aktivierung jetzt über einen Setup-Assistenten verfügt , der aus mehreren Schritten besteht, die Sie ausführen müssen , der aus mehreren Schritten besteht, die Sie ausführen müssen, um die grundlegenden Teile von deine Webseite. Während ich diese Klasse vor einigen Monaten erstellt habe, hatte Elementor diesen Setup-Assistenten nicht. Also möchte ich nur, dass wir den Setup-Assistenten durchgehen. Aber alles andere, was du in diesem Kurs lernst , ändert sich nicht. Es ist immer noch derselbe Prozess. Die einzige Ergänzung ist der Setup-Assistent. Wie Sie jetzt sehen können, habe ich eine brandneue Installation von WordPress und wir sind bei Version 6. Und was ich tun möchte, ist zu Plugins, Add New. So können wir Elementor hinzufügen und diesen Prozess durchlaufen. Ich suche jetzt nach Elementor-Installation. Und jetzt, wenn ich auf Aktivieren klicke werde ich zu diesem Setup-Assistenten weitergeleitet. Und wir können es zusammen durchstehen. Also hier sind wir. Ich zoome nur ein bisschen heraus damit wir mehr Details sehen können. In Ordnung, jetzt werden Sie feststellen dass das erste, was Elemental von uns verlangt ist, ein Konto zu erstellen, um das Beste aus Elementor herauszuholen. Dies sind also einige der Vorteile, die sich aus der Anmeldung für ein Konto bei Elementor ergeben. Aber die Sache ist, dass du kein Konto bei Elementor haben musst , um Elementor nutzen zu können. Also überspringe ich diesen Teil einfach. Der zweite Schritt besteht darin, das heilige Thema, das Elementor für uns gemacht hat, zu akzeptieren und fortzusetzen . Dies wurde von Elementor erstellt, aber wir verwenden das Astra-Thema, also überspringen wir einfach. Astra ist ein mächtigeres Thema. Der dritte Schritt besteht darin, unserer Website einen Namen zu geben. Während du dein WordPress installiert hast. Sie haben der Website einen Namen gegeben. Das ist der Name, der hier auftauchen wird. Dies gibt uns jedoch die Möglichkeit, den Namen in einen anderen Namen zu ändern, den wir möchten. Meine Website, und dann klicken wir auf Weiter. Und wenn Sie ein Logo für Ihre Website haben und es jetzt im Voraus hinzufügen möchten. Sie können einfach die Medienbibliothek öffnen und sie aus der Medienbibliothek auswählen oder von Ihrem Computer hochladen. Aber das werden wir jetzt nicht tun. Also behalte ich diesen Schritt einfach bei. Und natürlich können wir das Logo später hinzufügen und ich zeige Ihnen, wie das geht. Klicken wir auf „Überspringen“. Und jetzt kommen wir zum allerletzten Schritt bei dem wir zwei Möglichkeiten haben. dem Elementor-Editor können wir unsere Homepage von einer leeren Leinwand aus bearbeiten Mit dem Elementor-Editor können wir unsere Homepage von einer leeren Leinwand aus bearbeiten. Oder wir können in Hunderten von Vorlagen stöbern oder unsere eigenen Vorlagen importieren, wenn wir sie haben. Aber ich mache weiter und überspringe. Das. Wird auf die Leinwand umgeleitet, wo wir jetzt mit dem Aufbau einer Website beginnen können. Und los geht's. Also im Grunde war das alles, was ich dir zeigen wollte. Es ist ein neues Update. Es war vor ein paar Monaten nicht da. Jetzt ist es da. Aber alles andere in den kommenden Lektionen bleibt gleich. Der Prozess zum Erstellen einer Landingpage bleibt immer noch derselbe. Also, ohne weitere Zeit zu verschwenden, fahren wir mit der nächsten Lektion fort. Ich gehe zu diesem Burger-Menü und klicke auf Exit to Dashboard. Verlassen wir diese Seite. Jetzt befinden wir uns im Dashboard und können mit dem Aufbau der Website beginnen. 4. Die Elementor: Willkommen zurück. In der vorherigen Lektion haben wir das Astra-Theme installiert und aktiviert. Wir sind jetzt bereit elementor zu installieren und haben einen schnellen Überblick über die Elemente sind Workspace. So können wir uns mit den Tools und Funktionen vertraut machen mit denen wir uns beim Aufbau unserer Zielseite befassen . Also lasst uns weitermachen und das machen. Lasst uns Elementor installieren. Also gehe ich rein, ich gehe einfach weiter und klicke zunächst auf Plugins. Und da dies eine brandneue Installation von WordPress ist , muss ich bereits Standard-Plugins installiert haben. Also gehe ich einfach weiter und wähle beide aus. Und in diesem Dropdown-Menü wähle ich Löschen aus und wende es dann an. Lasst uns sie löschen. Und jetzt haben wir eine saubere Weste, mit der wir arbeiten können. Also klicke ich weiter und klicke auf Neu hinzufügen. Und wir werden zum WordPress-Plugin-Repository , wo wir nach Elementor suchen können. Es sollte das erste Ergebnis bei über 5 Millionen aktiver Installation sein. Ich fahre fort und klicke auf Jetzt installieren. Und Sie werden feststellen, dass wir hier viele andere Plug-Ins haben , die den Namen Elementor enthalten. Warum ist das also? Andere Entwickler können Funktionen, Tools und Funktionalitäten erstellen , um die Leistungsfähigkeit von Elementor zu erweitern. Und diese Leute haben das getan, weil Elementor selbst, wie Sie sehen können , von Elemental.com erstellt wird, aber diese anderen Plugins von Drittanbietern werden von Drittanbietern entwickelt. Wir werden also einige dieser Plugins genau hier verwenden , während wir unsere Zielseite erstellen, und Sie werden wissen, welches Plug-In spielt, welche Zeile. Aktivieren wir Elementor jetzt, wo es installiert ist. In Ordnung, jetzt haben wir nur ein Plugin installiert und dieses Elementor. Lassen Sie uns also eine Seite erstellen, damit wir den elementaren Workspace öffnen können. Also gehe ich in die Seiten, alle Seiten. Und wie ich bereits erwähnt hatte, ist dies eine brandneue Installation von WordPress. Also muss ich hier bereits Standardseiten erstellt haben, aber ich brauche diese beiden nicht, also wähle ich die beiden aus. Und in diesem Dropdown-Menü gehe ich in den Papierkorb und wende das an. Jetzt haben wir keine Seite, also sage ich „Neu hinzufügen“. Und wir können unserer Seite einen Namen geben. Sagen wir also zu Hause. Nehmen wir an, das ist unsere Homepage. Genau hier ganz rechts. Unter Vorlage wähle ich im Dropdown-Menü Elementor volle Breite aus. Dann klicke ich auf „Veröffentlichen“. Und jetzt ist unsere Seite veröffentlicht. Und jetzt, da wir unsere Seite bereit haben, klicken wir auf Bearbeiten mit Elementor wird zum Frontend weitergeleitet , wo wir die Seite bearbeiten werden. Also hier sind wir im Frontend. Und wenn wir die Seite bearbeiten, wird sie genau so aussehen. Also bearbeiten wir die Seite tatsächlich und sehen die Ergebnisse in Echtzeit. links, genau hier, haben wir diesen unteren Bereich genau hier. Dieser untere Bereich hier hat ein paar Optionen. Wir haben den Update-Button, da wir hier Änderungen vornehmen , klicken wir auf Aktualisieren. Und wir klicken hier auf das Symbol für die Vorschauänderungen , um die Seite mit den Änderungen und ohne diese Tools anzuzeigen . Und hier haben wir den Responsive-Modus. Hier klicken wir, wenn wir unsere Seite auf verschiedene Bildschirmgrößen, Smartphones, Tablets und Desktops reagieren möchten unsere Seite auf verschiedene Bildschirmgrößen, Smartphones, Tablets und Desktops reagieren . Und das machen wir so wie wir, während wir diese Zielseite ansprechen. Und das Nächste hier ist der Verlaufsbereich in dem wir hier eine Liste aller Schritte haben, mit denen wir vorgenommen wurden, alle Änderungen, die wir vorgenommen haben, wenn wir unserer Seite in dieser Sitzung Elemente hinzufügen . Wenn ich zum Beispiel einen zweispaltigen Abschnitt wie diesen hinzufüge und dann vielleicht einen dreispaltigen Abschnitt wie diesen hinzufüge. Jetzt haben wir zwei Dinge hinzugefügt. Wenn wir also in den Verlauf eingehen, werden Sie feststellen, dass wir diesen Abschnitt zuerst hinzugefügt haben und dann diesen Abschnitt hinzugefügt haben. Und wir können direkt hier klicken, um zu dem Zeitpunkt zurückzukehren , an dem wir nur diesen Abschnitt hatten. Dies ist also wie ein Zeitreisegebiet, in dem Sie zu einem bestimmten Zeitpunkt gehen können in dem Sie zu einem bestimmten Zeitpunkt gehen Sie bestimmte Änderungen hatten, als Sie nur bestimmte Elemente auf eine bestimmte Art und Weise aussahen. Und wir werden sehen, wofür all diese anderen Optionen es gibt. Aber der Teil wird mit dem meisten interagieren , ist dieser Bereich hier. Und dies ist der Bereich, der uns alle Tools und Funktionen bietet , die wir hinzufügen möchten, alle Elemente, die wir unserer Website hinzufügen möchten. Wenn Alco zum Beispiel dieses Panel reduziert hat, werden Sie feststellen, dass wir ein anderes Panel haben, auf dem Pro steht. Die Tools im Basic-Panel sind also kostenlos. Wenn wir das reduzieren und in das Panel gehen, werden Sie feststellen, dass sie die kleine Sperre genau hier haben , um zu zeigen, dass diese Tools nicht dorthin gezogen und abgelegt werden können, wenn Sie versuchen zu ziehen . Dieses Popup, das besagt, dass Sie es müssen, müssen Sie die Pro-Version von Elementor haben , um diese verwenden zu können. Und dann lasst uns das zusammenbrechen. Dann haben wir mehr unter den allgemeinen und viele andere Tools unter all diesen Panels eingebettet. Wir werden also mit den Panels arbeiten, die die freien Elemente haben, weil sie mehr als genug sind , um die Dinge zu erreichen, die wir benötigen, um diese Zielseite genau hier zu erreichen. Die andere Sache, die ich hier erwähnen wollte , ist , dass wir beim Hinzufügen von Plugins an die Plugins von Drittanbietern erinnern, die wir hinzugefügt haben mich in das Dashboard gehen lassen und in Plugins gehen lassen. Sagen wir „Neu hinzufügen“. Lass mich nach elementaren suchen. Denken Sie also an diese Plugins von Drittanbietern über die wir gerade gesprochen haben. Wenn wir ein Plugin von Drittanbietern installieren, das erstellt wurde, um die Leistungsfähigkeit von Elementor zu erweitern, wie wichtige Add-Ons für Elementor, werden wir dies später installieren. Es wird genau hier als Panel auftauchen. So wichtige Add-Ons für elementar, wir mit all den zusätzlichen Tools auftauchen werden dass wir mit all den zusätzlichen Tools auftauchen werden, die es in Elementor einbringt. Und Sie werden feststellen, dass einige dieser Funktionen, die mit diesem neuen Plugin kostenlos sind diesem neuen Plugin kostenlos sind hier in der Elementor Pro-Version aufgeführt sind. Während Elementor selbst diese Tools auflädt, haben diese Leute Tools erstellt , die dasselbe tun, aber kostenlos zur Verfügung gestellt werden. Und noch etwas, sagen wir, wir sind drin. Wir sind hier drin und bearbeiten Sachen und wir möchten etwas hinzufügen. Wir wollten ein Tool, ein Element, von hier aus ziehen , aber wir können es nicht sehen, weil wir im Moment was wir diese Einstellungen für diesen Abschnitt haben, fortfahren und genau dort auf dieses Menü klicken können. Und es werden diese Panels aufrufen, die Werkzeuge haben. Wenn Sie diese Tools nicht sehen können, klicken Sie auf dieses winzige Symbol genau hier und es werden die Tools angezeigt. Dann haben wir hier mehr Einstellungen, mit denen wir interagieren können, während wir Fortschritte machen. Das ist also ein schneller Überblick über den elementaren Arbeitsbereich. Und um mit dem Erstellen einer Webseite zu beginnen, müssen wir nur einen Abschnitt erstellen. Und die Abschnitte sind nach den verschiedenen gängigen Anwendungsfällen strukturiert . So können wir eine doppelte Spalte wie diese haben. Und jetzt ist dies ein zweispaltiger Abschnitt. Die Spalten sind durch diese gebrochenen schwarzen Linien abgegrenzt. Und der Abschnitt ist durch diese blaue Grenze abgegrenzt. Und wir können die Größe ändern, und wir können die Spalten einfach ziehen , um die Größe zu ändern, wenn wir möchten. Und wir können auch mit der rechten Maustaste klicken und eine Spalte duplizieren. Und jetzt haben wir drei Spalten. Um Elemente innerhalb einer Webseite hinzuzufügen, müssen wir nur auf das Pluszeichen klicken oder darauf klicken, um die Tools anzuzeigen. Wenn ich also klicke, werden die Elemente angezeigt und wir können jetzt nacheinander mit dem Ziehen beginnen . Und jetzt, wenn wir ein Element aktiv haben, wie jetzt ist es das Bild, das wir bearbeiten, der Elementname ist, der hier erscheinen wird. Welches Element auch immer hier ausgewählt wird , ist das Element, das hier oben angezeigt wird. Wenn ich diesen Abschnitt auswähle, bearbeiten wir jetzt den Abschnitt. Wenn ich dieses Bild auswähle, bearbeiten wir jetzt das Bild, was bedeutet, dass diese Einstellungen für das Bild oder rechts gelten, also ist das nur ein schneller Überblick über die Elemente, die Workspace sind. Ich hoffe, Sie kennen jetzt einige der Tools und Funktionen von Elementor, mit denen Sie interagieren werden. Aber natürlich werden Sie verstehen, wie meisten dieser anderen Dinge verwenden können, die wir beim Erstellen einer Landingpage nicht berührt haben, denn das ist tatsächlich der Grund warum wir diese Klasse haben der erste Ort, damit Sie sich an die Arbeit mit Elementor gewöhnen können. Das nächste, was wir jetzt tun wollen, wenn ich zu unserem Bezugspunkt springen könnte ist die Navigationsleiste zu bauen. Und die Navbar besteht aus zwei Dingen, dem Logo und dem Website-Menü. Beginnen wir also damit, das Website-Logo hinzuzufügen. Lass uns das in der nächsten Klasse machen. Wir sehen uns in Kürze. 5. Das Adding hinzufügen: Willkommen zurück zu einer weiteren fantastischen Lektion. Es ist also an der Zeit, unsere Website-Navigationsleiste hinzuzufügen. Und wir möchten mit unserem Logo beginnen. Aber hier ist das Ding. Wir müssen ein Plugin hinzufügen, das uns hilft, diese Napa zu erstellen , da es nur ein eigenständiges Element ist. Also möchten wir ein Plugin installieren. Also gehen wir in Plug-Ins im Dashboard ein. Plugins fügen eine neue Suche nach Elementor hinzu. Und das wird diese elementaren Plugins genau hier aufrufen . Und wir suchen nach Header-Ordner-Builder für Elementor so oder Jahr genau hier, wird Elementor Header Footer Builder jetzt mitgeteilt. Und lasst uns das aktivieren. Jetzt ist Elementor Kopf- und Fußzeilengenerator aktiviert und wir können über das Erscheinungsbild darauf zugreifen. Elemente sind Kopf- und Fußzeilen-Builder. Lasst uns weitermachen und darauf klicken. Und da wir noch keine Kopf- oder Fußzeile erstellt haben, haben wir hier keine aufgeführt, also lasst uns fortfahren und erstellen, Neu hinzufügen. Und wir können das überspringen. Das brauchen wir nicht. Und wir geben unserem Nav-Header einen Namen. Also lass uns weitermachen und es nennen, nenne es wie du willst. Also nenne ich es einfach mein Navi. Es ist eine Nav-Bar. Und wir haben all diese Möglichkeiten direkt vor uns. Als Nächstes möchten wir den Vorlagentyp auswählen. Es ist ein Header. Und das wird diese Optionen direkt hier unter dem Display aufrufen . Wo sollten wir entscheiden, ob die Navbar auf der gesamten Website angezeigt werden soll , unabhängig davon, welche Webseite Sie besitzen, sollten Sie die Navigationsleiste weiterhin in den Top-Benutzerrollen haben können . Lass uns weitermachen und alles sagen. Das heißt, wenn Sie ein Administrator sind und Personen unter sich haben , die auch die Website bearbeiten. Sie können einschränken, wer Ihre Navigationsleiste bearbeiten kann, damit jeder sie bearbeiten kann. Ich lasse es überhaupt. Und dann mal sehen, genau hier ganz rechts möchte ich in die Vorlage gehen, die Fehler ändern das in Elementor volle Breite. Und unter den Astro-Einstellungen möchte ich unter die Seitenleiste gehen und kein Seitenleisten-Inhaltslayout sagen , volle Breite gestreckt. Und lassen Sie uns diese Standardeinstellungen deaktivieren, die mit Astra primär geliefert werden, und sagen wir „Veröffentlichen“. Jetzt ist unsere Navigationsleiste veröffentlicht. Wir wollen ins Frontend gehen und anfangen, es so auszusehen. Was wir also tun müssen, ist mit Elementor bearbeiten zu klicken. Aber bevor wir das tun, möchte ich nur ins Aussehen gehen Elementor, Kopf- und Fußzeilenbauer. Und Sie werden feststellen, dass wir es jetzt hier aufgelistet haben. Wir haben es gerade erstellt und jetzt ist es unter unserem Plugin aufgeführt. Wenn ich also auf Bearbeiten klicke, wird es zu dieser Seite zurückgeführt und wir können jederzeit Änderungen an diesen Einstellungen vornehmen. Dann klicken wir auf Edit with Elementor. Und jetzt wurden wir ans Frontend gebracht, wo wir jetzt mit dem Bau der Nav-Bar beginnen können . Gehen wir also hinein, sagen wir „Neu hinzufügen“ und wir fügen einen zweispaltigen Abschnitt hinzu. Und jetzt können wir diese Spalte so ziehen , dass sie kleiner als die rechte Spalte da diese Spalte natürlich länger ist als die dann die Logo-Spalte. also wieder reingehe, klicke ich auf das Pluszeichen. Und dann ziehen wir ein Bildelement da rein. Und jetzt können wir unser Logo hier reinlegen. Und denken Sie daran, denn dies ist unser aktives Element das wir hier bearbeiten und wir können dort hineinklicken und unser Logo hinzufügen. Und da ich noch keine Bilder hinzugefügt habe, wähle ich Dateien hochladen aus und wähle Dateien aus. Und ich hatte diesen Assets-Ordner bereits hier vorbereitet. Wenn Sie es öffnen, enthält es alle Elemente, die auf der Website verwendet werden. Das bedeutet, Bilder einzuschließen. Alle Bilder sind da. Nur wenn du mitmachen willst, kannst du dieselben Bilder verwenden, die in meiner Arbeit verwendet werden. Wir haben auch die fertigen Ergebnisse genau hier. Sie können diese Landingpages also importieren und sie sehen genau wie unser Land, unsere letzte Landingpage und wir haben das Logo. Also importiere ich den Login vorerst. Doppelklicken Sie darauf. Und jetzt, da es importiert wurde, klicke ich auf Medien einfügen. Und jetzt ist unser Image wichtig, aber weil diese Hälfte des Namens weiß ist, können wir es vorerst sehen. Lassen Sie uns also etwas gegen die Hintergrundfarbe unternehmen. Also klicke ich zuerst auf Update the. Und jetzt geh in dieses Burger-Menü. Klicken Sie auf die Einstellungen der Burger-Menüseite. Und ich geh rein. Hintergrund, Hintergrundtyp. Klicke das an. Und in diesem kleinen Feld hier ziehen Sie das einfach und ändern Sie die Hintergrundfarbe in Schwarz und aktualisieren Sie es dann. Damals hat die gesamte Website einen schwarzen Hintergrund. Schließen Sie diesen blauen Bereich und kehren Sie zu unserem Bearbeitungsbereich zurück. Überschreiben. Lassen Sie uns also eine Vorschau der Änderungen anzeigen. In. So sieht unser Logo aus. Das nächste, was wir tun wollen, ist unser Website-Navigationsmenü hinzuzufügen, und das machen wir in der nächsten Klasse. Wir sehen uns in Kürze. 6. Das Navigationsmenü hinzufügen: Willkommen zurück. Es ist jetzt an der Zeit, ein Navigationsmenü der Website hinzuzufügen. Springen Sie also wieder in unseren Arbeitsbereich. Was wir also tun wollen, ist in dieses Feld zu gehen und auf das Pluszeichen genau dort zu klicken. Und hier drin tippen wir nav. Und wir haben hier ein paar Navigationsmöglichkeiten. Aber denken Sie an eines der Plugins, wir haben gerade den IIS-Header-Footer-Builder für Elementor installiert , und dafür haben wir HF hier. Also ziehen wir das und lassen es genau dort fallen. Jetzt erwarten wir ein Menü, aber es gibt kein Menü. Lassen Sie uns also eine Vorschau anzeigen, um die Änderungen zu sehen. Keine Speisekarte hier. Was passiert also? Nun, das ist immer noch ausgewählt. Wenn Sie sich diesen Bereich hier ansehen, werden Sie feststellen, dass es keine Menüs auf Ihrer Website gibt . Gehe zum Menübildschirm, um einen zu erstellen. Also müssen wir in das WordPress-Dashboard gehen und ein Menü erstellen, das wir hier in diesem Feld anzeigen werden . Was ich tun möchte, ist in einer anderen Registerkarte, gehe in das Dashboard. Also klicke ich darauf und gehe zurück ins Dashboard, gehe zurück ins Dashboard solange dieser Tab noch geöffnet ist. Und ich möchte in die Optikmenüs gehen. Und jetzt hier drin werden Sie feststellen, dass das erste, was ganz oben hier ist, die Bearbeitungsmenüs des Menüs stehen. Erstellen Sie unten Ihr erstes Menü. Und wir können weitermachen und ein Menü erstellen. Also geben wir ihm einen Namen. Meine Speisekarte. Und machen wir es zum Hauptmenü und dann zum Menü Erstellen. So erstellen Sie ein WordPress-Menü, das dann im Frontend angezeigt werden kann. Beachten Sie jetzt, dass wir das Menü bereit haben, es heißt Menüelemente aus der linken Spalte hinzufügen, diese Spalte hier. Dies sind unsere Menüpunkte. Dies sind Menüpunkte 1, 2, 3, 4, 5, 6 Menüpunkte. Dann können die Menüelemente Webseiten sein, können Blogbeiträge sein, benutzerdefinierte Links, die Sie erstellt haben. Sie können Inhaltskategorien sein. Was wir also erstellen müssen, Sie können jeden dieser Arten von Inhalten erstellen und als Menüpunkte in Ihrem Menü anzeigen. Ich möchte vorerst nur benutzerdefinierte Links erstellen, wir konzentrieren uns auf die Landing Page sodass wir keine Seiten mehr benötigen. Also erstelle ich eine benutzerdefinierte URL. Ich füge einfach einen Hashtag ein. Ich kann verwenden, dass Hashtag ein Platzhalter für eine imaginäre URL ist , auf die dieser Link verweisen könnte. Aber jetzt sagen wir einfach über Zum Menü hinzufügen. Und jetzt ist es ein Menüpunkt. Ich füge eine weitere, eine weitere URL hinzu, nur einen weiteren Hash. Nennen wir diesen Blog. Aber natürlich wäre dies in einem realen Szenario etwas wie der HTTP-Schrägstrich www dot. Vielleicht, wenn Sie ein YouTube-Video haben , das Sie als Menüpunkt mit jemandem teilen möchten . Aber natürlich lassen wir es uns jetzt einfach als Hash belassen. Zum Menü hinzufügen. Und das mache ich noch zwei Mal. Noch ein Mal. Zum Menü hinzufügen. Und jetzt haben wir vier Menüpunkte. Also gehe ich weiter und speichere das Menü. Und weil wir unser Menü gespeichert haben, wenn wir jetzt in unseren elementaren Arbeitsbereich gehen , in dem wir unseren Header erstellt haben, wenn wir diese Seite aktualisieren, drücke ich Control R oder wenn Sie auf einem Mac sind Befehl R. Ordnung, Jetzt werden unsere vier Menüpunkte in diesem Element angezeigt , das vom Hetero Folder Builder für Elementor, dem von uns installierten Plug-In, eingebracht wurde , das vom Hetero Folder Builder für Elementor, dem von uns installierten Plug-In, . Und weil es jetzt ausgewählt ist. Wenn Sie sich den Ort anschauen, der die Nachricht hatte , dass wir kein Menü hatten. Jetzt haben wir dieses Dropdown-Menü und es listet unser Hauptmenü als eines der Menüs auf. Wenn wir vier Menüs hatten, werden diese in diesem Dropdown-Menü aufgeführt. Und Sie können hier auswählen, welche vielen Sie zeigen möchten. Das war's also. Also aktualisiere das. Und obwohl dies noch ausgewählt ist, können Sie es auswählen, indem beliebige Stelle innerhalb dieses blauen Rahmens klicken. Also klicke ich irgendwo da drin. Und obwohl es noch ausgewählt ist, gehe ich ins Layout. Unter Achsen klicke ich auf Rechte, um das Menü auf die rechte Seite zu schieben . Und dann sage ich, hey da. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Und jetzt nimmt unsere Speisekarte jetzt Gestalt an. Aber natürlich müssen wir einige Änderungen vornehmen, wie diesen Hover-Effekt. Und dieser letzte Gegenstand muss ein Button sein. Also lasst uns sehen, wie das geht. Geht hier rein. Während dies noch ausgewählt ist, reduzieren Sie das Layout und gehen Sie in das Menü und wir haben den letzten Menüpunkt. Ich gehe weiter und drücke den letzten Item-Button. Und das wird es in einen solchen Knopf ändern. Aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Da haben wir es also. Das nächste, was wir tun wollen, ist die Schwebefarbe zu ändern. Zuallererst zeigen die Standardfarbe der Links und dann ihre Hoverfarbe und die Schaltflächen das Verhalten. Gehen wir also hier rein und sehen wie sich unsere Referenz verhält. Wenn es aktiv ist, ist es beim Schweben gelb, es ist gelb, aber standardmäßig ist es breit. Also lasst uns hier rein gehen. Während das Navigationsmenü noch ausgewählt ist, gehe ich in den Stil. Und das erste, was wir tun wollen, ist das Hauptmenü einzuklappen. Sie werden feststellen, dass wir hier vier Panels für Dropdown-Menüs haben. Fangen wir mit einem Knopf an. Klicken Sie auf die Schaltfläche. Und zuerst ändern wir die Textfarbe genau hier in Weiß. Und dann ändern wir den Hintergrundtyp der Schaltfläche von diesem Grün. Also lasst uns diese Farbe ändern. Und ich möchte diese Farben hochziehen. Ich habe diese Farben in diesem Dokument genau hier, die ich in den zuvor erwähnten Assets-Ordner aufgenommen habe. Sie finden es in der folgenden Beschreibung. Lasst uns also genau dort die gelbe Farbe schnappen , leuchtend gelb. Ich möchte diesen Code holen. Geh wieder rein und füge es hier ein. Und jetzt ist unser Knopf so gelb. Klicken wir irgendwo drin, um diese Box loszuwerden. Und dann wollen wir beim Schweben zurückgehen und Hintergrundtyp sagen. Sollte es sein. Lass uns wieder reingehen und das kopieren. Gehen wir wieder rein und fügen das da rein. In unserem eigenen Hover ist der Button so rot. Lasst uns das aktualisieren. Als Nächstes wollen wir die Link-Farben ändern. Also lasst uns diesen Knopf zusammenbrechen. Und lass uns ins Hauptmenü gehen. Lass uns nach Topographie suchen. Die Textfarbe sollte weiß sein, also ziehen Sie diese ganz nach oben. Und beim Schweben muss es gelb sein. Also klicke ich darauf. Und ich geh da rein und schnappe mir das Gelb. Füge es da rein. Und jetzt ist es gelb. Mal sehen, wie es aktiv aussieht. Wenn aktiv, keine Farbe, also gebe ich ihm das gleiche Gelb. Dann aktualisiere das. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Und jetzt verhält sich unsere Navbar genau wie erwartet. Schauen wir uns also unsere Referenz an und die Schriftart hier ist schwarz. Gehen wir also hier rein und ändern den Kontakt in Schwarz. Das Zusammenklappen des Hauptmenüs und das Öffnen der Tastenfarbe sollten im normalen Zustand schwarz sein. Lasst uns das aktualisieren. Und auf dem Schweben muss weiß sein. Aktualisiere das. Und lasst uns eine Vorschau sehen. Es ändert sich. Standardmäßig ist es beim Schweben schwarz, Weiß. Großartig. Also gefällt mir, wo wir mit der Nav-Bar erreicht haben. Jetzt können wir den Heldenbereich mit diesem animierten selbsttippenden Text erstellen . Wir sehen uns in Kürze. 7. Den animierten Text hinzufügen: Willkommen zurück. Im Moment möchten wir diese animierten Texte gleich hier hinzufügen . Dies ist ein sehr schöner Ort, um wichtige Keywords hinzuzufügen , an die sich Besucher erinnern sollen , oder die Besucher dem Moment, in dem sie auf Ihrer Seite landen, im Auge behalten sollen. Es ist ein netter Ort, um die Leute sehr kurz über etwas zu informieren , von dem sie wissen sollen. Also lasst uns sehen, wie das geht. also genau hier in unser Dashboard springen, möchten wir ein Plugin hinzufügen, das es uns ermöglicht, diesen dynamischen Text zu haben. Also gehen wir in Plugins, Add New, und wir geben wichtige Atome ein, die nur typessentiell sind , da sie das erste Ergebnis von WP-Entwicklern sein sollten . Und Sie werden feststellen, dass es wichtige Add-Ons für Elementor sind. Denken Sie daran, dass diese Plugins, von denen wir sagen, dass sie von Drittanbietern entwickelt wurden , um Elementor zu erweitern. Das ist einer von ihnen. Also lasst es uns jetzt installieren. Ende. Es hat mehr als eine Million aktive Installationen. Nur um dir zu zeigen, wie cool das Plugin einfach oder richtig ist, also lass es uns aktivieren. Und in diesem Setup-Assistenten hier können Sie fortfahren und auswählen, welche Option Sie möchten. Aber weil Sie es sind, gehe ich davon aus, dass Sie Anfänger sind, können Sie mit den empfohlenen Grundeinstellungen arbeiten. Also lasst uns zum nächsten gehen. Und dies sind die Einstellungen, die Sie akzeptiert haben indem Sie die grundlegende Nächste auswählen. Lass uns als Nächstes gehen. Als Nächstes. Installieren Sie in Ihren Tagen nicht oder installieren Sie keine davon, wenn Sie möchten. Als nächstes beende das. In Ordnung, jetzt haben wir wichtige Add-Ons für Elementor installiert und wir haben Zugriff auf all diese neuen Funktionen, die elementar erweitern. Gehen Sie also wieder hinein, wo unser elementarer Arbeitsbereich hier ist. Also werde ich diesen Workspace aktualisieren, indem ich auf dem Mac auf Control R oder Command R klicke. Und wie ich bereits erwähnt hatte, Sie feststellen, dass wir hier mehr, werden Sie feststellen, dass wir hier mehr, mehr Panels hinzugefügt haben, weil wir in der vorherigen Lektion Elementor, Header, hinzugefügt haben und Footer Builder. Und im Moment haben wir gerade wichtige Erwachsene hinzugefügt. Und wenn wir das erweitern, hat es zusätzliche Elemente, die wir hier hineinziehen und unsere Landing Page erreichen können . Eine dieser Funktionen ist also kalter, ausgefallener Text. Was ich also tun will und ich habe mich gerade daran erinnert, ist, dass wir uns immer noch im Header-Arbeitsbereich befinden. Was wir tun wollen, ist diesen Arbeitsbereich zu verlassen denn jetzt sind wir fertig mit der Bearbeitung der Navigationsleiste. Beenden wir also, indem wir darauf klicken , und lassen Sie uns das Dashboard verlassen. In unserem Dashboard werden Seiten eingeblendet. Und wir haben die Homepage, die wir zuvor erstellt haben, und das verwenden wir als Zielseite. Also werde ich mit Elementor bearbeiten , falls Sie diese Option nicht haben, bedeutet dies, dass Sie nicht mit Elementor bearbeiten geklickt haben. Wir können auf „Bearbeiten“ klicken. Und je nachdem, wie Ihre Seite aussieht, klicken Sie einfach auf Mit Elementor bearbeiten, wo immer die Schaltfläche ist. In unserem, in dem Bereich, in dem wir den Hauptinhalt der Zielseite bearbeiten . Das erste, was Sie bemerken, ist, dass wir dieses Foto genau hier haben, das wir nicht lügen. Gehen Sie also zurück in das Dashboard, innerhalb der Seiten, alle Seiten Home. Sie werden feststellen, dass wir dieses kleine Astra-Einstellungssymbol hier oben haben. Klicken Sie auf dieses Symbol. Und unter Site-Layout sagen wir keine Seitenleiste, volle Breite gestreckt. Das ist okay. Dann deaktivieren wir den obigen Header. Deaktivieren wir den primären Header unter Kopfzeile, dem mobilen Header und dem Titel. Lassen Sie uns das Featured Image deaktivieren und den Ordner deaktivieren. Dann lasst uns das aktualisieren. Und jetzt klicke ich auf Mit Elementor bearbeiten oder gehe direkt zu dieser Seite zurück und aktualisiere sie. Lass es mich einfach auffrischen. Jetzt ist die Fußzeile weg. Das erste, was wir tun möchten, ist, einen einzelnen Spaltenabschnitt mit voller Breite hinzuzufügen . Das hier genau hier. Klicken wir dort auf das Pluszeichen und ziehen Sie hier hinein und ziehen Sie hier hinein. Und es wird diese Elemente durch wichtige Add-Ons für Elementor, das gerade installierte Plugin, aufrufen wichtige Add-Ons für Elementor, . Das lasse ich jetzt am Ende fallen , weil es das aktive Element ist. Hier oben steht „Ausgefallenen Text bearbeiten“. Das erste, was wir tun wollen, ist die Anatomie dieses Elements zu betrachten . Es hat diese drei Strings und sind diese drei Wörter, die sich hier ändern. Und dann haben wir diese ersten drei für Wörter, die sich nicht ändern. Das sind die Präfixtexte, damit wir das loswerden können. Und wir haben die Suffixtexte, die aus dem Satz stammen, des Satzes. Lasst uns das auch entfernen. Und lasst uns einen Punkt hinzufügen, einen vollständigen Stopp da drin. Damit wir es haben, denken Sie daran, dass wir diesen gelben Vollstopp hier haben. Also geh wieder hier rein. Lasst uns jetzt ändern, was diese Worte sagen. Lassen Sie uns das in etwas Kreatives ändern. Lassen Sie uns den zweiten zum Fotografen, Videofilmer, ändern . Videofilmer. Und lasst uns das aktualisieren. Also jetzt die drei Wörter, lasst uns eine Vorschau der Änderungen anzeigen oder rechts, also haben wir gerade das. Das nächste, was wir tun wollen, ist, mich diese zusätzlichen Seiten einfach hier schließen zu lassen . Das nächste, was wir wollen, ist, die Farbe des Textes und die Größe zu ändern . Klicken Sie also auf Stil. Klicken Sie also auf Stil. Wir möchten Präfix-Textilien reduzieren und die ausgefallenen Textstile öffnen , denn was wir noch haben, ist der ausgefallene Text selbst. Und klicken wir auf Topographie. Vergrößern wir die Größe. So etwas, vielleicht 162, aber alles hängt davon ab, welches Wort Sie dort eingegeben haben. Also lasst uns da draußen klicken. Dann einfarbig. Lasst uns das in Weiß ändern. So. Lasst uns das aktualisieren. Wir können die Cursorfarbe ändern, wenn Sie möchten, aber ich möchte sie bei White belassen. Als Nächstes wollen wir die ausgefallenen Textilien zusammenbrechen und zu den Suffixtextilien gehen , weil wir ihm eine Farbe geben wollen. Denk dran hier, es ist gelb. Also möchte ich zu diesem Dokument wechseln und mir diese gelbe Farbe schnappen. Kopiere das. Tippen Sie dann zurück zu unserer Seite. Und ich möchte die Suffix-Textfarbe öffnen und diese dort einfügen. Füge das ein. Jetzt ist es also gelb, aber jetzt ist es zu klein. Klicken wir auf Topographie und vergrößern wir die Größe genau dort. Irgendwo da. Ich glaube, es gefällt mir genau dort. Okay, lasst es uns aktualisieren. Und nun beachte, dass auf unserer Seite auf unserer Referenzseite der Animationstyp anders ist. Das verblasst, während unsere hier tippt. Um das zu ändern, gehen wir in den Inhalt reduzieren Sie ausgefallene Texte und erweitern Sie die Einstellungen für ausgefallene Texte. Und wie wir den Animationstyp von Tippen auf Fade ändern können , verblassen. Probieren wir Theta-Grenzen so aus. Über Zoom. Roggen. Ich mag Zoom. Aber um die Dinge einfacher zu machen, lasse ich es einfach bei FE, lasse ich es einfach bei FE, spiele mit diesen anderen Einstellungen herum . Und lasst uns das aktualisieren. Dann. Natürlich wirst du merken, dass wir hier oben etwas Platz haben. Wir haben hier oben einen gewissen Spielraum zwischen der einen und der Nav-Bar. Also lasst uns weitermachen und das machen. Wählen wir den Abschnitt selbst aus. Und lasst uns fortgeschritten hineingehen. Lasst uns diese Padding-Links zusammenbrechen. Und dann lassen Sie uns die obere Polsterung auf etwas wie sagen wir 50 erhöhen . Sagen wir eine 100. Und lasst uns das aktualisieren. Vorschau der Änderungen oder richtig? Aber jetzt muss unsere Schrift ein bisschen fett sein. Gerade jetzt. Es scheint ein Thema zu sein. Wählen Sie also diesen ausgefallenen Text dort aus und gehen Sie in Stil, ausgefallene Textstile. Lassen Sie uns fortfahren und hier den Typ Palaeography auswählen und das Schriftgewicht auf etwa 900 erhöhen. Jetzt ist das Schriftgewicht schwerer, aber jetzt lassen Sie uns die Familie in Montserrat umstellen. Montserrat. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Überschreiben. Das gefällt mir. Das ist also, so fügt man die ausgefallenen Texte hinzu. Wir fahren irgendwohin, wo wir es getan haben. Lasst uns also fortfahren und diese Texte hinzufügen. kopiere ich einfach. Kopieren Sie und ich gehe hier rein und klicke auf dieses winzige Symbol hier, um die Elemente aufzurufen und diesen Texteditor unter den Videofilmer zu ziehen . Und obwohl es noch ausgewählt ist, wähle ich all das gelöschte und füge dann den kleinen Text wir gerade von der anderen Seite kopiert haben. Und während es noch ausgewählt ist, gehe ich in den Stil und richte seine Mitte aus. Ändern Sie die Farbe auf Weiß. Wählen Sie dann den Videofilmer aus. Gehen Sie nach innen fortgeschritten, brechen Sie den Rand und verringern Sie dann den unteren Rand. Schieben Sie die winzigen Texte nach außen. Lasst uns das aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. Super genial. Jetzt haben wir unsere ausgefallenen Texte und den beschreibenden Text zum Heldenbereich hinzugefügt . Als Nächstes möchten wir diesen Button direkt hier hinzufügen. Also lasst uns das in der nächsten Lektion machen. 8. Den animierten Hintergrund hinzufügen: Also willkommen zurück. Diesmal möchten wir diesen animierten Hintergrund hier erstellen . Wenn Sie genau hinsehen, werden Sie feststellen, dass sich im Hintergrund eine Art von Kreisen nach dem Zufallsprinzip bewegen und alle zufällig dimensioniert sind. Also lasst uns sehen, wie das geht. Was ich tun möchte, ist ins Dashboard zu springen. Also gehe ich nicht ins Dashboard. Also lass mich einfach darauf klicken. Und jetzt wollen wir im Dashboard Plugins eingehen und neue hinzufügen. Weil wir ein Plugin hinzufügen möchten , das diese Partikel hinzufügt. Also lasst uns weitermachen und Pi, Outlet Pi oder Net eingeben . Und so haben wir hier zwei Pi Out Net Plug-Ins. Und das, was wir wollen E sind Botnet-Add-Ons für Elementor. Bringen Sie das und die Aktivierung oder Fahrt ein. Dies sind also die Funktionen, die uns das Plugin zur Verfügung stellt , und es hat auch einige Verfahren. Jetzt, da wir das Plug-In installiert haben, kehren wir hier zu unserem Workspace zurück und aktualisieren diese Seite, damit wir das neu installierte Plug-In oder die Braut der Marke laden können . Jetzt ist es geladen. Lasst uns grundlegend zusammenbrechen. Es ist kollabierter Pro-General, es ist alles zusammengebrochen. Und jetzt werden Sie feststellen, dass wir diese PAF E-kostenlosen Widgets haben. Das ist also Pilot Net Add-On für Elemente von kostenlosen Widgets. Und es hat natürlich die Elemente, die es in das Projekt eingebracht hat. Wählen Sie also unsere Rubrik aus. Wählen wir nun diesen Abschnitt aus. Und Sie werden jetzt feststellen, zusätzlich zu den drei Tabs, die wir dass wir zusätzlich zu den drei Tabs, die wir hier oben haben, PIFP haben. Wenn Sie also darauf klicken, wurden zusätzliche Einstellungen für den PAF II angezeigt, also PIFP-Partikel, Lassen Sie uns auf auswählen. Jetzt ist es aktiv. Bevor wir also Änderungen vornehmen, klicke ich auf Aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. So sieht er standardmäßig aus. Also müssen wir es ein wenig optimieren, damit es so etwas subtileres aussieht. Also lasst uns weitermachen und in unseren Arbeitsbereich springen. Und weil vorerst alles rot ist, müssen wir diese Farben ändern. Also lasst uns genau dort etwas wie ein sehr dunkles Grau machen. Irgendwo da. Ich gehe mit diesem Farbcode. kopiere ich. Und ich werde auch sie diese Linien haben, weil sie auch Links feststellen, dass sie diese Linien haben, weil sie auch Links haben, die die Punkte verbinden. Also möchte ich nur die Link-Farbe dieselbe Farbe wie die Kreise oder die Elemente machen . Also lasst uns das da hineinfügen und aktualisieren wir es. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Und das haben wir jetzt. Beachten Sie also, dass sie sich zu schnell bewegen und wir brauchen, dass sie etwas langsamer werden. Mal sehen, wo ist die Geschwindigkeit dieses Teilchens? Reduzieren wir das auf 1. Aber natürlich kann es mit der Geschwindigkeit herumspielen und auf die gewünschte Geschwindigkeit einstellen. Also lasst uns eine Vorschau anzeigen. Äh, das haben wir im Moment. Ich glaube, es gefällt mir. Das nächste, was wir tun wollen, ist diesen Button genau hier zu erstellen. Beachten Sie, dass es diesen schwebenden Effekt hat , wenn Sie den Mauszeiger darüber bewegen. Und wir werden sehen, wie das geht. Lasst uns also direkt hier reinspringen und klicken wir hier auf dieses Symbol Mehr und tippen Sie den Button ein. Und klicken wir auf den ersten Button. Oder lasst uns das alles löschen. Kollabiere das. Und lasst uns in Basic gehen. Und wählen wir den Button gleich hier aus. Lassen Sie es uns fallen, wenn diese blaue Linie anzeigt, dass wir bereit sind zu fallen. Und jetzt ist es standardmäßig auf der linken Seite. Schieben wir es in die Mitte. Und lasst uns ins Innere gehen. Nein, lasst uns zunächst ändern, was unter Inhalt steht. Texte, klicke hier. Was sagt er? Betrachten Sie mein Portfolio. Betrachten Sie mein Portfolio oder RI. Das nächste, was wir tun wollen, ist, in den Stil zu gehen , damit wir anfangen können, es zu stylen. Ich werde das für einen Moment zusammenbrechen und Sie werden feststellen, dass wir diese beiden Möglichkeiten haben. Also lasst uns den Knopf erweitern. Und für die Farbe ändern wir sie in dieses Gelb. Also werde ich hier rübergehen und diese Gelb kopieren. Denken Sie daran, dass ich dieses Dokument in der folgenden Beschreibung im Ordner angegeben habe. Also lasst uns das da reinfügen. Und jetzt ist der Knopf gelb, aber die Testfarbe muss so schwarz sein. Und dann lassen Sie uns die Typografie in Montserrat umstellen. Montserrat. Mir gefällt, wie es aussieht. Und lasst uns etwas gegen die Polsterung unternehmen, denn hier auf unserem Button es eine schöne Polsterung, die es auffälliger aussehen lässt und genau das versuchen wir zu erreichen. Während der Button noch ausgewählt ist, mache ich die Schaltfläche rückgängig. Gehen wir zum Padding und lassen Sie uns diesen Link aufbrechen. Und das wird den Knopf für einen Moment verzerren. Vergrößern wir die linke Polsterung 250 und die rechte Polsterung 250, unten und oben 20. Oder RI. Lasst uns das aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. Super genial. Das haben wir im Moment. Aber jetzt beachte, dass unsere Top-Helden-Sektion hier hinaufgeht, denn dort reicht der Button. Wir müssen die Polsterung hier unten erhöhen und den Abstand zwischen der Schaltfläche und diesem Text erhöhen, genau wie hier. Also lasst uns das machen. So können wir auswählen, solange der Button noch ausgewählt ist. Lass uns fortgeschritten hineingehen. Lassen Sie uns diese Verbindung dort oben aufbrechen und lassen Sie uns die oberste Marge auf 50 erreichen. Jetzt machen wir es zu 100. Lasst uns das aktualisieren. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Oder richtig, jetzt ist es an einem schönen Ort. Aber wir wollen zunehmen. Das nächste, was wir tun wollen, ist die Polsterung des Heldenabschnitts selbst zu erhöhen , hier durch diesen blauen Rand abgegrenzt wird. Wählen wir also den Abschnitt selbst aus. Und lasst uns fortgeschritten hineingehen. Und lassen Sie uns so eine untere Polsterung von 6060 geben. Lasst uns das aktualisieren. In der Vorschau die Änderungen. In Ordnung, jetzt bewegen wir uns diese Partikel über und unter dem Knopf. Und unsere Helden-Sektion sieht jetzt gut aus. Das nächste, was wir tun wollen, ist, an diesem Abschnitt genau hier mit diesem netten Symbol zu arbeiten . Ja, dies wird also ein sehr schöner Ort sein, um eines Ihrer bevorzugten oder neuesten Projekte zu präsentieren. Lassen Sie uns also fortfahren und diesen Abschnitt erstellen. Wir sehen uns in Kürze. 9. Bild hinzufügen: Willkommen zurück. Springen wir also zurück nach Osten unseres Arbeitsbereichs. Was wir tun wollen, ist einen brandneuen Abschnitt hinzuzufügen , denn denken Sie daran, dass wir diesen Abschnitt direkt hier erstellen möchten und er sich direkt unter unserer Schaltfläche befindet. Wir möchten also einen zweispaltigen Abschnitt hinzufügen. Also lasst uns das machen. Klicke das an. Und jetzt haben wir eine doppelte Spalte N hier drin. Ich klicke das rein ziehe ein Bildelement dort hinein. Klicken wir darauf und ziehen ein Überschriftenelement dort hinein. Klicken wir auf diese winzige Schaltfläche genau dort und ziehen einen Texteditor direkt dorthin und lassen Sie es fallen, wenn diese blaue Linie erscheint. Und denk dran, dass wir dieses Icon genau hier haben. Gehen wir also zurück und klicken Sie auf das winzige Symbol, um das Insight-Icon der Elemente aufzurufen Insight-Icon der Elemente und dieses auszuwählen, das den Stern hat. Dies sind die Standardwerte Elementor, Elementor, Icon-Elemente. Ziehen wir das und lassen Sie es direkt über den Titel fallen. Und standardmäßig ist es in der Mitte. Während es noch ausgewählt ist, richten wir es nach links aus. Aktualisiere das. In Ordnung, also lasst uns eine Vorschau der Änderungen anzeigen. In Ordnung, das haben wir also. Sieht nicht sehr nett aus. Wir müssen etwas dagegen unternehmen. Also lasst uns das Bild zuerst hinzufügen. Ich wähle das Bild aus und das ändert sich, um Bild und Outs zu bearbeiten. Klicken Sie dort hinein und klicken Sie auf Los, um Dateien hochzuladen, wählen Sie Dateien aus. Und denken Sie daran, dass ich erwähnt habe, dass ich diesen Assets-Ordner vorbereitet habe , und er wird in der Beschreibung unten aufgeführt. Du kannst es herunterladen. Es hat alle Bilder, die verwendet werden. Also wähle ich dieses Bild aus. Ja, lass mich das Bild vorerst auswählen. Öffne das. Und lasst uns weitermachen und Medien einlegen. Einfach so. Aktualisiere das. Und jetzt schauen wir uns an, wie unsere Schrift aussieht. Das ist also Montserrat. Ich kopiere diesen Lorem Ipsum. Also können wir es dort einfügen und kopieren. Und lass uns hier reingehen. Wählen wir das aus. Jeder Schuss zählt. Und wählen wir die Beschreibung aus. Gehen Sie also hier hinein, wählen Sie alle aus, löschen Sie das und fügen wir unseren langen Lorem Ipsum Während dies noch ausgewählt ist, gehen wir in den Stil und ändern die Schriftfarbe in Weiß. Klicken Sie irgendwo drin, um aus diesem Feld herauszukommen. Und klicken wir auf die Topographie. Lasst uns die Familie nach Montserrat ausbilden. Geben Sie ein. Ich wähle den Titel aus, die Überschrift. ändere ich. Ja, das ist ein H2, das gefällt mir. Und geh wieder in den Stil, ändere das auch in Weiß. Wählen wir also das Symbol aus und gehen wir hier hinein, in die Kamera. Das gefällt mir nicht. Alles klar, also wählen wir das aus. Sie können aber auch Ihre eigenen Icons hochladen, wenn Sie möchten. Also füge das ein. Und jetzt ist es eine Kamera, aber wir müssen es zu dieser gelben Farbe machen. Also lasst uns hier hineingehen, solange es noch gewählt ist Stil. Ich gehe hier. Und ich tippe hier auf diesen Notizblock und kopiere das. Geh hier rein und füge es hier ein. Und jetzt ist es gelb. Aber diese Elemente liegen zu nahe beieinander. Was wir also tun müssen, ist diesen Abschnitt auszuwählen und hier unter Layout, Spaltenlücke zu gehen . Lassen Sie uns eine dieser Optionen auswählen, die Ihnen gefällt, aber ich werde weiter gehen und diese dann aktualisieren. Jetzt ist der Abstand zwischen diesen beiden Spalten erhöht. Lassen Sie uns also eine Vorschau der Änderungen anzeigen. Das haben wir bisher also. Ich glaube, es nimmt Gestalt an. Wir müssen diese Schriften zwei Monate Arad Familie ändern. Wählen wir das also aus. Gehen Sie in Stil-Typografie. Familie, Montserrat. Montserrat. Und ich möchte das Gewicht auf etwa 800 erhöhen und das aktualisieren. Es ist auch die Größe höher. Ich benutze einfach meine Augen. Sagen wir, bis zu irgendwo ist vielleicht 38 in Ordnung. Aktualisiere das. Und jetzt der Abstand zwischen dem Knopf ist der Abstand zwischen dem Knopf und diesem Abschnitt hier ein bisschen klein. Also lasst uns das erhöhen. Wählen wir den Abschnitt unter „Advanced“ aus. Brechen Sie diesen Link genau hier auf und erhöhen Sie die oberste Marge auf vielleicht 50. Die App zu diesem Ort und aktualisiere das. Und wir können die Änderungen in der Vorschau anzeigen. Alles klar, das gefällt mir. Das nächste, was wir tun müssen, ist diesen Button hinzuzufügen. Und eine großartige Sache an Elementor ist, dass Sie Elemente wie in einer anderen Normalität kopieren und einfügen können , die visuelle Design-Software wie Adobe Illustrator oder Photoshop. Und wenn wir hier reingehen, können wir diesen Button einfach hier kopieren. Rechtsklick auf die Schaltfläche und kopiere sie. Dann geh ich hier rein. Rechtsklicken Sie die Textelemente und fügen Sie Der Button wird also unter die elementare Rechtsklicke gehen. Jetzt ist es unten, aber jetzt hat es die Einstellungen, die wir für diesen festgelegt Wir müssen die Einstellungen an diese Bereiche anpassen. Also lasst es uns zuerst nach links verschieben. Lasst uns diese Marge entfernen. Gehen wir also zu Advanced und entfernen diese Marge. Vielleicht hat 0 gemacht. Vergrößern wir vielleicht die Größe des Bildes bis zu dieser Stelle. Und lasst uns das aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. Und das haben wir bisher. Genau hier. Es ist roter und gelber eigener Schwebeweg. Also lasst uns das ändern. Wenden wir also diesen Hover-Effekt an. Nun, der Button ist ausgewählt. Lassen Sie uns in den Stil von Hoover eingehen, der die gelächelte Lektüre sein wollte. Also kopiere ich das und füge es da rein. Wir wollen also auf keinen Fall, dass es leicht weiterlesen soll, um über den normalen Zustand und beim Schweben mild zu lesen. Wir wollten dieses gelbe, lebendige Gelb haben, das beim Schweben kopieren so leuchtend gelb sein wollen. Und dann im Normalzustand muss die Schrift weiß sein. Yup, muss weiß sein. Also normaler Zustand Schriftart, breit. Beim Schweben können wir es so schwarz machen. Aktualisieren wir das und sehen wir eine Vorschau der Änderungen an. Scrollen wir nach unten. Und jetzt verhält sich unser Button so, wie wir es wollen. Lassen Sie uns weitermachen und diesen Abschnitt „Meine Dienste“ erstellen. Und dies wird ein sehr schöner Ort sein, um eine kurze Beschreibung dessen zu geben was Sie für Ihren Kunden tun. Lassen Sie uns also den Abschnitt „Meine Dienste“ erstellen. In der nächsten Lektion sehen wir uns in Kürze. 10. Die Dienste hinzufügen: Willkommen zurück. Also hier sind wir in einer weiteren fantastischen Lektion. Das nächste, was wir jetzt tun wollen, ist meinen Dienstbereich hinzuzufügen. Also fügen wir zunächst den Titel und natürlich diese Symbole und Text hinzu. Lasst uns also direkt in unseren Arbeitsbereich springen. Und was wir tun wollen, ist einen einzelnen Spaltenabschnitt hinzuzufügen einen einzelnen Spaltenabschnitt , der ganz von links nach rechts läuft. Und denken Sie daran, dass wir bei der Arbeit mit Elementor Elemente von einem Ort zum anderen kopieren können , wie wir diesen Button kopieren und hier verwenden. Also möchten wir diesen Titel auch hier kopieren , damit wir ihn hier verwenden können. Ich möchte Ihnen schnell eine sehr praktische Funktion zeigen , die elemental bietet. Und du wirst bemerken, wenn ich den Mauszeiger hier über diese Ecke fahre, passiert hier nichts. Oder wenn ich den Mauszeiger hierher fahre, passiert nichts Besonderes. Aber ich möchte hier auf dieses Burger-Menü klicken und in die Benutzereinstellungen eingehen. Handles bearbeiten. Ändere das auf „Ja“ und sag „Update the“. Wenn wir jetzt hier drin sind, wenn Sie den Mauszeiger über die Ecken bewegen, diese Optionen angezeigt hier diese Optionen angezeigt, die Ihnen helfen, Ihre Arbeit schneller zu erledigen. Wenn ich diese also duplizieren wollte, muss man nur den Mauszeiger darüber bewegen und darauf klicken. Und jetzt kann ich das hier in unseren vollständigen GUI-Bereich ziehen . Das nächste, was ich tun möchte, ist das zu duplizieren und in unseren Bereich zu ziehen. Und dann möchte ich den ganzen Sex entfernen , damit wir noch einen Satz haben. Und während es noch ausgewählt ist, gehen wir in den Stil und richten ihn an der Mitte aus und machen dasselbe für die Überschrift. Richten Sie es in der Mitte aus. Und klicken wir auf den Abschnitt selbst. Gehe zu Erweitert, unterbreche den Link am Rand und gib ihm eine Marge von 100. Stimmt's? Wir haben also einen schönen Abstand zwischen den beiden Abschnitten. Aktualisiere das. Lassen Sie uns die Änderungen schnell in der Vorschau anzeigen. Und genau das haben wir. Das nächste, was wir tun wollen, ist diese Dienste hinzuzufügen. Also lasst uns sehen, wie das geht. Klicken wir hier auf dieses kleine Symbol , um diese Elemente aufzurufen. Und wir möchten einen inneren Abschnitt direkt unter diesen Text ziehen . In dieser Kreuzung müssen noch ein paar Spalten vorhanden sein. Eine, die auch noch einmal dupliziert wird. In diesen Spalten werden verschiedene Teile dieser Bereiche enthalten . Also, jetzt wird eine Spalte diese enthalten und eine andere Spalte wird diese enthalten. Eine weitere Spalte diese und eine weitere Spalte diese. Deswegen haben wir vier. Also dafür und ziehe das bis zu etwas wie vorerst, lass uns mit einer Neun beginnen. Nun, während ich ziehe, werden Sie feststellen, dass wir einige Metriken haben , die sich in Echtzeit ändern. Der auf der linken Seite ist ein, a, Lasst uns die Neun irgendwo da drin ändern. Lasst uns das auch auf neun ziehen. Sieh dir die linken Metriken an. Jetzt geben wir ihm 5,55 g, die auch 55 sind. Oder RI. Was wir also tun müssen, ist, auf das Pluszeichen zu klicken und das Symbol einzugeben. Und ziehen wir ein Icon da rein. Und mit diesem Symbol klicken Sie dort und wählen Sie ein beliebiges Symbol aus, das Sie mit der Fotografie verknüpfen möchten. Lassen Sie mich das auswählen, fügen Sie das ein. Und Sie werden feststellen, dass das Symbol standardmäßig Schnabel ist. Aber wir werden etwas dagegen unternehmen. Das nächste, was wir tun wollen ist, mich diesen Text hier kopieren zu lassen. Kopieren Sie das und der Abschnitt ist meine Dienste. Also lass mich das erste n hier auswählen. Ich möchte auf dieses Pluszeichen klicken dann ein Überschriftenelement ziehen. Und während es noch ausgewählt ist, Hochzeitsfotografie, füge ich das dort ein. Okay, also das Nächste, wir uns das und schnappen einen Texteditor, indem wir es dort hineinlegen. Also stylen wir die Texte. Fangen wir mit dem Icon an. Hier drin. Lass uns kurz zu I gehen und das ziehen, bis du zufrieden bist. Ich glaube, 35 ist okay für mich. Und lassen Sie uns die Tastenfarbe ändern, die Symbolfarbe auf dieses Gelb. Also lass mich rüberspringen und das kopieren und wieder hinein und füge das Gelb dort ein. Jetzt ist es also gelb. Wählen wir diese Überschrift aus, gehen Sie in den Stil, wählen Sie das College ändern Sie es in Weiß. Jetzt wollen die Typografie-Familie zwei Monate im Irak verändern. Und ich möchte die Schriftgewichte auf vielleicht 700 ändern, aber ich möchte die Größe ein wenig auf 25 reduzieren, ist okay. Dann wähle ich diese Beschreibung unten hier aus. Und während es noch ausgewählt ist, gehen Seiten Stil, ändern Sie die Farbe in Weiß. Wechseln Sie die Typografie-Familie in Montserrat. Okay, aktualisiere das. Und ich möchte diese Farbe ein wenig ändern. Sei also ein dunkleres, etwas dunkelgrau, damit es von der Überschrift selbst zu unterscheiden ist. Irgendwo da. In Ordnung, also gibt es einen kleinen Unterschied zwischen ihren Schattierungen. Und dann schaue ich mir das an. Da haben wir es, also haben wir einen Service. Das nächste, was wir tun wollen, ist das zu duplizieren, den Mauszeiger darüber zu bewegen und es zu duplizieren und dort hineinzuziehen. Und jetzt werden Sie feststellen, dass wir es nicht in diesem kleinen Bug, dieser Box , werfen können, weil er klein ist, also werde ich es größer machen. Ziehen Sie es und lassen Sie es dort hinein. Und denken Sie daran, dass wir es geschafft hatten 5.5. Ziehen wir es also auf 5,5. Das ist okay. Lassen Sie uns das duplizieren, ziehen Sie es dort hinein. Dupliziere das, ziehe es da rein. Und das ist unser zweiter Service. Also hole ich mir das Grafikdesign und füge es dort ein. Die dritte ist die Unternehmensfotografie. Das nächste, was wir tun wollen, ist diese zu duplizieren. Jetzt, da wir diese beiden Dienste haben, möchten wir diesen Abschnitt so duplizieren und erneut duplizieren. Jetzt haben wir die Serviceleistungen alle zusammenhängend gestylt. Also lasst uns das kopieren. Wir sagten, es sei Unternehmensfotografie. Lasst uns das da reinfügen. Also Graham, wähle das aus, das in der Eventfotografie. Und dann endlich die Videoproduktion. Oder richtig, lasst uns das aktualisieren. Und dann lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie also nach unten, überschreiben Sie unseren Bereich „Meine Dienste“ sieht super großartig, schön und sauber aus. Das nächste, was wir tun wollen, ist diesen Call-to-Action-Bereich genau hier zu erstellen. Dies ist also eine Zielseite, die Menschen dazu bringen muss, Maßnahmen zu ergreifen Bedürfnisse zu erfüllen, um Menschen zum Handeln zu rufen. Und dies ist eine der Möglichkeiten, dies zu tun, um Fotoratschläge von mir zu erhalten , und jemand kann sich Ihrer VIP-Liste anschließen. Lassen Sie uns also fortfahren und diesen Abschnitt erstellen. Und es hat diesen schönen Effekt , wo das Hintergrundbild fixiert ist. Mal sehen, wie das in der nächsten Klasse geht. 11. Eine Anregung hinzufügen: Willkommen in dieser Klasse. Also haben wir diesen Dienstbereich bereits erstellt. Jetzt ist es an der Zeit, diesen Call-to-Action-Bereich genau hier zu erstellen . Wir möchten die Menschen dazu aufrufen können, unsere gewünschten Maßnahmen zu ergreifen , die für uns von Vorteil sein werden. Und weil wir Fotografen sind, möchten wir, dass die Leute an unserem Mailing teilnehmen. Deshalb haben wir diesen Button genau hier. Lassen Sie uns also sehen, wie Sie diesen Abschnitt in unserem Workspace erstellen können. also zu unserem Arbeitsplatz springen, ist das Nächste, wie Sie bereits vermutet haben, wie Sie bereits vermutet haben, einen neuen Abschnitt zu erstellen. Und mal sehen. Ja, es ist wie gewohnt ein Abschnitt mit voller Breite. Und beachte, dass wir hier keinen Spielraum zwischen diesen beiden haben. Warum fügen wir also nicht damit an eine Marge hinzuzufügen, solange er noch ausgewählt ist. Gehen Sie weiter, brechen Sie den Link hier auf. Lassen Sie uns also eine Top-Marge von 100 hinzufügen. Und jetzt haben wir einen schönen Abstand zwischen den beiden. Und während dieser Abschnitt noch ausgewählt ist , gehen Sie in den Stil. Lassen Sie mich im Hintergrund den Hintergrund kollabieren und wir haben all diese Panels genau hier. Und wir interessieren uns vorerst für den Hintergrund. Typ des Hintergrunds. Klicke auf den Pinsel und gehe zu Bild. Klicken Sie auf das Pluszeichen dort und wir müssen das Bild hinzufügen, das unser Hintergrund wie folgt sein wird. Also wähle ich Dateien hochladen aus und wähle Dateien aus. Und ich glaube, das ist ein Foto. Öffne das. Und lasst uns Medien einlegen. So sieht es standardmäßig aus. Also das erste, was wir tun wollen, nun, das ist immer noch ausgewählt. Wir gehen in Position Mitte, Mitte und dann zu Anhängen, sagen wir fest, so dass beim Scrollen an einer Stelle bleibt. Und dann sagen wir mal wiederholen, keine Wiederholung, Größe, sagen wir Cover oder RI. Der Grund, warum es diese nicht ganz sichtbar ist, weil unser Abschnitt hier leer ist. Denken Sie daran, dass dies unser Hintergrund ist, aber die Größe unseres Abschnitts wird durch die Menge an Inhalten bestimmt , die wir darin enthalten. Also lasst uns das Plus anklicken. Und anstatt eine neue Überschrift zu erstellen , duplizieren wir dies. Klicken Sie darauf, und ziehen Sie es dann und legen Sie es dort ab, wenn die blaue Linie erscheint. Meine Dienste. Und genau darunter. Lassen Sie uns das duplizieren und unter meine Dienste ziehen. Nun, während dies noch ausgewählt ist, schieben wir es in die Mitte, in die Mitte. Jetzt ist es also zentriert ausgerichtet. Inzwischen können wir nicht lesen, weil der Hintergrund hell ist. Wählen Sie diesen Abschnitt erneut aus. Und unter Hintergrundtyp und Hintergrund haben wir Hintergrund-Overlay. Lassen Sie uns diesen Hintergrund-Overlay-Typ erweitern. Und lass uns ihm eine Farbe geben, schwarz. Lass uns so ein dunkles Schwarz geben. Und dann lassen Sie uns die Deckkraft erhöhen , um sie ein bisschen dunkler zu machen. Okay, aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Genial, also haben wir das. Wir können nicht weiter scrollen, weil wir nichts darunter haben. Aber wir können vorerst scrollen und sehen, was wir tun wollen, ist den Text hier zu schnappen und ihn zu kopieren. Und das möchte ich auswählen. Und obwohl es noch ausgewählt ist, möchte ich es hier einfügen. Füge das da rein. Und lass uns wieder hier rein gehen. Ja, das nimmt auf. Und nun beachte, dass unsere Texte nun ganz von links nach rechts verlaufen. Und das liegt daran, dass wir einen einzelnen Spaltenabschnitt mit voller Breite verwendet haben . Ich denke, wir müssen es zu dreifachen Spalten machen, also dupliziere ich die Spalten zweimal so. Und dann werde jetzt den Inhalt in den Seitenspalten los. Lassen Sie uns das jetzt löschen, löschen und löschen. Und jetzt haben wir diese Spalte in der Mitte. Jetzt können wir das ziehen und sicherstellen, dass alles in der Mitte ist. Lassen Sie uns eine, 20, 20% auf der linken Seite geben . Lassen Sie uns auch sagen, dass es genau dort 20 Prozent sind, 20% auf der rechten Seite. Okay, also lasst uns das aktualisieren. Und eine andere Sache, die Sie bemerken werden, ist, dass wir nicht genug Auffüllung über dem Text haben , sodass er fast den Rand des Abschnitts berührt. Vergrößern wir also die obere Polsterung des Abschnitts. Wählen Sie einen Abschnitt erweitertes Padding aus. Lassen Sie uns diese Polsterung unterbrechen und lassen Sie uns die obere Polsterung erhöhen. Nur damit wir oben etwas schönes Zimmer im Raum haben könnten. Etwas wie 70. Und lasst uns das Gleiche für den Boden machen. Lass uns so eine 7070 machen. Das nächste, was wir tun wollen, ist hier rauf zu gehen und diesen Button zu duplizieren. Und ziehen wir es und legen es unter den Text. Es ist unser Aufruf zum Handeln. Und standardmäßig ist es auf der linken Seite. Während es noch ausgewählt ist, legen wir es in die Mitte. Und was heißt das? Jane, meine VIP-Liste. Während es also noch unter Inhalt ausgewählt ist, meine VIP-Liste und aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie nach unten. Genial, also haben wir einen netten Aufruf zum Handeln und die Leute können darauf klicken, weil sie von Ihnen fotografische Ratschläge erhalten möchten . Das ist also ein netter Ort, um einen Aufruf zum Handeln zu haben. Das nächste, was wir tun wollen, ist an dieser filterbaren Galerie zu arbeiten . Jemand kam und sah sich alle Projekte denen du gearbeitet hast. Oder sie können sie nach Kategorien anzeigen. Zum Beispiel Hochzeitskategorie. Sie klicken darauf, dass es ihnen nur die hochzeitsbezogenen Projekte zeigt , bei denen die Clique zusammenarbeiten ließ. werden nur die Unternehmensauftritte gezeigt, die Sie hatten. Studio, das ist dein Studio im Freien. Und wir können zu allen zurückkehren. Also lasst uns sehen, wie man das schafft. Also wir sehen uns in Kürze. 12. Eine Projektgalerie erstellen: Willkommen zurück. Jetzt ist es an der Zeit, dass wir diese Galerie hier erstellen. Lasst uns also direkt in unseren Arbeitsbereich springen. Und natürlich, wie wir es getan haben, müssen wir als Nächstes einen weiteren Abschnitt hinzufügen, ein dreispaltiger Abschnitt. Und das ist der, mit dem wir mitmachen wollen, also wähle ich das aus. Und jetzt ist es ein dreispaltiger Abschnitt. Lassen Sie uns etwas Raum zwischen den beiden Abschnitten schaffen , indem wir einen oberen Rand hinzufügen. Wählen Sie den oberen Rand des Abschnitts aus und brechen Sie diesen Link auf. Wir haben es also nur mit der Spitze zu tun. Rash wäre ein 100. Jetzt haben wir dieses Zimmer. Klicken wir als Nächstes auf das Pluszeichen dort. Und lass uns hier reingehen und filtrierbar eingeben. Filtrierbar. Und wir haben dieses Element durch wesentliche Add-Ons für Elementor eingebracht , weshalb ich dieses Plug-In wirklich mag. Ziehen wir es also da rein. Und bam, es zeigt hier bereits eine Platzhaltergalerie, die wir mit unseren eigenen Inhalten füllen können. Lassen Sie uns das also aktualisieren und eine Vorschau der Änderungen anzeigen, bevor wir anfangen, sie mit unseren eigenen zu füllen. Lassen Sie uns das in der Vorschau sehen. Lass uns scrollen. Und das haben wir. Das erste, was ich tun möchte ist die Breite dieser Spalte zu vergrößern. Also gehe ich wieder rein und lass uns das den ganzen Weg ziehen, um ihm eine 11 auf der linken Seite zu geben. Auf der linken Matrix hier. Ich gebe ihm eine 10 und auf dieser anderen Seite auch eine 10. Und lasst uns das aktualisieren. Und während es das tut und während dies ausgewählt ist, klicken Sie irgendwo hier drin. Jetzt ist es das aktive Element, mit dem wir arbeiten. Und das können Sie bestätigen, indem Sie hier oben schauen. Das erste, was ich tun möchte ist, diese Einstellungen genau dort zu reduzieren. Und Sie werden feststellen, dass wir diese filterbaren Steuerelemente haben und Galerie-Elemente haben. Filterbare Steuerelemente, sind diese Steuerelemente genau hier, wenn Sie auf Galerieelement klicken und auf alle klicken. Das sind die filterbaren Steuerelemente, oder? Dann sind Galerieelemente die Bilder selbst, die Gegenstände selbst. Beginnen wir also mit den filterbaren Steuerelementen indem wir diese erweitern. Und lasst uns einen Artikel hinzufügen. Also geben wir ihm einen Namen, vielleicht benetzen wir. Lasst uns das zusammenbrechen. Es gab bereits Standardsteuerelemente, also erweitern wir das und geben ihm einen anderen Namen. Kooperiere, Kern, Parade. Lasst uns das zusammenbrechen. Lassen Sie es uns duplizieren , indem wir auf dieses Symbol klicken oder auf Element hinzufügen klicken. Fortlaufende, sagen wir Outdoor-, Outdoor-Fotografie. Lassen Sie uns das duplizieren. Sagen wir vielleicht etwas wie Studio-Update dort. Jetzt haben wir ein paar Kontrollen. Dies können Ihre verschiedenen Projekte oder verschiedene Arten von Kategorien sein, die Sie für Ihre Projekte haben möchten. Alles klar, also lasst uns die filterbaren Steuerelemente reduzieren und in die Galerieelemente gehen. Dies sind die Galerieelemente, die wir bereits hier haben, also können wir sie ändern. Steuerungsname bedeutet also das Steuerelement, das verwendet wird, um es anzuzeigen. Wenn Sie zum Beispiel möchten, dass dieses Galerieelement sichtbar ist, wenn jemand auf die Hochzeit klickt, wir hier drinnen geben wir hier drinnen eine Hochzeitshochzeit ein. Lasst uns das zusammenbrechen. Wenn wir also möchten, dass dies angezeigt wird, wenn jemand auf „Kooperation“ klickt, klicken wir auf, um Kooperationsnamen einzugeben wenn jemand auf „Kooperation“ klickt, . Denken Sie daran, dies sind die Steuerelemente, die wir hier erstellt haben Kooperation, Hochzeit, Outdoor und Studio. Also lasst uns hier reingehen und ihnen einfach nach dem Zufallsprinzip verschiedene Kontrollen geben. Und ich habe vergessen, ihnen Namen zu nennen. Der erste Gegenstand hier kann also mein bester Schuss sein. Lasst uns zusammenbrechen. Alles klar, M bevor wir es verlassen, während wir noch in meinen besten Schüssen sind, , werden Sie feststellen, dass es jetzt zu meinen besten Schüssen geändert wurde. Und wenn wir nach unten scrollen. Hier fügen wir das Bild hinzu. Wir sind immer noch im ersten Element hier. Also wählen wir das aus und wir können klicken, lassen Sie uns hineingehen, Dateien hochladen, Dateien auswählen. Und jetzt denke ich, dass ich all diese Bilder auf einmal importieren möchte all diese Bilder auf einmal importieren , weil sie sie brauchen werden. Alles klar, also lasst uns eins nach dem anderen auswählen. Ich glaube, ich kann damit anfangen. Legen Sie Medien ein. Und das ist das Bild, das hier auftauchen wird. So einfach so. also wieder nach oben scrolle, werde ich zusammenbrechen. Meine besten Schüsse. Gehe zum zweiten Bild. Dies wird vom Unternehmen kontrolliert , und die Galerie namens könnte das Galerieelement über Ihre Shorts sein. Und dann lasst uns hier scrollen. Klicke auf das Bild da drin. Während wir im Studio ein Studiobild hatten. Wie auch immer, wählen wir hier einfach irgendwelche zufälligen Bilder aus. Natürlich würdest du dir Zeit nehmen, um das Beste zu erreichen. Scrollen wir nach oben. Zusammengebrochen, das erweitert das. Dies kann von draußen kontrolliert werden wissen, sagen wir ja, draußen. Nennen wir ihm einen Namen. Aufnahmen im Freien. Und lasst uns nach unten scrollen und hier ein Bild dafür auswählen. Lasst uns das aktualisieren. Lasst uns fortfahren, Lasst uns zusammenbrechen. Reduzieren Sie das nächste Element. Und Sie können so viele Galerieelemente wie Sie erstellen , Galerieelemente wie Sie möchten. Aber lasst uns diese sechs natürlich beenden. Sagen wir, das ist auch Kontrolle. Auf keinen Fall. Dies wird genannt, kann lesen, lesen Aufnahmen und dies wird durch eine Hochzeitsfiltersteuerung gesteuert . Lass uns in die Bilder gehen. So wie dieses Hochzeitsfoto genau dort. Und dann scrollen wir weiter den nächsten Galerieelement hier. Und beginnen Sie einfach damit, das Bild zu ändern. Gib es das. Lass uns das wählen. Und dann scrolle ich nach oben und gebe ihm seinen Namen. Klingt zum Beispiel Aufnahmen. Und es wird von, sagen wir im Freien, kontrolliert. Denken Sie daran, dass Sie sicherstellen müssen, dass diese Steuerelemente genau hier sind. Hochzeitssteuerungsnamen sind dieselben filterbaren Steuerungsnamen, die Sie hier verwendet haben , weil sie buchstäblich diejenigen sind, auf die Sie sich beziehen , wenn Sie diese Bereiche füllen, oder? Also sollte der allerletzte vielleicht von Studio kontrolliert werden . Das Studio. Und der Galerierame. Vielleicht geben wir es so etwas wie ja, Studioaufnahmen. Und lasst uns nach unten scrollen und dafür ein Bild hinzufügen, oder? Also lasst uns vielleicht klicken, ja, vielleicht das. Legen Sie Medien ein, aktualisieren Sie das. Und das ist unser letzter Galerieartikel. Also wenn ich diese Studioaufnahmen zusammenbringe und mich einfach die allererste erweitern lasse, meine beste Aufnahme hier. Und schauen wir nach innen, damit Sie Dinge wie preisfähige Bewertungen und all das hinzufügen können . Und Sie können auch einen Link hier haben, Seite zu T HTTP, google.com. Und Sie können auch, wenn jemand auf diesen allerersten Gegenstand hier klickt , was meine besten Aufnahmen sind, und außerdem wird er zu Google.com weitergeleitet oder wohin sie führt. Wenn Sie zum Beispiel eine andere Seite haben, auf der Sie alles Beste haben, werden sie in diesen Bereich gebracht. So können wir uns auch in einem neuen Tab öffnen. Wenn Sie das überprüfen, wird es in einem neuen Tab geöffnet und lassen Sie uns das aktualisieren und eine Vorschau der Änderungen anzeigen. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Scrollen Sie nach unten. Super genial. Das Letzte, was wir tun müssen, ist, die Hintergrundfarbe in Schwarz zu ändern . Also lasst uns wieder hier rein gehen. Und während dies immer noch durch Auswahl einer beliebigen Stelle ausgewählt ist , klicken Sie auf eine beliebige Stelle. Scrollen wir nach unten, scrollen Sie nach oben, reduzieren Sie Galerieelemente , und gehen wir dann in Stil, Hintergrund , Farbe, Schwarz. Und dann lasst uns die Kachel der Generäle zusammenbrechen. Und lasst uns in den kontrollierten Stil gehen , um die Farbe dieser Steuerelemente zu ändern. Die Textfarbe sollte also weiß sein. Aktualisiere das. Ja, also denke ich, dass wir damit genau auf dem Ziel sind. Und Sie können mit allen Einstellungen herumspielen , die hier verfügbar sind. Es gibt viele, aber das ist jetzt eine Herausforderung für Sie. Spielen Sie mit all diesen Einstellungen herum, Spielen Sie mit all diesen Einstellungen herum um zu sehen, was Sie sich einfallen lassen. Aber wenn wir jetzt eine Vorschau der Änderungen anzeigen und sehen, wie unsere Galerie aussieht, scrollen wir und sehen, was wir da unten haben. Alles in Ordnung. Das ist also super genial, aber jetzt habe ich mich gerade daran erinnert, dass wir vergessen haben, einen Titel hinzuzufügen. Lasst uns diese also von unserer Referenzseite abrufen. Kopiere das. Ich geh hier rein. Und was ich tun will, ist das zu duplizieren. Und jetzt möchte ich das ziehen und direkt über die filterbare Galerie ablegen. Und obwohl es noch ausgewählt ist, wähle ich all das aus und füge die letzten Projekte dort ein. Und dann aktualisiere ich das. Lassen Sie uns das in der Vorschau sehen. Stimmt's? Mir gefällt, was wir haben. Wenn wir also auf kooperieren klicken werden nur die Unternehmensprojekte, Hochzeit, Outdoor-Studio sein, und wir können sie alle sehen. Das nächste, was wir tun möchten, ist Bereich Meet the Team zu erstellen. Also lasst uns das in der nächsten Lektion machen. Also wir sehen uns in Kürze. 13. Teammitgliedern: Und willkommen zurück. Jetzt sind wir hier auf der Referenzseite, die wir kopieren. Und das nächste, was wir erstellen möchten, um den Teambereich zu erleichtern , diesen Abschnitt. Machen wir das also in unserem Arbeitsbereich direkt unter der Filterrollengalerie. Lassen Sie uns fortfahren und einen einzelnen Spaltenabschnitt wie diesen hinzufügen. Und das erste, was wir tun wollen, ist das zu duplizieren. Ziehen Sie es und legen Sie es in den einspaltigen Abschnitt ab. Lassen Sie uns den Rand oben in diesem Abschnitt hinzufügen . Gib ihm eine 100. Und jetzt haben wir diesen Abstand direkt unter diesen Projekten. Lassen Sie uns diese kurze Beschreibung geben. Also lasst uns das duplizieren. Und ziehen wir das da rein. Alles klar, jetzt, da wir das haben, lassen Sie uns einen dreispaltigen Kreuzung hinzufügen. Ziehen wir also eine Kreuzung da rein. Und lasst uns diesen Abschnitt duplizieren. Jetzt haben wir drei von ihnen. Klicken wir da hinein und ziehen ein Bildelement dort hinein. Und obwohl es noch aktiv ist, wähle ich eines dieser Bilder aus, die wir importiert haben. Also lasst uns weitermachen und den Kerl anklicken. Er ist ein Teammitglied. Und wir wollen unter ihn schreiben. Klicken wir auf dieses Symbol und ziehen eine kleine und eine Überschrift genau dorthin. Und geben wir ihm vielleicht einen Namen. Alex Rider oder so etwas. Richten wir es an der Mitte aus. Machen wir es zu einem Hass 3. Und lassen Sie uns die Größe ein wenig reduzieren. Vielleicht 23. Lasst uns die Familie in Monstera umstellen. Ändern wir die Farbe in Weiß. Und Wallah, klicken wir auf dieses Symbol im, ziehen Sie einen Texteditor dort hinein. Lass es in die fallen, lass uns ihm einen Titel geben. Regisseur für zwei Graphen Fotografie. Stimmt's? Und während dies noch ausgewählt ist, ist in Stil gehen, Mitte ausrichten. Und jetzt ist der Abstand zwischen dem Namen und dem Titel zu groß. Lassen Sie uns also den oberen Spielraum reduzieren während er noch erweitert ausgewählt ist. Brechen Sie diesen Link genau dort auf und reduzieren Sie den oberen Rand. Aktualisieren. Und jetzt duplizieren wir dieses Bild und legen es dort rein. Lassen Sie uns das duplizieren und es zweimal in das Duplikat legen und tidal zweimal. das am Ende fallen, dass am Ende das Gleiche für den zweimal duplizierten Namen tut . Und jetzt können wir dies auswählen und in einen Namen unter Inhalt ändern , den wir benötigen. Jane Doe. Und Jane. Jane geht zufrieden hinein. Lassen Sie uns das ändern, um das zu aktualisieren, wählen wir hier Alex Writer aus. Ändere das in mein Titelsong. Vielleicht der Marketingdirektor. Date das. Und lasst uns die Bilder ändern. Also wähle ich dieses Bild aus. Und sobald ich es ausgewählt habe, wird dies angezeigt. Klicke das an. Wählen Sie ein anderes Mitglied aus. Dieser Typ. Beachten Sie, wählen wir diese Lady weil Sie hier den Namen einer Dame benutzen, Jane Doe. Wählen wir diesen Kerl hier aus. Wählen wir das letzte Teammitglied Michael Sims aus, um das zu aktualisieren. Und beachte, dass dies ein bisschen kürzer ist als der Rest, also können wir sie immer ändern, bis wir schöne Füße haben. Spielen Sie einfach mit der Größe herum bis Sie den perfekten Feed haben. Und dann lasst uns eine Vorschau anzeigen. Scrollen Sie also nach unten. Alles in Ordnung, also jetzt ist hier unser Team, aber jetzt müssen wir dieses x ändern, um es zu lesen. Treffen Sie unser Team, treffen Sie unsere Teams. Also aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie nach unten. Und jetzt sieht unser Team super toll aus. Gehen wir also zu unserer Referenzseite hier. Das nächste ist meine Erfolge im Zahlenbereich, dieser Abschnitt hier, und es ist animiert. Wenn jemand die Seite zum ersten Mal besucht. Diese Zahlen sind animiert. Mal sehen, wie das geht in der nächsten Lektion. Also wir sehen uns in Kürze. 14. Animierte Theke: Willkommen zurück. Wir fahren fort, wo wir aufgehört haben. Wir wollen jetzt diese erstellen, meine Erfolge im Zahlenbereich. Und diese Zahlen sind animiert. Mal sehen, wie das in unserem Arbeitsbereich geht. also reinspringe, gehe ich direkt nach unten. Und, und lassen Sie uns einen einzelnen Spaltenabschnitt erstellen . Einfach so. Und was wir tun wollen, ist eine Kreuzung hinzuzufügen. wir also kurz davor klicken, fügen wir oben in diesen Abschnitten einen Rand hinzu. Klicken Sie also auf diesen Fortschritt, brechen Sie den Link auf und geben wir ihm einen oberen Rand über 100. Stimmt's? Das ist also, das ist genug Abstand genau dort. Was wir also tun wollen, ist am Ende auf das Pluszeichen zu klicken und eine Kreuzung zu ziehen. Und dann duplizieren wir es noch zweimal . Einfach so. Jetzt haben wir vier Spalten in diesem inneren Abschnitt, sich in diesem Abschnitt befindet. In diesem inneren Abschnitt klicke ich auf Plus. Und dann tippe ich hier drin zählen. Und wir haben hier ein paar Punkte verwandte Elemente, aber derjenige müsste den Zähler erleichtern. Ziehen wir diesen Zähler hier rein und lassen ihn dort rein. M standardmäßig fängt es einfach an, seine Arbeit zu erledigen. Merken Sie, dass wir hier die Endnummer haben, diese 100 sind genau hier, also können wir sie immer auf vielleicht 23 ändern , je nachdem, was Sie zeigen möchten. Und ändern Sie diese coole Nummer hier, wir können den Titel hier unten jederzeit ändern. Schauen wir uns zum Beispiel an, was wir hier haben. Ja, also kommt die Anzahl der Fotos hierher und füge das da rein. Jetzt haben wir 23 Fotos. Das ergibt keinen Sinn. Angenommen, Sie haben 6.400 Fotos. Alles klar. Was wir also tun wollen, ist diese eine einzige Leistung hier zu stylen diese eine einzige Leistung hier und dann für den Rest dasselbe zu duplizieren. zunächst Lassen Sie uns diese Farbe zunächst in Gelb ändern. Wisse, dass es weiß ist. Gehen wir also in den Stil und ändern wir die Textfarbe in Weiß. Typografie hat es definitiv geändert. steht Ihnen jedoch frei, es in jede gewünschte Schriftart zu ändern. Und dann spiele ich mit der Größe herum , damit sie nicht zu groß ist. 35 zu denken, reicht aus. Und ich will es mutig machen, also gebe ich ihm 900. Jetzt geben wir es siebenhundert, achthundert. Jup. Und dann schließe ich das ab. Ich gehe in den Titel und ändere die Typografie hier. Zunächst einmal, um Monstera zu sein, interagieren. Und dann ändere ich hier die Farbe in unser Gelb. Also kopiere ich das Gelb und füge es hier ein. Und jetzt ist es wahrscheinlich immer noch da. Klicken Sie irgendwo hier drin, um das loszuwerden, aktualisieren Sie das. Und jetzt werden Sie natürlich feststellen, dass wir hier diesen gräulichen Hintergrund haben , der diese Erfolge wie Tabs hervorstechen lässt . Lassen Sie uns also diesen Hintergrund erstellen. Es sind definitiv die Abschnitte, also wähle ich den Abschnitt selbst aus. Und dann gehe ich in Stil, Hintergrund, Hintergrund, Typ, Farbe. Ich gebe ihm so dunkelgrau. Dann lass mich irgendwo hier klicken. Und jetzt ist es so großartig. Aber jetzt hat unsere Kolumne keine Farbe. Also möchte ich die Spalte auswählen, Unsere Spalte hier. Und ich möchte in Stil, Hintergrundtyp gehen und ihm eine schwarze Farbe geben. Jetzt ist es schwarz. Aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie nach unten. Und so sieht es vorerst aus. Also müssen wir ihm diese Grenze geben und ihm einen Grenzradius geben. Während es noch ausgewählt ist, unser erster ein Go-Insider-Stil. Grenze. Und wir geben ihm eine solide Grenze. Und geben wir ihm einen Grenzradius von fünf. Jetzt geben wir ihm eine Sieben. Und dann geben wir ihm für die Randbreite etwas wie lass uns vorerst eine Vier geben und das aktualisieren, was zuvor geändert wurde. Alles klar, mal sehen, was unsere Referenz hat. Es hat eine Art Grau. Während es noch ausgewählt ist, möchte ich Box Shadow sagen, weil mir aufgefallen ist, dass wir einen Box-Shadow hinzufügen müssen. Und wenn wir auf den Box-Shadow klicken, können Sie aufgrund dieser Frames diese Editor-Frames jetzt nicht sehen , aber der Box-Schatten wird bereits angezeigt. Lassen Sie mich es einfach aktualisieren und in der Vorschau gehen, damit Sie den Box-Shadow sehen können. Und dann lasst uns wählen: Los geht's. Wählen wir einen Abschnitt aus. Ich möchte die Polsterung oben und unten erhöhen. Also wähle ich zuerst den Abschnitt aus. Riesige Polsterung, oben Lass uns eine 50er geben. Jetzt sind das 550. Und untere 50. Und jetzt haben wir ihm oben und unten etwas schönes Zimmer gegeben. Und wir können das Gleiche für die Seiten tun, beide Seiten. Lassen Sie uns vielleicht ein 2220 geben oder das Update schreiben. Und lasst uns etwas gegen diese Grenze unternehmen. Es ist zu hell. Während dies ausgewählt ist, ist die Spalte selbst. Gehen wir in die Randfarbe. Und lassen Sie uns auch das Dock Grey geben und das dann aktualisieren. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Überschreiben Sie super genial. Aber jetzt scheinen die Zahlen den oberen Rand der Spalte zu berühren und wir brauchen sie, um eine schöne Polsterung zu haben. Lassen Sie uns also die Polsterung für die Spalte selbst erhöhen. Klicken Sie also in diese Spalte. Gehe hinein fortgeschritten. Denken Sie daran, dass wir diese Links vor einem Moment gebrochen hatten. Lasst uns jetzt die obere Polsterung vielleicht auf 15 erhöhen. Und auch untere Polsterung. Und lasst uns jetzt kopieren. Klicken Sie mit der rechten Maustaste auf die Spalte, die Spalte selbst, und klicken Sie mit Und hier klicken Sie mit der rechten Maustaste und fügen Sie Stil ein. Also hast du diesen Stil eingefügt. Und lasst uns das Gleiche für diese beiden wiederholen. Wir fügen all diese Kacheln , die wir auf diese Spalte angewendet haben. Jetzt sieht es fast genauso aus wie diese. Das nächste, was wir tun wollen, ist das dreimal zu duplizieren und es dort hineinzuziehen. Ziehen Sie das da rein und ziehen Sie es dort hinein. Und jetzt beachte, dass sie die Ränder berühren, also ist das der rechte und linke Rand. Also wählen wir dieses aus. Wählen wir diese einzelne Spalte aus. Und lasst uns die richtige Marge um vielleicht etwa 10 erhöhen . Und die linke Polsterung auf 10, linker Rand, 10, zehn oder rechts. Und dann lassen Sie uns mit der rechten Maustaste klicken und diesen Stil kopieren. Und fügen wir diesen Stil in diese drei ein. Und jetzt wurden sie richtig getrennt. Lasst uns das aktualisieren. Lassen Sie uns eine Vorschau der Änderungen anzeigen. Stimmt's? Scrollen wir nach unten und sehen, was wir haben. Aber perfekt. Das einzige, was übrig bleibt, ist eine Unterüberschrift für den Abschnitt. Also dupliziere ich das und ziehe es hier rein. Lass es gleich dort fallen. Und wir können das nennen. Meine Erfolge. Zahlen stimmen, aber natürlich müssen wir all diese Zahlen hier ändern. Sie können nicht alle dasselbe lesen. Wenn Sie also den Inhalt auswählen, können Sie diese auf 51 ändern. Und das könnten Kunden sein. Dann ändern wir das in CDs. Cds, die du vielleicht 15 CDs abgedeckt hast. Und der letzte 1. Mai ist jahrelange Erfahrung, vielleicht 25 plus. Im Moment haben wir also 25 hier. Aber wir können hierher zum Nummernsuffix oder Präfix kommen und einige Dinge hinzufügen. Sagen wir also das Nummern-Suffix. Wir können das Pluszeichen hinzufügen, einfach plus treffen, und jetzt wird es hier erscheinen, 25 plus Jahre. Lassen Sie uns das also in der Vorschau der Änderungen aktualisieren. Scrollen Sie also nach unten. Ordnung, ich liebe was ich mir ansehe. Also werden wir mit diesem Abschnitt „Erfolge“ beenden. Das nächste, was wir tun wollen, ist, diesen neuesten Blogbeitragsbereich hier zu erstellen . Und all diese Daten werden aus Blog-Posts abgerufen, die Sie bereits veröffentlicht haben. Schauen wir uns also in der nächsten Lektion an, wie das geht. Wir sehen uns in Kürze. 15. Anzeigen der neuesten Blog-Posts: Willkommen zurück. Lass uns weitermachen. Im Moment wollen wir diese neuesten Blogbeiträge erstellen , sexuell. Und wie wir bereits erwähnt haben, Daten aus unseren bereits veröffentlichten Blogbeiträgen abgerufen. Das bedeutet also, dass wir einen veröffentlichten Blogbeitrag brauchen. Gehen wir in unser Dashboard und erstellen einige Beiträge. Im Dashboard gehe ich also zu Posts. Klicke das an. Und wir haben einen Standard-Hello World-Blogbeitrag, mit jeder neuen Installation von WordPress geliefert wird. Natürlich werde ich das beschädigen, weil wir unsere eigenen erstellen wollen, Add New oder direkt in wenn wir hier sind, lass uns einem Blogpost einen Namen geben. Also gehe ich einfach hier rein. Und ich möchte diesen Namen genau hier holen. Kopiere das. Und lasst uns ins Dashboard gehen und es dort einfügen. Also werde ich hier nichts anderes anfassen , weil wir nur versuchen, einige Blogbeiträge schnell zu veröffentlichen. Gehen wir also in Einstellungen und scrollen nach unten und suchen nach einem vorgestellten Bild. Lassen Sie uns ein vorgestelltes Bild für diesen Blogbeitrag festlegen. Sagen wir zum Beispiel, worum geht es? Lassen Sie uns die Kameraeinstellungen richtig machen, ja, also schauen wir uns ein schönes Bild an , um die richtigen Kameraeinstellungen wie diese zu finden. Lassen Sie uns das vorgestellte Bild einstellen. Und dann lasst uns das aktualisieren. Beitrag wurde aktualisiert. Wir können uns den Beitrag ansehen, aber lasst uns hier wieder hineingehen und einige World-Blog-Posts erstellen. Füge neue oder RI hinzu, die zweiten Blogbeiträge gehen hier und nimm diesen Namen und füge ihn hier ein. Und natürlich würden Sie in der realen Welt den Blogbeitrag erstellen und veröffentlichen. Aber jetzt erstellen wir keine Inhalte, wir fügen nur den Blogtitel hinzu, oder? Bevor wir also veröffentlichen, wird ein vorgestelltes Bild hinzugefügt. Mal sehen, ich denke, es geht um Outdoor-Fotografie, also wähle ich das aus. Und dann veröffentlichte das, veröffentliche diesen Callback. Wir müssen noch einen erstellen. Neu hinzufügen. Dies sind also die Daten, die an die Vorderseite der Webseite gezogen und dort angezeigt werden. Kopieren wir das also und fügen es dort ein. Oh, warte, lass uns das vorgestellte Bild einstellen. Ich weiß nicht mal, worum es geht, also setze ich mich einfach auf diese Veröffentlichung. Also haben wir jetzt unser vorgestelltes Bild festgelegt ihm einen Namen gegeben. Lass uns wieder reingehen. Jetzt haben wir drei Blogbeiträge. Sie haben einen Titel und ein vorgestelltes Bild. Dies ist der Titel und dies ist das vorgestellte Bild. Also was wir haben, alles was wir brauchen. Wenn wir also direkt hier in unseren Elementor-Seiten-Arbeitsbereich zurückkehren , möchten wir einen einzelnen Spaltenabschnitt hinzufügen, und darin müssen wir ein Post-Raster hinzufügen, das durch wichtige Add-Ons für verfügbar gemacht wird Elementor, aber es ist standardmäßig nicht aktiv, wir müssen wieder in unser Dashboard gehen und es im EIA-Plugin aktivieren. Gehen wir also in das Dashboard und klicken Sie auf wichtige Atome. Lass uns in Elemente eingehen. nach unten scrollen, werden Sie feststellen, dass die Postnote unter dynamischen Inhaltselementen nicht überprüft wird, also überprüfen Sie es. Scrollen Sie nach oben und speichern Sie die Einstellungen. Einstellungen wurden gespeichert. Jetzt haben wir diese Elemente in unser Arsenal aufgenommen. Lasst uns diese Seite zuerst aktualisieren. Und jetzt, wo es aktualisiert wurde, bedeutet das, dass wir unsere Änderungen gespeichert haben. Aktualisieren wir die Seite Control R oder Command R auf einem Mac, um die Seite zu aktualisieren , damit die Post-Note zur Verwendung verfügbar ist. Alles klar, also wenn wir jetzt Gier tippen, erscheint es hier, Post Greed. Scrollen wir also ganz nach unten nach unten. Und denken Sie daran, dass wir diesen einspaltigen Abschnitt hinzugefügt hatten. wir zuerst Ziehen wir zuerst diese Post-Gier dort hinein und lassen sie dort fallen. Jetzt werden Sie unsere drei Blog-Posts bemerken, bereit sind. Und jetzt lassen Sie uns diese Marge oben erhöhen , indem wir den Abschnitt erweitert auswählen. Zerbrich die Verbindung da drüben, gib ihr 100. Und jetzt haben wir einen schönen Spielraum an der Spitze. Das nächste, was wir tun wollen, ist irgendwo in diesen blauen Rand zu klicken . Also haben wir das Element ausgewählt, das Post-Raster. Zunächst müssen wir ihm sagen, woher die Daten abgerufen werden sollen. Also könnten wir Kategorien gebrauchen. Aber im Moment geht es in dieser Klasse nicht um Kategorien, aber denken Sie daran, dass Beiträge Kategorien haben. Sie könnten also Beiträge über Outdoor-Fotografie, Beiträge über Indoor-Fotografie haben. Und wenn jemand auf Ihre Website kommt, um Outdoor-Fotografie zu suchen, werden Beiträge präsentiert, in denen Sie die Kategorie auf Outdoor-Fotografie festlegen. Aber im Moment, wenn wir keine Kategorien haben, werden Beiträge normalerweise als nicht kategorisiert kategorisiert, also gibt es eine Kategorie, die wir nicht löschen können Die heißt uncategorized. So können wir standardmäßig Daten von dort abrufen, nur um sicher zu sein , dass wir tippen und kategorisieren können, und es ist hier über 8 erschienen. Und so sind wir jetzt sicher, dass es also die Daten abruft. Und das nächste, was wir tun wollen, ist uns zu ändern. Zunächst einmal, Beiträge pro Seite, wollen wir drei zeigen. Wenn wir also sieben Blogbeiträge hätten, würden wir hier immer noch nur drei sehen. Das heißt das also. Und lassen Sie uns dies für eine Sekunde reduzieren und die Layouteinstellungen erweitern. Wir möchten drei Spalten anzeigen oder schreiben, aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie nach unten. Super genial, also nehmen sie schon Gestalt an. Lassen Sie sich also nicht davon täuschen, wie sie hier aussehen. Wenn wir die Seite aktualisieren, lassen Sie mich einfach R steuern, um zu aktualisieren, wie sie hier aussehen. Oder Abwechslung. Also geh hier runter. Das nächste, was wir tun wollen, ist natürlich, die Hintergrundfarbe in Ryan mit unserer Hintergrundfarbe zu ändern die Hintergrundfarbe in Ryan mit unserer Hintergrundfarbe zu . Während dies noch ausgewählt ist, wählen Sie eine beliebige Stelle innerhalb des Elements aus. Wir wollen ins Innere gehen. Also nein, geh zurück in den Inhalt und lass uns einige dieser Details hier verstecken. Gehen wir also zu Layoutstilen. Und lasst uns keinen Avatar zeigen. Zeigen wir den Namen des Autors nicht an. Es ist nicht das Datum zu zeigen. Oder vielleicht können wir den Namen des Autors zeigen. Es liegt also an dir zu entscheiden, was du zeigen willst. Ich möchte den Namen des Autors nicht anzeigen. Ja, ich glaube, so gefällt es mir. Nur der Titel und jemand kann mehr lesen. Wir können den Auszug auch zeigen, wenn wir wollen, aber ich möchte nicht zeigen, dass die Eier es sind. Also, wenn wir in den Stil gehen, haben wir die Hintergrundfarbe im Postkartenstil. Lasst uns das also in Schwarz ändern. Es nimmt also schon die Form an, die wir wollen. Und das nächste, was wir wollen, ist, zur Typografie zu gehen und die Titelfarbe in Weiß zu ändern. Ist es hier erweitert? Hier ist es breit. Und lassen Sie uns die Typografie selbst in Monterrey umwandeln. Monterrey. Und lassen Sie uns den Schriftweg auf 800 erhöhen. Und ich möchte es so zentralisieren. Dann erweitern wir den Stil der Schaltfläche „Mehr lesen“ oder rechts. Ändern wir die Textfarbe in Weiß. Und dann wählen wir diese gelbe Farbe aus. Kopiere das. Und lassen Sie uns den Hintergrundtyp 2 ändern, diese gelbe Farbe. Els ändert es in diese Kolumne, Mann. Alles in Ordnung. Das nächste, was ich mache, ist die Polsterung auf dem Button hier zu erhöhen. Wie Sie sehen können, berühren die Wörter die Kanten der Schaltfläche. Also. Lass uns zur Polsterung gehen und das brechen. Lass uns vielleicht eine 30 auf der linken Seite geben, eine 30 auf der rechten Seite. Jetzt probieren wir es mal aus. Links und rechts 2020. Und dann können oben und unten sein 10101055 ist okay. Alles klar. Und dann geben wir ihm einen Randradius von fünf, um ihm die abgerundete Ecke so zu geben. Und dann lasst uns diese Marge brechen. Und lassen Sie uns eine Top-Marge geben. Lassen Sie uns vergrößern und nutzen Sie unser Auge, um zu sehen, wie weit wir gehen müssen, sagen wir 15. Und am linken Rand erhöhen wir den linken Rand auf vielleicht, sagen wir eine 100. Yup, eine 100 ist vorerst okay. Ändern wir diese Schriftart in Schwarz zu Schwarz. Und dann beim Schweben ändern wir es in Weiß. Und dann ändern wir die Farbe des Hintergrundtyps in dieses milde Rot. Also lasst uns das da reinfügen. Also wer auch immer diese milde Lektüre isst, aktualisiere das. Und jetzt haben unsere Bilder hier scharfe Ecken und unsere Referenzbilder hier haben abgerundete Ecken. Also lasst uns etwas dagegen unternehmen. das also zusammenbrechen und in den Miniaturansichtsstil gehen, geben wir ihm einen Randradius von 20. Und jetzt hat es diese abgerundete Ecke. Aktualisiere das. Und jetzt duplizieren wir diesen Titel. Und ziehen wir es da rein. Die neuesten Blogbeiträge. Und dann lassen Sie uns das duplizieren, was gut ist, und lassen Sie es genau dort fallen. So. Das ist also eine kurze Beschreibung dessen, was hier unten zu erwarten ist. Aktualisiere das. Und lasst uns eine Vorschau der Änderungen anzeigen. Scrollen Sie ganz nach unten oder rechts nach unten. Das haben wir derzeit. Ich würde Ihnen raten, weiter mit den Einstellungen herumzuspielen , um zu sehen, was Sie mit dieser Post-Gier sonst noch produzieren können . Das nächste, was wir tun wollen ist dieses Formular genau hier zu erstellen. Es ist ein weiterer großartiger Aufruf zum Handeln. Holen Sie sich Fototipps, eine neue Lieferung in Ihren Posteingang. Dies ist also eine gute Möglichkeit, Benutzer-E-Mails zu erhalten , damit Sie regelmäßig mit ihnen sprechen können . Sehen wir uns an, wie Sie diesen Call-to-Action-Abschnitt in der nächsten Lektion erstellen können. Also wir sehen uns in Kürze. 16. Ein Formular hinzufügen: Das nächste, was wir erstellen möchten, ist dieser Call-to-Action-Bereich hier, für den sich angemeldet hat, und er ist ein ziemlich wichtiger Teil einer Zielseite, da Sie damit die Kontakte des Benutzers erfassen können . Und das ist ein sehr wichtiger Teil des Online-Geschäfts. Mal sehen, wie das in unseren Projekten geht. Also springe ich hier rein. Und was wir tun müssen, ist hier hinein zu gehen, nach oben zu scrollen und diesen Abschnitt zu duplizieren. Denken Sie daran, dass wir so etwas bereits geschaffen haben. Und jetzt, da wir zwei von ihnen haben, ziehe ich das einfach ganz nach unten. Und jetzt können wir das einfach bearbeiten. Alles, was wir tun müssen, ist hier hineinzugehen, diesen Abschnitt auszuwählen und dann den Stilhintergrund zu verwenden. Ich wähle ein anderes Bild aus. Ich glaube, ich wähle das aus. Legen Sie Medien ein. Und da haben wir es. Jetzt ist es also ein anderes Bild. Und das ist das Original. Gehen wir hier runter und Sie werden feststellen, dass diese hier auf unserer Referenzseite etwas größer ist und das liegt an der Form und dem gesamten Inhalt. Denken Sie daran, dass ich Ihnen gesagt habe, die Abschnitthöhe durch die Menge des darin enthaltenen Inhalts bestimmt wird. zuerst Lasst uns zuerst diese Texte schnappen. Ich kopiere das und wähle das aus und wähle es aus. Füge es da rein. Ich gehe weiter und wähle das aus. Und jetzt ist das Lorem ipsum oder Ride. Das nächste, was wir tun wollen, ist dieses Formular zu erstellen. Um dies zu tun, verwenden wir einen Formular-Plug-In-Code für den Terminator. Also lasst uns später für mich installieren. Aber lasst uns zunächst auf unsere Seite springen, sie aktualisieren und eine Vorschau der Änderungen anzeigen. Scrollen Sie ganz nach unten oder rechts nach unten. Das haben wir derzeit. Weg in unser Dashboard fällt also überein. Plugins, füge neu hinzu. Und in unserer Suchleiste hier tippen wir nach Minister. Wie der Terminator für Ministerformulare. Wo ist es? Ja, genau hier. 200 Tausend aktive Installationen von WP Mu dev. Also Jetzt installieren, ausführen oder fahren, Aktivieren. Und jetzt haben wir vier Minister installiert. So können wir von diesem linken Menü aus direkt hier darauf zugreifen. Also klicke einfach vier Minuten. Also nehmen wir diese Landing Page mit einer Zusammenfassung der Statistiken auf. Was wir also tun wollen, ist ein Formular zu erstellen. So wird create mit einigen vorgefertigten Vorlagen präsentiert. Und ja, lasst uns weitermachen und klicken Sie auf Newsletter-Anmeldung. Fahren Sie fort. Nennen wir ihm einen Namen. Anmeldeformulare, Anmeldeformular. Lass es uns erschaffen. Und jetzt wurde es erstellt. Also hier ist es mit seinem Namen, hat ein paar Optionen direkt hier in diesem Dropdown-Menü. Und du wirst sehen, wie wir diesen Kurzcode in einem Moment verwenden können . Schauen wir uns vorerst an, was wir haben. Auf der linken Seite haben wir verschiedene Panels, die verschiedene Phasen Ihrer Formularerstellung haben . Wenn Sie also Ihr Formular erstellen, sind dies die Phasen, die Sie durchlaufen. Sie erstellen also zuerst die Felder stylen dann die Felder. Dann bestimmen Sie, wie sich das Formular verhalten wird , wenn Personen Daten übermitteln, konfigurieren dann alle Einstellungen für E-Mail-Benachrichtigungen, wenn jemand Daten über E-Mail-Benachrichtigungen, wenn jemand ein Formular sendet, und wenn Sie sie integrieren möchten und all das Zeug. Aber im Moment wollen wir ein Formular erstellen, das hier im Frontend so angezeigt wird. Sie werden also feststellen, dass wir zwei Felder haben und wir haben diese Optionen zum Einfügen von Feldern. Wenn wir darauf klicken, können wir unserem Formular weitere Felder hinzufügen, aber es muss nur den Vornamen und die E-Mail-Adresse haben . Wenn wir eine Vorschau anzeigen , wird es so aussehen. Und lass uns da verschwinden. Und es hat diesen Abonnieren-Button. Also lasst uns eine Vorschau anzeigen. Und der Button sagt „Abonnieren“. Das ist also unsere Form. Lassen Sie uns dieses Formular veröffentlichen. Und sobald es veröffentlicht wurde, wird dieser Kurzcode präsentiert , den wir kopieren können, indem Sie auf dieses Symbol hier klicken. Wir haben es kopiert. Der Kurzcode wurde erfolgreich kopiert. Oder wir gehen hier hoch, Anmeldeformular, klicken darauf und kopieren den Kurzcode. Sobald Sie darauf klicken, kopieren Sie den Kurzcode. Ich gehe hier in unsere Seite, unseren Arbeitsbereich. Wir müssen hier hochgehen und auf das winzige Symbol klicken und Kurzcode sagen. Und ziehen wir dieses kurze Code-Element hierher. Lass es uns da reinlegen. Und solange es noch ausgewählt ist, können wir den Kurzcode eingeben, den wir gerade von hier kopiert haben. Wir kopieren einfach diesen Kurzcode. Und jetzt fügen wir es hier ein. Nun, das wird dieses Formular für uns anzeigen. Lassen Sie uns diesen Button loswerden und wenden Sie ihn nun an. Und lasst uns am Freitag wirklich ändern . Das haben wir vorerst. Gehen wir wieder rein und gehen wir ins Aussehen. Und inneres Aussehen. Sie werden feststellen, dass wir hier diese verschiedenen Optionen haben, flaches, kühnes Material und keine. Lassen Sie uns flach wählen, und das beseitigt die Grenzen der Eingabefelder. Und dann lass uns unter Farben ins Kostüm gehen. Gehen wir ins Kostüm, scrollen Sie nach unten und wählen Sie die Schaltfläche „Senden“. Dadurch sollten die verschiedenen Einstellungen für die Schaltfläche für die Hintergrundfarbe angezeigt werden. Lass es uns ändern, lass mich dieses Gelb auswählen. Kopiere das da drin. Lasst uns den gelben und eigenen Hoover einfügen , der gelesen werden wollte. Also gehe ich und hole mir diese milde Lektüre hier hin und füge sie dort ein. Und im Fokus wollen wir, dass es so ist, dass Rot gut ist, fügen Sie es dort ein. Aktualisieren wir das und sehen wir uns die Änderungen an. Oder richtig, also sieht es großartig aus. Lasst uns also direkt hineinspringen und Änderungen vornehmen. Änderungen, mit denen sich diese Änderungen jetzt in unserem elementaren Arbeitsbereich oder unserer Fahrt widerspiegeln . Lassen Sie uns also eine Vorschau der Änderungen anzeigen. Alles in Ordnung. Das ist es, was wir jetzt beim Schweben haben. Es ist rot und in seinem normalen Zustand ist es gelb. Lasst uns also hier zum Kontaktbereich springen. Lassen Sie uns also den Kontaktbereich hinzufügen. Was wir also tun wollen, ist einen sechsspaltigen Abschnitt hinzuzufügen. Also dieser Abschnitt hier mit sechs Spalten. Und ziehen wir das auf unsere Fünf-Punkte-Fünf-Marke genau dort hin. Und lasst uns das Gleiche für diesen 5.5 machen. Und schließlich für das 5.5, irgendwo dort. Und jetzt will ich herkommen und das duplizieren. Ziehen Sie es hier ganz nach unten rechts. Dann dupliziere das und ziehe es ganz nach unten. Lass es dort fallen. Geh zurück und kopiere das, dupliziere das. Was wir tun wollen, ist das Büro zu sagen. Und natürlich, wo das Büro ist, ist dieser Bereich genau dort. Und ich möchte das duplizieren und dann dort hineinziehen. Dupliziere das, ziehe das da rein. Und du kennst den Bohrer. Aber jetzt kann das dort fallen gelassen werden , denn denken Sie daran, dass dies zu klein ist, also ziehe ich das lassen Sie es dort hinein. Ändern Sie diese Größe auf 5,55,5, irgendwo gibt es 5,5. Ich kann keinen 5.5 bekommen, aber ich werde das duplizieren und Seide fallen lassen und dort hineinlegen. Also erweitern Sie es und fallen Sie dort ab. Der 5.5. Dann dupliziere das. Lass das da rein. Dupliziere das, lass das da rein. Lasst uns weitermachen und uns diese Nummer schnappen. Lass es da rein und füge es ein. Mailen Sie mir. Ruf mich an. Aktualisieren wir das und lassen Sie uns eine Vorschau der Änderungen anzeigen. Richtig. Scrollen wir ganz nach unten. Und das haben wir. Aber wir müssen ganz oben etwas gegen diese Marge unternehmen. Gehen wir also zurück, wählen Sie das erweiterte aus, brechen Sie diesen Link auf. Also haben wir es mit der Spitze zu tun, nur mit 100. Und lasst uns das aktualisieren. Jetzt, da wir mit dem Kontaktbereich fertig sind, lassen Sie uns eine Vorschau anzeigen. Trocken. Scrollen wir ganz nach unten. Perfekt. Jetzt, da wir mit dem Kontaktbereich fertig sind, erstellen wir diesen Kartenabschnitt. Dies kommt direkt von Google Maps. 17. Hilf mir Elementor zu 10.000 Kursteilnehmerinnen und Kursteilnehmerinnen: Hallo mein Freund. Zunächst möchte ich mich nur ganz herzlich dafür bedanken, dass Sie sich mir in diesem Kurs angeschlossen haben und von mir lernen möchten. Und ich möchte auch gratulieren so weit in die Klasse gekommen sind. Die Tatsache, dass Sie so weit in den Unterricht gekommen sind , bedeutet, dass Sie von der Klasse profitieren. Deshalb schätze ich dich sehr und hoffe, dass dir der Unterricht selbst Spaß macht. Davon abgesehen brauche ich deine Hilfe. Ich habe es mir zur Aufgabe gemacht, mindestens 10.000 Unternehmern wie Ihnen beizubringen , elementary zu verwenden , um ihre eigenen Websites oder Zielseiten zu erstellen , um ihre Produkte zu verkaufen. Und so können Sie helfen. Du siehst, wenn ein neuer Schüler einer Klasse auf Skillshare beitritt und diese Klasse dann mag und hinterlasse eine Bewertung. Es hilft anderen Schülern zu wissen, was sie von der Klasse erwarten können. Und wenn eine Klasse viele Bewertungen von Schülern erhält , sagt Skillshare: Hey, weißt du was? Dieser Kurs erhält viel Engagement und viele Kritiken von den Schülern. Es muss also hilfreich sein. Also muss es nützlich sein. Lassen Sie uns es also in der Bibliothek nach oben schieben , damit es für neue Schüler besser auffindbar ist. Der Skillshare-Algorithmus treibt diese Klasse nach oben und macht sie für neue Schüler sichtbarer und besser auffindbar . Weil es positive Bewertungen erhalten hat. Und da kommst du ins Spiel. Bitte begleiten Sie mich bei dieser Mission und helfen Sie mir mindestens 10.000 Schülern beizubringen, wie man Elementor benutzt, wie man schöne Landingpages erstellt, funktionierende Websites, indem man eine Rezension in dieser Klasse hinterließ und sie wissen zu lassen, was sie von diesem Kurs erwarten können. Du brauchst nur etwa zwei Minuten und du bist fertig. Ihre Bewertung wird jedoch dazu beitragen, dass neue Schüler Studieninteressierte wissen, was sie von der Klasse erwarten können. Unterricht entspricht Ihren Erwartungen. Hat es Ihre Erwartungen übertroffen? Wenn Sie Fragen haben, denken Sie daran, dass Sie diese jederzeit im Diskussionsbereich unter diesem Video ablegen können, damit ich Ihnen weiterhelfen kann. Ich antworte immer auf jede einzelne Frage oder jeden Kommentar, den die Schüler in einer meiner Klassen hinterlassen. Und nachdem das gesagt ist, möchte ich nur sagen, viel Spaß beim Unterricht und wir sehen uns in der nächsten Lektion. Frieden! 18. Eine Google Map hinzufügen: Willkommen zurück. In dieser Lektion möchten wir diese Google Maps hinzufügen, damit die Leute uns sehen können , wenn Sie Fotograf sind und jemand einen Termin mit Ihnen gebucht hat oder Sie gerne hineingehen möchten Kunden, um Ihr Büro finden zu können. Sie möchten eine Karte auf Ihrer Website auf Ihrer Landing Page. Also schauen wir uns an, wie man diese Karte hinzufügt. Sprung in unseren Arbeitsbereich genau hier. Was wir tun möchten, ist einen Abschnitt mit voller Breite, einer einzelnen Spalte und voller Breite hinzuzufügen . Und lassen Sie uns eine Top-Marge von 100 geben. Also gehen Sie nach innen fortgeschritten, brechen diese Verbindung, also haben wir es mit einer Top-Marge zu tun. Lasst uns ein 100 geben. Und jetzt wählen wir dort das Pluszeichen aus. Und hier drin tippen Sie Map. Wir haben hier ein paar Kartenoptionen. Derjenige, den wir Epi wollen, ist Google Maps. Lass es da rein. Und jetzt haben wir hier verschiedene Möglichkeiten , die Sie ausfüllen können. Dies geben Sie beispielsweise genau hier Ihren tatsächlichen Standort oder den Standort Ihres Büros oder Ihres Studios ein. Und lasst uns das aktualisieren und eine Vorschau der Änderungen anzeigen. Scrollen Sie also nach unten oder Freitag, also ist es jetzt live auf der Webseite. Das nächste, was wir tun wollen, und die Leute können zur eigentlichen Google-Map wechseln. Wechseln wir also einfach zu diesem Teil der Stadt. Und da sind wir los und sie können sich bewegen und hineinzoomen, wenn sie wollen. Dies ist Google Maps, die auf unserer Website eingebettet sind, indem Sie es in diesem div platzieren. Jetzt, da wir mit einer Map fertig sind, der nächste Teil, der noch übrig ist , die Fußzeile und wir sind fertig mit der Landing Page. Schauen wir uns also in der nächsten Lektion an, wie das geht. Wir sehen uns in Kürze. 19. Die Fußzeile erstellen: Willkommen zurück. In dieser Lektion sind wir gerade dabei, die Zielseite zu erstellen, aber wir müssen den Ordner hinzufügen und die Seite natürlich ansprechen, bevor wir die Dinge abschließen. Lasst uns also direkt in unsere Seite springen. Und jetzt wollen wir diese Seite jetzt verlassen , weil wir den Hauptteil der Seite bearbeitet haben. Wollen Sie also hier beenden und ins Dashboard gehen. Ich schließe das Exit to Dashboard. Ich fahre gleich dort aus. Und ich gehe ins Aussehen, Elementor, Kopf- und Fußzeilengenerator. Und jetzt möchten wir einen Ordner erstellen. Also füge ich neu hinzu und es wird das überspringen. Und lasst uns direkt zur Benennung des 41. gehen. Meine Fußzeile wählt den Ordner aus. Das ist die Art der Vorlage. Ich möchte, dass es auf der gesamten Website sichtbar ist und jeder kann es bearbeiten. Also als Nächstes hier, Elementor volle Breite, sagen wir keine Seitenleiste, vorwärts strecken. Deaktivieren wir diese vier Einstellungen genau dort. Und dann veröffentlichen wir es. Jetzt und jetzt. Bearbeiten Sie mit Elementor, weil wir es visuell im Frontend unseres Arbeitsbereichs erstellen . Das erste, was wir tun wollen, ist das Logo hinzuzufügen. Fügen wir also einen Abschnitt mit voller Breite hinzu, einzelnen Spaltenabschnitt, also für die Breite. Und fügen wir ein Bildelement hinzu. Und wir haben dieses Bild ausgewählt, ich wähle hier aus und wähle das Logo aus. Legen Sie Medien ein. Es ist die richtige Größe. Ich habe es so geschaffen , dass es sehr klein ist und deshalb passt es genau hier. Das nächste, was wir tun möchten, ist hier auf das kleine Symbol zu klicken und den Texteditor auszuwählen. Ziehen Sie das unter das Logo. Lassen Sie uns fortfahren und diesen Copyright-Text kopieren. Kopiere das. Während dies noch ausgewählt ist, lasse ich das dort rein und ich gehe in den Stil und zentralisiere es. Ändern wir die Farbe in Weiß. Und lassen Sie uns die Schriftfamilie in Montserrat umstellen. Ordnung. Reduzieren wir die Größe auf 12. Weil das urheberrechtliche Informationen sind. Es muss nicht sehr groß sein. Lasst uns das aktualisieren. Und während wir das aktualisieren, klicken wir darauf und geben Social ein. Weil wir Social-Media-Symbole hinzufügen möchten. Ziehen wir das also und lassen Sie es dort rein. Und jetzt sind diese Icons zu groß, also gehen wir in Stil und Größe ein. Reduzieren wir es bis zu diesem Punkt genau dort. In Ordnung, und dann wählen wir diesen Text aus. Gehen Sie zu Erweiterter Rand, brechen Sie diesen Link und den unteren Rand auf. Reduzieren wir es, damit wir sie ein bisschen näher bringen können. Und lasst uns das aktualisieren. Ich glaube, das gefällt mir. Lassen Sie uns eine Vorschau der Änderungen anzeigen. So sieht unsere Fußzeile aus. Also geh wieder rein. Jetzt, da wir mit der Fußzeile fertig sind, können wir diese Seite schließen. Also gehe ich in den Inhalt ein. Nein, ich gehe in die Clique das Burger-Menü Beenden Sie das Dashboard. Und jetzt gehst du in Seiten. Auf der Homepage klicke ich mit der rechten Maustaste auf Anzeigen und öffne den Link in einem neuen Tab, damit wir ihn ansehen können. Und hier ist es. Sehen wir es uns von oben nach unten an, denn jetzt sind wir mit dem gesamten Inhalt fertig. Das einzige, was noch übrig bleibt, ist die Seite ansprechend zu machen. Stimmt's? Also los geht's. Die animierten Texte, er arbeitet einwandfrei. Ich erinnere mich nur daran, dass wir etwas gegen diesen Button unternehmen müssen . Es hat nicht den Effekt, den wir auf der Originalseite hatten. Lass mich einfach nach oben scrollen. Wir müssen diesen Floating-Effekt hinzufügen und ich zeige Ihnen, wie das geht. jetzt zu unserer Seite springen, haben wir gerade entworfen und scrollen nach unten. Stimmt's? Das haben wir also. Wir haben diese geschaffen. Sei stolz auf dich selbst. Sie haben diese bisher erstellt, wenn Sie mitgemacht haben und es so weit geschafft haben, klopfen Sie sich auf den Rücken. Gönnen Sie sich heute eine Pause, schauen Sie sich einen Film oder so etwas an. Beachten Sie jedoch, dass unser Ordner derzeit nicht diesen oberen Rand hat und auch diesen grauen Hintergrund haben muss. Lasst uns bis zum Ende scrollen, muss diesen grauen Hintergrund haben. Gehen Sie also zurück auf unsere Seite, nein, in unserer Fußzeile. Gehen wir zur Elementar-Kopf- und Fußzeile des Erscheinungsbildes. Oder wir können direkt hier ins Frontend gehen. Und wenn wir den Mauszeiger über Elementor edit mit Elementor bewegen, können wir auf meine Fußzeile klicken und es öffnet den Ordnerarbeitsbereich und wir können das Foto von dort aus bearbeiten. Alles klar, also hier sind wir. Wählen wir den Abschnitt selbst aus. Gehe zu Erweitert, brich den Link auf. Lassen Sie uns eine Top-Marge von 50 geben. Nein. Das sollte die Polsterung sein. Tut mir Leid. Das ist also die Polsterung oben von 50. So. Und lass uns dir auch unten 50 geben. Und lasst uns in Stil, Hintergrund gehen. Geben wir ihm diese graue Farbe. Dunkelgraue Farbe wie diese. Dunkelgrau, das gefällt mir. Also aktualisiere das. Wenn wir jetzt zurückgehen und mit der rechten Maustaste auf unsere Seite klicken, klicken Sie mit der rechten Maustaste auf Ansicht Und dann springen, schau dir unsere Seite an. Scrollen wir ganz nach unten. Dort sehen wir es super toll aus. Aber jetzt lassen Sie uns die Polsterung hier unten auf der Karte erhöhen die Polsterung hier , damit es unten etwas Schwarz hat. Also lasst uns wieder hier rein gehen. Lassen Sie uns den Mauszeiger mit Elementor über Elementor bearbeiten und klicken wir auf Bearbeiten mit Elementor. So können wir die Seite selbst bearbeiten. Rufen wir unten an. Hier haben wir unsere Karte. Was wir also tun müssen, ist auf diesen Kartenabschnitt selbst Advanced zu klicken diesen Kartenabschnitt selbst Advanced und ihm einen unteren Rand von 50 zu geben. Ja, lass uns an diesem Date eine 50 geben, schlecht. Jetzt können wir die Änderungen in der Vorschau anzeigen. Lass uns ganz nach unten wachsen. Alles klar, also haben wir hier etwas mehr Platz, etwas mehr Schwarz direkt unter der Karte. Und das ist die Landing Page. Wir sind fertig mit dem Design auf dem Desktop. Es ist jetzt an der Zeit, die Zielseite auf verschiedenen Gerätegrößen anzusprechen , bevor sie die Dinge abschließen. Wir sehen uns also in der nächsten Lektion. 20. Responsives Design: Die Navbar: Willkommen zurück. Wir haben die Landing Page bereits auf dem Desktop gut aussehen lassen. Zeit, es auf kleineren Bildschirmen als Smartphones und Tablets nicht gut aussehen zu lassen. Ohne mehr Zeit zu verschwenden, springen wir in das Armaturenbrett und fangen an. Und wir fangen mit einer Nav-Bar an. Also hier drin gehen wir in Aussehen, Element-, Kopf- und Fußzeilengenerator. Und klicken wir auf Bearbeiten mit Elementor. Bearbeiten wir die Navigationsleiste mit elementor. Okay, also hier sind wir. Dies ist der Ort, an dem wir die Navigationsleiste bearbeitet haben. Und jetzt möchte ich es reaktionsschnell machen. wir also hier runter Klicken wir also hier runter auf dieses Symbol für den Responsive-Modus. Es wird diese Leiste genau hier mit all diesen Konfigurationen aufrufen , die uns helfen, die Seite ansprechend zu gestalten. Wie Sie sehen können, haben wir mobile Einstellungen, Tablet-Einstellungen und wir befinden uns gerade in den Desktop-Einstellungen. Wechseln wir also zum Handy. Da sind wir also. Was wir also tun wollen, ist, wenn ich einfach für eine Sekunde wieder zum Desktop-Maulwurf wechseln könnte , möchte ich dir etwas zeigen. In diesem Abschnitt mit voller Breite haben wir zwei Spalten, die Logospalte und die Menüspalte. Jede dieser beiden Spalten belegt also einen Prozentsatz des Abschnitts mit voller Breite. Wenn wir also zu mobilen Bildschirmen wechseln, ist der Abschnitt immer noch in voller Breite, aber wir müssen diese beiden Spalten jetzt in 100% dieser Spalte mit voller Breite aufteilen . Das tun wir also, indem wir hier die erste Spalte auswählen, die Spalte mit dem Logo enthält. Wählen wir das aus. Und unter Layout-Spaltenbreite sagen wir 50 Prozent. Als Nächstes wählen wir die zweite Spalte aus. Und unter Layout-Spalte mit sagen wir 50. Und jetzt sind die beiden in der gleichen Linie. Was wir als Nächstes tun müssen, klicken Sie im Menü „Auswählen“ auf eine beliebige Stelle hinein. Und unter dem Layout. Scrollen wir nach unten und finden die Ausrichtung. Unter reaktionsschneller Ausrichtung. Richten wir es nach rechts aus. Und jetzt ist es auf der rechten Seite. Lasst uns nach oben wachsen. Gehen Sie in Stil, wir wollen es breit machen. Lassen Sie uns das Hauptmenü reduzieren und Hauptauslöser erweitern und das Symbol schließen. Geben wir ihm also eine Hintergrundfarbe von Weiß. Im Moment ist es also weiß. Und beim Schweben sagen wir den Hintergrund zu diesem Gelb. Wählen wir also den Hintergrund aus. Ich gehe rüber, um diese gelbe Farbe auszuwählen. Kopiere das. Und lass uns wieder hier rein gehen. Ändern wir die Farbe in Gelb. Also beim Schweben ist es gelb. Richtig, lasst uns das aktualisieren. Und jetzt klicken Sie neu auf das Symbol selbst, um das Dropdown-Menü aufzurufen. Sie sehen, dass das Dropdown-Menü weiß ist. Lassen Sie uns also den Hauptauslöser reduzieren und gehen wir zum Dropdown-Menü . Scrollen Sie zunächst nach unten und suchen Sie nach oberster Distanz. Lassen Sie es uns unter diesen Punkt fallen, damit das Menü sichtbar ist. Schieben Sie es ein wenig nach oben. Und dann werden Sie feststellen, dass die Schriftarten standardmäßig weiß und beim Mauszeiger gelb sind . Also lasst uns etwas dagegen unternehmen. Scrollen Sie also nach oben, während Sie immer noch unter Dropdown, Topographie, Textfarbe stehen. Aber seit dem zu diesem Gelb. Und jetzt sind sie gelb. Und beim Schweben wollen wir, dass sie weiß sind. Also weiter vorbei. Die Farbe ist weiß, Normalzustand, gelb. Das nächste, was wir tun wollen ist, die Hintergrundfarbe zu ändern. Unter normalen Umständen. Wir wollen, dass es so grau ist. Stimmt's? Lasst uns das aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. In Ordnung, um zu sehen wie es auf mobilen Bildschirmen aussieht, drücken Sie die Umschalttaste I oder meine Fenster, um die DevTools zu öffnen. Das wird die DevTools aufrufen. Und ich kann auf dieses winzige Symbol hier klicken , das Symbol für den Responsive-Modus. Und das wird die Ansicht umschalten, um mobile Geräte nachzuahmen. Und in diesem Dropdown-Menü können wir viele verschiedene Arten von Geräten nachahmen, einschließlich iPads, iPhones und Galaxien. So sieht es derzeit auf Mobiltelefonen aus. Wenn wir das erweitern, lassen Sie uns das zusammenbrechen. Es ist erweitert. Ja, ich glaube, es gefällt mir. Lasst uns genau hier etwas gegen diese Grenze unternehmen. Während wir uns noch im Dropdown-Menü befinden, scrollen wir nach unten und suchen nach einem Teiler. Hier, genau hier, Trennwand, Grenzstil. Ändere das in „None“. Das sollte diese Zeilen genau dort loswerden. Und jetzt sehen die Dropdown-Menüs viel besser aus. Lasst uns das also aktualisieren. Und lasst uns eine Vorschau der Änderungen anzeigen. Alles klar, also steuere auf dieser Seite die Umschalttaste I und ich klicke genau dort auf das winzige Symbol. Rufen Sie den Responsive-Modus auf. Klicken wir auf das Icon in unserem Menü. Sieht toll aus, ich mag es. Das nächste, was wir tun wollen, ist den Rest der Seite ansprechend zu machen. Wir sind fertig mit der Nav-Bar. Also wir sehen uns in Kürze. 21. Responsive Design: Der Hauptkörper: Alles klar, ich mag es. Das nächste, was wir tun wollen, ist, den Rest der Landing Page auf Mobiltelefonen großartig aussehen zu lassen. Also lasst uns wieder reinspringen. Jetzt, da wir mit den Smartphone-Menüs fertig sind, verlassen wir diesen Arbeitsbereich. Also klicke ich auf dieses Burger-Menü und Beenden Sie das Dashboard. Lassen Sie uns als Nächstes in die Seiten springen. Und lasst uns unsere Seite finden. Also hier sind wir, unsere Landing Page. Editieren wir mit Elementor. Wechseln wir also in den Responsive-Modus und sehen, wie es aussieht. Klicken wir also auf die mobile Ansicht. Fangen wir mit den animierten Texten an. Klicke das an. Jetzt gehe in Stil und Stil, ich gehe zu ausgefallenen Texten, ausgefallenen Textilien und Typografie, die die Größe bis zu diesem Ort reduziert haben. Und dann lasst uns das zusammenbrechen. Ich gehe in Suffix-Textilien. Jetzt möchten Sie die Größe dieses Punktes bis zu diesem Punkt reduzieren. Lasst uns das aktualisieren. Und obwohl es noch ausgewählt ist, gehen wir weiter hinein. Und lasst uns diese Margin-Verbindung aufbrechen , die sie so trennen sollte. Das nächste, was wir tun möchten, ist, hier auf diese Spalte zu klicken und weiter hinein zu gehen. Lassen Sie uns eine Polsterung von 15 geben, ohne den Link zu unterbrechen, damit er für alle Felder hier gilt. Also 15, und sagen wir 20. 20 ist okay. Wir müssen das ein wenig vorantreiben. Wählen Sie also diesen Abschnitt aus, gehen Sie in den Vormarsch, lassen Sie uns brechen, lasst uns die Polsterung unterbrechen. Und jetzt schieben wir es allmählich nach unten bis zu dieser Stelle. Ich mag es dort. Lassen Sie uns als Nächstes zum Button übergehen. Ich wähle den Button selbst aus. Und ich gehe fortgeschritten rein. Lasst uns die Margin-Verbindung aufbrechen. Und das sollte alle Einstellungen loswerden, die es gab. Alles klar, lasst uns nach unten scrollen. Ich glaube, ich mag es, wo alles ist. Manche Leute bevorzugen alles in der Mitte, aber ich denke, ich mag es, wo alles von links nach rechts positioniert ist. Wir können diese Spalten genau hier auswählen. M dafür können wir ihm auch eine Polsterung von 20 geben , ohne die Verbindung zu brechen. Und diese 20 wurde auf all diese Säulen angewendet, weil sie sich in dieser Hauptsäule befinden. Dies sind, dies ist eine Kreuzung. Dies sind Kreuzungen. Als Nächstes gehen wir hier rein. Wähle ein Licht aus, das in Ordnung aussieht. Alles klar, also berühren sich diese Boxen hier. Oben und unten. Wir müssen die obere und untere Marge erhöhen. Also wähle ich eines der Boxen aus, gehe in Advanced, ich gebe ihm eine Marge von zehn. Und jetzt sollte das für alle Felder dort gelten, jeden 2D-Bereich aus allem. Also wähle ich aus, ich klicke mit der rechten Maustaste, kopiere es und klicke dann mit der rechten Maustaste darauf und füge den Stil ein. Ich wiederhole das Gleiche für diese beiden, füge Stil ein und schließlich den Stil einfügen. Und jetzt sind sie richtig verteilt. Lass uns weitermachen. Ich mag, wo diese Opposition, wir können diese Spalte auswählen, weiter hinein gehen. Probieren wir es aus Knie 20 Pixel Rand. So. Ich sollte das Bild von den Rändern entfernen. Stimmt's? Als Nächstes wählen wir diese Spalte genau hier aus. fortgeschrittenen 20-Jahr sollte ich etwas Platz zwischen dieser Form und den Rändern schaffen . Lass uns hier runter gehen. Wählen Sie diesen Untertitel aus. Richten wir es an der Mitte aus. Wählen Sie das aus. wähle ich aus. Gehe in den Stil, Mitte. Mach das Gleiche dafür. Und schließlich dieser Stil. Richten Sie die Mitte aus. Ich denke, ich mag, wo die Map ist, aber wir können ihr auch etwas Polsterung geben. Also wähle ich die Spalte selbst aus, Padding von 20. Und dann denke ich, dass ich mag, wo die Fußzeile ist, also werden wir sie nicht berühren. Lasst uns das aktualisieren. Und lasst uns die Änderungen überprüfen. Ehrfürchtig, also klicke ich auf das Icon hier. Und wechseln wir zur mobilen Ansicht. So sollte es also auf mobilen Bildschirmen aussehen. Jetzt sieht das Menü, die Navbar super aus. Das Dropdown-Menü funktioniert einwandfrei. Und wenn wir anfangen zu scrollen, im Gegensatz zur Hero-Sektion, gefällt mir im Gegensatz zur Hero-Sektion, wo sich alles befindet. Also denke ich damit, dass dies das Ende des Unterrichts markiert. Ich habe es wirklich genossen, dich zu unterrichten und ich hoffe, es hat dir Spaß gemacht. Vor allem aber hoffe ich, dass du etwas gelernt hast. Ich hoffe, Sie haben eine neue Fähigkeit erworben, die Sie jetzt in realen Projekten einsetzen können. Mein Name ist Ken Visa. Es ist immer ein Vergnügen, hier mit dir zusammen zu sein. Und wir werden das nächste Mal weitermachen.