Inhaltsverzeichnis 1. Willkommen ................................................... 1 Willkommen! ................................................................................. 3 Neue Features ................................................................................. 6 Installieren der Software ............................................................ 13 2. Einrichten von Websites und Seiten ...... 17 Der Startassistent .........................................................................
Inhaltsverzeichnis 4. Die Navigationselemente ......................... 73 Einfügen von Navigationsleisten .............................................. 75 Einfügen von Popup-Menüs ..................................................... 79 Einfügen von Schaltflächen ....................................................... 81 Einfügen von Hyperlinks und Aktionen................................. 85 Einfügen von Ankern ..................................................................
Inhaltsverzeichnis 7. Soziale Netzwerke .................................. 157 Einfügen von Facebook-Objekten ......................................... 159 Einfügen von Twitter-Objekten ............................................. 161 Einfügen einer „Google +1“-Schaltfläche ............................. 165 Einfügen eines Lesezeichen-Symbolstreifens für soziale Netzwerke ................................................................................... 168 8. Multimedia .................................
Inhaltsverzeichnis 11. Kreatives Arbeiten mit Quelldateien . 217 Arbeiten mit Quelldateien ....................................................... 219 Arbeiten mit dem Quelldatei-Browser ..................................223 Speichern eigener Quelldateien und ihrer Einstellungen ..227 12. Vorschau und Publizieren ...................... 233 Die Aufgabenliste ....................................................................... 235 Öffnen einer Website-Vorschau ............................................
Willkommen
2 Willkommen
Willkommen Willkommen! Willkommen zu WebPlus X8 von Serif, der unkomplizierten Komplettlösung für private und geschäftliche Websites. WebPlus vereinfacht das Design professioneller und ansprechender Websites enorm – Sie konzentrieren sich einfach auf die visuellen Aspekte, und unsere Software erledigt die ganze Programmierarbeit.
4 Willkommen dynamische und interaktive Inhalte in Ihre Webseiten einfügen und flexibel verwalten, wie z. B. Formulare, Blogs, Foren,Video-Playlisten sowie RSS-Feeds von anderen Websites. Moderne und unverzichtbare Webelemente, wie Panels, Slider und Google Maps dürfen natürlich ebenso wenig fehlen wie Objekte für Facebook, Twitter und Google+. Mit den unkomplizierten E-Commerce-Tools können Sie sogar Schritt für Schritt Ihren eigenen Onlineshop mit Warenkorb oder eine Spenden-Website einrichten.
Willkommen 5 Registrierung Vergessen Sie nicht, Ihre Kopie des Programms mit dem Registrierungsassistenten aus dem Menü Hilfe bei uns zu registrieren. Wir halten Sie dann automatisch über neue Entwicklungen und verfügbare Upgrades auf dem Laufenden. Eine Anmerkung zu diesem Handbuch Das Handbuch zu WebPlus X8 wurde als „Starthilfe“ für neue Kunden oder Einsteiger in die Welt des Webdesigns entwickelt, damit Sie sich schnell in WebPlus zurechtfinden.
6 Willkommen Neue Features WebPlus X8 bietet in seinen 32- und 64-Bit-Versionen jede Menge neue Designmöglichkeiten, zusätzliche Features für Fotos und noch mehr Bearbeitungsoptionen. • Interaktive Registerkarte „Aufgabenliste“ (siehe Seite 235) Die interaktive Registerkarte „Aufgabenliste“ übernimmt die Rolle Ihres persönlichen Designassistenten, erinnert Sie an alle möglichen Aufgaben, die noch zu erledigen sind, und weist Sie automatisch auf Probleme mit verschiedenen Aspekten Ihrer Website hin.
Willkommen 7 können Sie auf einen Schlag alle Bilder, Videos, Musikstücke oder andere große Dateien auf beliebige Server übertragen und diese Ressourcen von Ihrer eigentlichen Website getrennt lagern. • Speichern als Paket Wenn Sie Ihre WebPlus-Projektdatei auf andere Computer übertragen möchten, speichern Sie die Datei einfach als Paket. Dieses Paket enthält dann Ihr WebPlus-Design, alle auf den Seiten verwendeten Schriften sowie alle per Link eingebundenen Bilder und anderen Ressourcen.
8 Willkommen auf selbst entwerfen, neue Panels hinzufügen sowie bestehende Panels löschen. Importieren Sie einfach die gewünschten Bilder, fügen Sie Texte und Ihre bevorzugten Quelldateien ein und entwerfen Sie mit den Grafikwerkzeugen alle Formen, Füllungen und Farben für Ihre Website. Auch hier lassen sich alle Objekte mit 1-Klick-Formatvorlagen anpassen – genau wie in WebPlus selbst.
Willkommen 9 sich bequem an Ihre Website übertragen, damit sie automatisch mit den Webseiten zusammen heruntergeladen werden. • Audioplayer (siehe Seite 183) Mit dem konfigurierbaren Audioplayer können Sie Ihren Website-Besuchern Musikstücke und andere Audiodateien auf Ihren Webseiten anbieten. Der Player verwendet die neueste HTML5-Technologie und bietet daher ein hohes Maß an Effektivität und Kompatibilität. Fügen Sie einfach einzelne Musikstücke oder ganze Playlisten ein.
10 Willkommen • Wasserzeichen für Bilder (siehe Seite 62) Schützen Sie Ihre Fotos, künstlerischen Designs und anderen wertvollen Bilder mit selbst entworfenen Wasserzeichen. Konfigurieren Sie einfach alle Einstellungen für das Wasserzeichen.
Willkommen 11 Interaktivität und Ausgabe • Neue Website-Suche (siehe Seite 133) Die neue Option für die Website-Suche kann neben den normalen Inhalten Ihrer Website nun auch die Texte von Blogs, Foren und anderen Smart-Objekten erfassen. Sie können diese Suche sogar gezielt auf bestimmte Seiten beschränken, indem Sie den gewünschten Seiten Tags (Marker) zuweisen.
12 Willkommen • Export als Widget Interaktive Elemente Ihrer Website lassen sich als Widgets exportieren und dann in andere Websites integrieren. Sie können den entsprechenden Code entweder von Hand einfügen oder auch eine andere Webdesign-Software verwenden. Navigationsleisten, Popup-Menüs, Fotogalerien, Slider und viele andere in WebPlus entworfene Features lassen sich auf diese Weise exportieren. Der Export enthält alle notwendigen HTML-, Skript- und Grafikdateien.
Willkommen 13 Installieren der Software Die Schritte zur Installation von WebPlus variieren je nach der von Ihnen erworbenen Version (Produkt-Disc oder Download). Sie können die neue Version auf demselben PC installieren wie Vorgängerversionen und diese unterschiedlichen Programmversionen unabhängig voneinander verwenden. Die 32-Bit- bzw. 64-Bit-Version von WebPlus X8 wird automatisch auf den Computern mit entsprechendem Betriebssystem (32 Bit oder 64 Bit) installiert.
14 Willkommen Installieren der Software mit einer Download-Version • Melden Sie sich auf Serif.com bei Ihrem Benutzerkonto an und führen Sie die auf dem Bildschirm angezeigten Schritte aus.
Willkommen 15 werden ein Internetzugang und ein Benutzerkonto bei einem Internet Service Provider benötigt. * Der Hauptprozessor muss den SSE2-Befehlssatz unterstützen. Empfohlen: • 560 MB freier Festplattenspeicher • Für die Bearbeitung großer oder komplexer Websites werden zusätzliche Festplattenkapazität und mehr Arbeitsspeicher benötigt.
16 Willkommen
Einrichten von Websites und Seiten
18 Einrichten von Websites und Seiten
Einrichten von Websites und Seiten 19 Der Startassistent Nach der Installation von WebPlus können Sie direkt mit Ihrer Arbeit beginnen. • Für Windows Vista/7: Das Installationsprogramm fügt automatisch einen Eintrag Serif WebPlus X8 in dem Menüpunkt Alle Programme des Start-Menüs von Windows hinzu. Klicken Sie auf die Schaltfläche Start in Windows, um das Startmenü zu öffnen, klicken Sie auf Alle Programme und dann auf Serif WebPlus X8.
20 Einrichten von Websites und Seiten Nach dem ersten Programmstart wird automatisch der Startassistent eingeblendet, der Ihnen folgende Einstiegsmöglichkeiten in WebPlus bietet: Die verschiedenen Optionen im Überblick: Über die normale Startseite erhalten Sie Informationen von Serif zu Sonderaktionen und können verschiedene Artikel lesen (z. B. Tutorials). Hier finden Sie auch das Übersichts- und QuickStartVideo zu WebPlus.
Einrichten von Websites und Seiten 21 Hier finden Sie Onlinevideos und Texttutorials, Hilfe, Tipps & Tricks sowie viele andere Informationen, die über einen Feed aktualisiert werden. Die Artikel des Feeds lassen sich natürlich auch nach Typen filtern. Über diese Option können Sie auch auf das Handbuch und die Hilfe zu WebPlus X8 zugreifen. Mit dieser Option legen Sie eine komplett neue Website an und stellen zunächst die Grundoptionen ein.
22 Einrichten von Websites und Seiten Wenn Sie auf einen neuen Artikel klicken, wird der „Neu“-Marker in den „Gelesen“-Marker umgewandelt. Über das Suchen-Feld oben rechts im Startassistenten können Sie alle Informationen nach Stichwörtern durchsuchen. Auf diese Weise finden Sie schnell und einfach die gewünschten Informationen zu bestimmten Artikeln, Website-Namen, Themenlayouts, News-Meldungen usw.
Einrichten von Websites und Seiten • 23 Seitenauswahl: Hier können Sie einige oder auch alle Vorlagenseiten auswählen (z. B. Homepage, Produkte, Downloads usw.), die Sie als Grundstein für Ihre Website verwenden möchten. Generell gibt es zwei Arten von Designvorlagen – Themenlayouts und Pro-Vorlagen. Themenlayouts Hier finden Sie eine breite Palette an Themen (wie z. B. Okö, Pop, Prospekt und noch viele andere), die Sie als Grundthema für Ihre Website verwenden können.
24 Einrichten von Websites und Seiten Pro-Vorlagen Diese in Kategorien unterteilten Vorlagen enthalten Lizenzgebühr freie Bilder, sodass Sie schnell und einfach Ihre eigenen Websites zusammenstellen können. Sie müssen nur noch den Platzhaltertext durch Ihren eigenen Text ersetzen und anschließend die Website publizieren.
Einrichten von Websites und Seiten 25 Erstellen einer Website mit einer Designvorlage 1. Starten Sie WebPlus, oder klicken Sie im Menü Datei auf Startassistent. 2. Klicken Sie auf die Option Vorlagen. 3. Wählen Sie in dem farbigen Feld eine der Desktop- oder Mobil-Optionen aus den Kategorien der Themenlayouts oder den Pro-Vorlagen von WebPlus X8 aus. 4. Blättern Sie mit der rechten Bildlaufleiste durch das Hauptfeld. 5.
26 Einrichten von Websites und Seiten Pro-Designvorlage (Desktop) Pro-Designvorlage (Mobil) 6. Legen Sie in dem rechten Feld fest, welche Seiten Sie für Ihre Website verwenden möchten. Klicken Sie hierzu einfach auf die Kästchen unter den Seitenminiaturen, um diese mit Häkchen zu markieren bzw. gesetzte Häkchen zu entfernen. 7. Wählen Sie am oberen Rand des Dialogfelds ein Farbschema aus. Die ersten drei Optionen in diesem Dropdownfeld sind speziell auf die ausgewählte Vorlage zugeschnitten.
Einrichten von Websites und Seiten 27 auf die Seitenvorschau prüfen. Die Seitenminiaturansichten werden automatisch aktualisiert, um den neuen Look der Seiten widerzuspiegeln. 8. (Optional) Möchten Sie Ihre Auswähl ändern, klicken Sie auf ZURÜCK. 9. Klicken Sie auf die Schaltfläche OK. Die Seiten werden nun in Ihre neue Website eingefügt.
28 Einrichten von Websites und Seiten Erstellen einer neuen Website ohne Vorlage mit dem Startassistenten 1. Starten Sie WebPlus, um den Startassistenten zu aktivieren. ODER Klicken Sie in einer laufenden Arbeitssitzung im Menü Datei auf Startassistent. 2. Klicken Sie auf Neue Website. 3. Vervollständigen Sie die im Hauptfeld eingeblendeten Details. 4. Klicken Sie auf Neue Website anlegen. Ihre Website wird nun erstellt und lässt sich flexibel bearbeiten.
Einrichten von Websites und Seiten 29 Die neue Website wird nun mit einer leeren Seite geöffnet, die mit den standardmäßig verwendeten WebsiteEigenschaften formatiert ist. Öffnen einer bestehenden Website Um eine gespeicherte WebPlus-Website zu öffnen, können Sie den Startassistenten, die Standardsymbolleiste oder das Menü Datei verwenden. Öffnen einer bestehenden Website über den Startassistenten 1. Starten Sie WebPlus, um den Startassistenten zu aktivieren.
30 Einrichten von Websites und Seiten i) Für andere WebPlus-Websites klicken Sie in dem Feld „Computer durchsuchen“ auf WebPlus-Dateien. ii) Wählen Sie in dem Dialogfeld die gewünschte Datei aus und klicken Sie auf Öffnen. Öffnen einer bestehenden WebPlus-Website während einer WebPlus-Arbeitssitzung 1. Klicken Sie in der Standardsymbolleiste auf Öffnen. 2. Wechseln Sie in dem Dialogfeld Öffnen zu dem Ordner der Datei und klicken Sie auf den oder die Dateinamen.
Einrichten von Websites und Seiten 31 Arbeiten mit der WebsiteStruktur Bei der Struktur einer Website sind die physikalische Position der Seiten oder ihr Speicherplatz völlig unwichtig. Bei der Website-Struktur kommt es auf die logische Anordnung der verschiedenen Website-Inhalte an, sodass die Besucher der Website einfacher durch die für sie interessanten Themengebiete navigieren können.
32 Einrichten von Websites und Seiten sind somit untergeordnete Seiten; die Sektionsseiten sind in diesem Fall die übergeordneten Seiten. Anzeigen der Website-Struktur Die Website-Struktur lässt sich über zwei Optionen einblenden: die Registerkarte „Seiten“ und die WebsiteStrukturansicht. Die zweite Variante ist ideal für die Darstellung großer Websites.
Einrichten von Websites und Seiten 33 Prüfen der Struktur über die WebsiteStrukturansicht Für große Websites ist die Website-Strukturansicht eine gute Alternative zur Registerkarte „Seiten“ und bietet eine Vollbilddarstellung aller Sektionen und Strukturebenen Ihrer Website. Die Seiten werden hierbei als Miniaturen in einer Baumstruktur angezeigt. Anzeigen der Website-Struktur • Klicken Sie in der Standardsymbolleiste auf die Option Website-Strukturansicht.
34 Einrichten von Websites und Seiten Festlegen der WebsiteEigenschaften In den Website-Eigenschaften legen Sie die Optionen fest, die für die gesamte Website gelten sollen. Im Allgemeinen werden die wichtigsten Website-Eigenschaften (Seitenbreite, Seitenhöhe usw.) automatisch festgelegt, wenn Sie eine Vorlage auswählen oder eine Website von Grund auf neu entwerfen. Die anderen Einstellungen müssen Sie häufig nicht ändern. Dies ist jedoch jederzeit möglich.
Einrichten von Websites und Seiten 35 Kategorie, um in der rechten Fensterhälfte die entsprechenden Optionen einzublenden. Arbeiten mit Seiten und MasterSeiten Vom Designstandpunkt aus betrachtet besteht jede WebPlus-Seite aus einer Seite im „Vordergrund“ und einer Master-Seite im „Hintergrund“. Die Master-Seiten sind ein wichtiger Strukturbaustein Ihrer WebPlus-Website, da Sie auf diesen Seiten alle Objekte und Layoutelemente platzieren können, die auf mehr als einer Seite verwendet werden, wie z. B.
36 Einrichten von Websites und Seiten Zusätzlich zu diesen gemeinsam genutzten „Hintergrundelementen“ legen Sie dann für jede einzelne Seite die individuellen Layoutbausteine wie Texte, Bilder usw. fest. Die Registerkarte Seiten besteht aus einem oberen Feld für Master-Seiten und einem unteren Feld für die WebsiteStruktur Ihrer Standardseiten. Für jede in diesem Feld aufgelistete Seite wird ebenfalls die Master-Seite angezeigt, die Sie der Seite zugewiesen haben.
Einrichten von Websites und Seiten 37 Zuweisen anderer Master-Seiten Standardmäßig werden alle für eine Website neu angelegten Seiten mit einer Master-Seite erstellt (z. B. Master A). Wenn Sie für Ihre Website jedoch mehr als eine Master-Seite definiert haben, können Sie auch eine andere Master-Seite für die Seiten festlegen. Zuweisen anderer Master-Seiten zu Seiten 1.
38 Einrichten von Websites und Seiten Möchten Sie Ihre Seiten etwas komplexer aufbauen, können Sie auch mehrere Master-Seiten für eine Seite festlegen. Nähere Informationen hierzu finden Sie unter dem Abschnitt „Zuweisen mehrerer MasterSeiten“ in der WebPlus-Hilfe. Hinzufügen, Entfernen und Neuordnen von Seiten In der Registerkarte „Seiten“ stehen Ihnen die folgenden Optionen zur Verfügung. • Einfügen von Seiten • Löschen von Seiten. • Einfügen einer oder mehrerer MasterSeiten.
Einrichten von Websites und Seiten 39 In dem oberen Feld „Master-Seiten“ der Registerkarte arbeiten Sie mit den Master-Seiten. In dem unteren Feld „Seiten“ befindet sich der Strukturbaum der Website, mit dem Sie auf die normalen Seiten zugreifen können. Da WebPlus auch HTML-Seiten und Offsite-Links unterstützt, lassen sich diese Elemente genau so in dem Website-Strukturbaum platzieren wie normale Seiten.
40 Einrichten von Websites und Seiten Die neue Seite wird nun an der von Ihnen ausgewählten Position der Website-Struktur eingefügt. Alle neu erstellten Seiten verwenden stets die aktuell in den Website-Eigenschaften festgelegten Werte (Eigenschaften > Website-Eigenschaften), wie z. B. die Standardseitengröße und -ausrichtung, sofern Sie diese Optionen nicht mit dem Dialogfeld „Seiteneigenschaften“ außer Kraft setzen. Einfügen von Master-Seiten Hinzufügen einer neuen Master-Seite 1.
Einrichten von Websites und Seiten 41 Löschen von Seiten Löschen einer Seite oder Master-Seite 1. Wählen Sie in der Registerkarte „Seiten“ die zu löschende Seite oder Master-Seite mit einem Klick auf ihren Eintrag aus. 2. Klicken Sie über dem entsprechenden Fenster auf die Option Ausgewählte Seite löschen, um die Seite zu entfernen. Erstellen von HTML-Seiten HTML-Seiten lassen sich in die Website-Struktur jeder Website einfügen.
42 Einrichten von Websites und Seiten Verschieben einer Seite 1. Öffnen Sie die Registerkarte Seiten. 2. Wählen Sie mit einem einfachen Mausklick die gewünschte Seite im Strukturbaum der Website aus. 3. (Per Drag & Drop) Ziehen Sie den Seiteneintrag mit gedrückter Maustaste nach oben oder nach unten auf eine neue Position des Strukturbaums.
Einrichten von Websites und Seiten 43 Einfügen von Offsite-Links Sie können ebenfalls einen Offsite-Link zu Ihrer WebsiteStruktur hinzufügen. Für gewöhnlich handelt es sich hierbei um Links zu Seiten oder Ressourcen, die kein Teil Ihrer Website, in der Navigationsstruktur Ihrer Website jedoch durchaus hilfreich sind. Der Offsite-Link wird in der Website-Struktur und in den Navigationselementen angezeigt, sodass Sie ihn genauso bearbeiten können, wie eine Seite aus Ihrer Website.
44 Einrichten von Websites und Seiten WebPlus-Vorlage oder von Grund auf neu erstellen, können Sie entweder die Standardeinstellungen übernehmen oder die einzelnen Werte flexibel anpassen. Die Eigenschaften für Seiten (Master-Seiten) lassen sich wie folgt prüfen oder bearbeiten: • Klicken Sie auf die Schaltfläche Seiteneigenschaften in der Kontextleiste. ODER Klicken Sie mit der rechten Maustaste auf die aktive Seite und in ihrem Kontextmenü auf Seiteneigenschaften.
Einrichten von Websites und Seiten 45 Backup Ihres Projekts auf Ihrer Website 1. Speichern Sie Ihr Website-Projekt in WebPlus. 2. Klicken Sie im Menü Datei auf Website-Backup im Web. Wenn Sie ein Backup durchführen, ohne vorher Ihre FTP-Kontoeinstellungen für das Publizieren im Web festzulegen, wird automatisch ein Dialogfeld eingeblendet. Sie können nun schnell und einfach Kontodetails auswählen oder neu hinzufügen, wie unter dem Thema „QuickPublish“ in der WebPlus-Hilfe beschrieben.
46 5. Einrichten von Websites und Seiten Klicken Sie auf die Schaltfläche OK. In dem Dialogfeld für Dateivorgänge wird automatisch der Fortschritt der Backup-Speicherung angezeigt. Nach Ende des Backups werden Erfolg bzw. Fehlschlag zusätzlich mit einer Meldung quittiert. 6. Klicken Sie auf die Schaltfläche OK. Wiederherstellen Ihrer Website 1. Klicken Sie in der Standardsymbolleiste auf den Pfeil des Symbols Website publizieren und dann auf Website warten.
Einrichten von Websites und Seiten 47 4. Klicken Sie in dem rechten Fenster auf die WebPlusProjektdatei und dann auf das Symbol Download vom Server. 5. Klicken Sie auf das Fenstersymbol Schließen, um die FTP-Verbindung zu beenden und zu WebPlus zurückzukehren. Weitere Informationen zu den Wartungsmöglichkeiten Ihrer Website finden Sie unter dem Thema „Warten Ihrer Website“. Was bedeutet E-Commerce? Als „E-Commerce“ bezeichnet man den Kauf und Verkauf von Waren über das Internet.
48 Einrichten von Websites und Seiten festlegen, wie z. B. Größe und Menge sowie die gewünschten Schaltflächen, Währungen, Beschreibungsfelder usw. Die E-Commerce-Formulare können ebenfalls die Berechnung der Steuern, Versandgebühren und anderer Sonderzuschläge übernehmen. Über Links können Ihre Käufer schnell und einfach mit einem Klick Waren kaufen, für die keine zusätzlichen Optionen notwendig sind. Die Art und der Umfang der Funktionen variieren je nach Dienstanbieter.
Einrichten von Websites und Seiten 49 Einrichten des Warenkorb-Dienstanbieters 1. Klicken Sie in der Kategorie „E-Commerce“ der Registerkarte QuickBuild auf das Symbol E-Commerce und klicken Sie dann auf einen Punkt der Seite, um das Objekt zu platzieren. 2. In dem Dialogfeld E-Commerce konfigurieren stehen Ihnen nun zwei Optionen zur Verfügung. Welche Sie verwenden können, hängt davon ab, ob Sie bereits Kunde bei einem Dienstanbieter sind oder sich als Neukunde anmelden möchten: 3.
50 Einrichten von Websites und Seiten eine Bearbeitungsgebühr für den Warenkorb festlegen und mit der „Sandbox“ Ihren Warenkorb testen, bevor Sie ihn live ins Internet stellen. Klicken Sie auf die Schaltfläche Weiter>. Für den Sandbox-Test finden Sie auf der PayPalWebsite über die Suchfunktion oder unter den Händler-Tools alle Informationen, um eine SandboxAnmeldung zusätzlich zu Ihrer normalen PayPalAnmeldung zu erstellen. 4.
Einrichten von Websites und Seiten 5. 51 Nachdem Sie alle Einstellungen vorgenommen haben, klicken Sie auf Fertig stellen, um die Konfiguration des Warenkorbs abzuschließen. Haben Sie das Warenkorbsystem konfiguriert, müssen Sie ein E-Commerce-Objekt einfügen, wie z. B. ein auf Ihren Dienstanbieter zugeschnittenes Formular oder einen Link. Sie können diesen Schritt direkt nach dem Einrichten des Warenkorbs erledigen oder jederzeit über Einfügen > ECommerce-Objekt nachholen.
52 Einrichten von Websites und Seiten
Die Layoutelemente
54 Die Layoutelemente
Die Layoutelemente 55 Einfügen von Textrahmen Für gewöhnlich werden die Texte in WebPlus-Projekten in Textrahmen platziert, da sich diese „Container“ sowohl für einzelne Wörter und Absätze eignen als auch für ganze Zeitungsartikel. Neben den Rahmentexten können Sie auch künstlerische Texte (siehe Seite 210) für einzelne Überschriften und Spezialeffekte erstellen oder Tabellentexte für eine zeilen- oder spaltenweise Darstellung (siehe auch „Einfügen von Tabellen“ auf Seite 70).
56 2. Die Layoutelemente Ziehen Sie den Cursor mit gedrückter Maustaste über die Seite, um die Rahmenabmessungen selbst festzulegen. ODER Klicken Sie auf die Seite oder die Montagefläche, um einen Rahmen in Standardgröße zu erstellen. Einfügen von Text in einen Rahmen Texte lassen sich auf unterschiedliche Weise in Rahmen einsetzen. Der integrierte Storyeditor WritePlus Wählen Sie einen Rahmen aus und klicken Sie in der Rahmenkontextleiste auf WritePlus.
Die Layoutelemente Einfügen über die Zwischenablage 57 Platzieren Sie eine Einfügemarke in dem Text und drücken Sie die Tastenkombination Strg+V. Anpassen von Überlauftext Die genaue Aufteilung des gesamten Textes in Rahmen gehört zu den wichtigsten Punkten bei der Erstellung eines Webseitenlayouts. Enthält ein Rahmen zu viel Storytext, speichert WebPlus den „Überschuss“ in einem Überlaufbereich am unteren Ende des Rahmens.
58 Die Layoutelemente Um einen Rahmentext zu vergrößern oder zu verkleinern, nachdem Sie bereits die endgültige Größe und Position für den Rahmen festgelegt haben, stehen Ihnen in der Rahmenkontextleiste mehrere Optionen zur Verfügung. Mithilfe der CSS-Eigenschaften des Textrahmens können Sie sowohl eine Umrandung für den Textrahmen festlegen als auch die Randabstände für den Rahmen einstellen. Weitere Informationen hierzu finden Sie in der WebPlus-Hilfe.
Die Layoutelemente 59 Einfügen von Bildern in die Registerkarte „Quelldateien“ Einsetzen von Bildern in die Registerkarte 1. Klicken Sie in der Kategorie „Bilder“ der Registerkarte Quelldateien auf Hinzufügen. 2. Öffnen Sie in dem Dialogfeld einen Ordner mit Bildern und wählen Sie die gewünschten Bilder aus. 3. Klicken Sie auf die Schaltfläche Öffnen. Die Registerkarte Quelldateien zeigt Ihre Bilder nun als Miniaturen in der Kategorie „Bilder“ an.
60 Die Layoutelemente Einfügen einzelner Bilder in eine Seite • Ziehen Sie aus der Kategorie „Bilder“ der Registerkarte Quelldateien eine Bildminiatur direkt auf die Seite, in einen Rahmentext oder künstlerischen Text (das Bild wird dann an der Position der Einfügemarke platziert) oder in einen gefüllten Bildrahmen bzw. Platzhalter.
Die Layoutelemente 61 werden und nicht die ganze Zeit wertvollen Platz im Browserfenster belegen. Erstellen einer Lightbox für die Bilder auf Ihrer Webseite 1. Wählen Sie ein Bild aus (vorzugsweise platziert als Bildminiatur). 2. Erstellen Sie einen Hyperlink für das Bild. Klicken Sie hierzu im Menü Eigenschaften oder dem per Rechtsklick auf das Bild geöffneten Kontextmenü auf den Eintrag Hyperlink. 3.
62 Die Layoutelemente Anzeigen von Bildern mit der Bildlupe Mit der Bildlupe können Sie eine vergrößerte Ansicht des Bildbereichs anzeigen, auf dem sich der Mauszeiger gerade befindet. Hierzu legen Sie für das Bild eine Aktion namens „Lupe“ fest. Führen Sie einfach einen Doppelklick auf das Bild aus, öffnen Sie die Registerkarte „Aktionen“ und fügen Sie die Aktion „Lupe“ hinzu. Nähere Informationen hierzu finden Sie unter dem Thema „Die Bildlupe“ in der WebPlusHilfe.
Die Layoutelemente 63 Freistellen von Bildmotiven Mit dem Studio für Ausschnitte können Sie einzelne Bildobjekte bequem von ihrem Hintergrund trennen (dies wird auch als „Freistellen“ bezeichnet). Je nach Zusammenstellung Ihres Fotos lassen sich z. B. die wichtigen Objekte (Personen usw.) extrahieren oder die einfarbigen Hintergrundbereiche (z. B. Himmel, Leinwand eines Fotostudios) entfernen.
64 3. Die Layoutelemente Klicken Sie auf der linken Seite des Studiofensters auf das Werkzeug Bildbereich übernehmen oder Bildbereich entfernen und „übermalen“ Sie die Bereiche, die Sie entfernen bzw. behalten möchten. In der Hilfe des Studiofensters finden Sie eine genaue Anleitung zu der Arbeit mit diesen Werkzeugen. Bildkorrekturen und Effekte PhotoLab ist ein leistungsstarkes Studiofenster für die Bildbearbeitung, in dem Sie Ihre Bilder korrigieren und mit verschiedenen Effekten bearbeiten können.
Die Layoutelemente 65 Starten von PhotoLab 1. Wählen Sie das Bild aus, auf das Sie einen Filter anwenden möchten. 2. Klicken Sie auf die Schaltfläche Bildkontextleiste. 3. Wählen Sie einen Filter der Filterregisterkarten aus („Favoriten“, „Korrekturen“ oder „Effekte“). 4. Stellen Sie in dem Testfeld rechts unten die gewünschten Optionen für den Filter ein und klicken Sie auf Übernehmen. 5. Wiederholen Sie diese Schritte für alle Filter, die Sie anwenden möchten. 6.
66 Die Layoutelemente Einfügen von Panels Panels sind „Schaukästen“ mit Informationen, die über Ihren Webseiten eingeblendet werden. Hier können Sie sowohl Bilder und Texte anzeigen (siehe unten) als auch Formen und Zeichnungen. Da die Panels über Ihren Webseiten in dem Browser der Website-Besucher angezeigt werden, können Sie den Informationsgehalt Ihrer Website schnell und einfach erweitern oder ändern, ohne das Layout der einzelnen Seiten modifizieren zu müssen.
Die Layoutelemente 67 Einfügen eines Panels Um ein Panel einzufügen, gehen Sie wie folgt vor: 1. Klicken Sie in der Kategorie „Layoutelemente“ der Registerkarte QuickBuild auf das Symbol Panel. 2. Ziehen Sie den Mauszeiger mit gedrückter Maustaste über Ihre Seite, um die Form und Größe für das Panel zu bestimmen. Es wird nun das Dialogfeld Panel einfügen geöffnet. 3. 4. Gehen Sie in der Registerkarte Panel wie folgt vor: • Klicken Sie in das Vorschaufeld.
68 Die Layoutelemente Sie können ein Panel in den Standardabmessungen erstellen, indem Sie es einfach aus der Registerkarte „QuickBuild“ direkt auf eine Seite ziehen. Alternativ können Sie ein einfaches Panel (ohne Konfiguration über das Dialogfeld) direkt auf der Seite platzieren, wenn Sie es mit gedrückter Strg-Taste auf die Seite ziehen. Bearbeiten eines Panels • Führen Sie einen Doppelklick auf das Panel aus und stellen Sie die verschiedenen Optionen ein.
Die Layoutelemente 69 Ein-/Ausblenden von Panels 1. Wählen Sie das Panel aus. 2. Klicken Sie in der Kontextleiste auf die Option Aktionen. Es wird nun das Dialogfeld Panel bearbeiten mit geöffneter Registerkarte Aktionen eingeblendet. 3. Klicken Sie in dem Dialogfeld auf Hinzufügen und dann auf die Menüoption Sichtbarkeit. 4. Wählen Sie das Panel in dem Dropdownfeld Objekt-ID aus. 5. Wählen Sie ein Ereignis in dem Dropdownfeld Ereignis aus.
70 Die Layoutelemente Um während der Designarbeit unsichtbare Objekte einzublenden, klicken Sie im Menü Ansicht auf Unsichtbare Objekte. Wenn Sie nun Ihre Webseite publizieren und den Mauszeiger auf dem Panel platzieren, wird das Panel per Rollover eingeblendet. Mit dem Design Studio von WebPlus können Sie selbst einen Panelhintergrund entwerfen. Nähere Informationen hierzu finden Sie in der Hilfe zu WebPlus.
Die Layoutelemente 71 Rahmentexte flexibel mit Zeichen- und Absatzattributen sowie Textformatvorlagen formatieren und durch integrierte Bilder und gleichmäßige Farbfüllungen erweitern. Mithilfe der Rechtschreibprüfung können Sie anschließend eventuelle Fehler beseitigen. Zu den Spezialfunktionen für Tabellen gehören die Zahlenformatierung und das Einfügen von Formeln. Anstatt Ihre Tabellen von Grund auf neu zu erstellen, können Sie eines der vordefinierten Tabellenformate (d. h.
72 Die Layoutelemente 3. Klicken Sie auf die verschiedenen Einträge, um die jeweilige Formatierung in dem Vorschaufeld zu begutachten. Wenn Sie mit einer einfachen Tabelle ohne besondere Linienformatierungen und Farben beginnen möchten, klicken Sie auf den Eintrag (Standard). 4. (Optional) Klicken Sie auf Bearbeiten, wenn Sie das ausgewählte Format noch weiter konfigurieren möchten. 5. Legen Sie die Tabellengröße fest. Dies ist die Anzahl der Zeilen und Spalten, aus denen das Tabellenlayout besteht.
Die Navigationselemente
74 Die Navigationselemente
Die Navigationselemente 75 Einfügen von Navigationsleisten Mit den Navigationsleisten können Ihre Website-Besucher bequem zu den verschiedenen Seiten umschalten, wie z. B. Homepage, Galerie, Produkte und Kontakt. Die Navigationsleisten in WebPlus sind so programmiert, dass sie die Struktur Ihrer Website (siehe Seite 31) erkennen und automatisch berücksichtigen, sodass sich Website-Besucher später schnell zurechtfinden und problemlos durch die verschiedenen Seiten navigieren können.
76 Die Navigationselemente Wenn Sie eine Navigationsleiste einfügen, können Sie mit den folgenden Optionen festlegen, wie die Leiste auf der Seite angezeigt wird: • Typ: Hier legen Sie das grundlegende Design der Navigationsleiste fest (z. B. Designer, Grafisch, Einfach). • Navigationstyp: Hier legen Sie fest, ob die Navigationsleiste auf der Website-Struktur oder einer von Ihnen selbst festgelegten Struktur basieren soll.
Die Navigationselemente 77 Berührung mit der Maus) auslösen. Nähere Informationen hierzu finden Sie unter dem Thema „Anwenden von Aktionen“ auf Seite 88. Hinzufügen einer Navigationsleiste 1. Wählen Sie eine Seite (oder Master-Seite) aus. 2. Klicken Sie in der Kategorie „Navigationselemente“ der Registerkarte QuickBuild auf das Symbol Navigationsleiste. 3. Platzieren Sie den Mauszeiger auf der gewünschten Seitenposition und klicken Sie einmal, um die Leiste zu platzieren.
78 6. Die Navigationselemente Wählen Sie in der Registerkarte Navigationstyp aus, ob der Aufbau der Navigationsleiste direkt aus der Website-Struktur Ihrer Website abgeleitet werden soll. Klicken Sie hierzu auf Basierend auf Website-Struktur. ODER Aktivieren Sie die Option Benutzerdefiniert und ändern Sie die Optionen der Navileiste.
Die Navigationselemente 79 Tipps: • Einige Navigationsleisten folgen dem aktuell verwendeten Farbschema, sodass Sie ihre Darstellung noch weiter anpassen können. Bearbeiten einer Navigationsleiste 1. Führen Sie einen Doppelklick auf die Navigationsleiste aus. 2. Sie können nun die verschiedenen Optionen der Registerkarten neu einstellen (siehe oben). Sie können ebenfalls die Navigationsleisten, Schaltflächen, Trennelemente und Hintergründe Ihrer eigenen Navigationleistenformate ändern.
80 Die Navigationselemente festgelegt. Das Menü, das sich über dieses „selbstständige“ Objekt öffnen lässt, entspricht dann seinem Gegenstück aus der Navigationsleiste. Popup-Menüs lassen sich auf ähnliche Weise konfigurieren wie Navigationsleisten, sodass sie entweder Ihre Website-Struktur (oder einen Teil davon) wiedergeben oder eine von Ihnen selbst festgelegte Struktur. Popup-Menüs sind besonders hilfreich, wenn Sie eine begrenzte Anzahl zusätzlicher Navigationslinks anbieten möchten – z. B.
Die Navigationselemente 81 Seiten einer Seite „Produkte“ aus der obersten Strukturebene als Grundlage für Ihr Menü verwenden. 5. Klicken Sie in der Registerkarte Menüdarstellung des Dialogfeldes auf eine der Optionen Popup-Textmenü oder Popup-Grafikmenü. Die Einträge der Grafikmenüs bestehen nicht aus reinen Texten, sondern aus beschrifteten Schaltflächen. 6. Passen Sie das Design für Ihr Popup-Menü mit den Dropdownfeldern, Eingabefeldern, Kontrollkästchen und Auswahlsymbolen an.
82 Die Navigationselemente entwerfen. Um beide Ansätze zu verbinden, wählen Sie einfach eine Vorlage aus und passen dann die verschiedenen Optionen für die Schaltfläche (Farbe, Aufschrift usw.) an. Einfügen vordefinierter Schaltflächen 1. Klicken Sie in der Kategorie „Navigationselemente“ der Registerkarte QuickBuild auf das Symbol Schaltfläche. 2. Platzieren Sie den Mauszeiger auf der gewünschten Seitenposition und drücken Sie die linke Maustaste, um die Schaltfläche zu platzieren.
Die Navigationselemente 6. 7. 83 Gehen Sie in der Registerkarte „Hyperlink“ wie folgt vor: • Wählen Sie in der Registerkarte „Hyperlinktyp“ das Hyperlinkziel aus. Hiermit können Sie die WebsiteBesucher per Hyperlink (siehe Seite 85) auf ein bestimmtes Ziel verweisen (Internetseite, eine Datei, andere Seite Ihrer Website usw.). • Wählen Sie in der Registerkarte „Zielfenster“ ein Fenster oder einen Rahmen in dem Dropdownfeld „Typ“ aus.
84 Die Navigationselemente Bearbeiten einer Schaltfläche • Führen Sie einen Doppelklick auf die Schaltfläche aus und stellen Sie wie oben beschrieben die verschiedenen Optionen ein. Entwerfen eigener Schaltflächen Möchten Sie eine Schaltflächenvorlage noch weiter anpassen oder das Design komplett selbst entwerfen, verwenden Sie einfach das Button Studio – eine spezielle Designumgebung, die direkt in WebPlus integriert ist. Die Schaltfläche wird in diesem Studiofenster vollkommen isoliert angezeigt.
Die Navigationselemente 85 Einfügen von Hyperlinks und Aktionen Wenn Sie Objekte wie z. B. Wörter, Bilder usw. mit einem Hyperlink versehen, kann ein Besucher Ihrer Website mit einem Klick auf dieses Objekt ein frei definierbares Ereignis auslösen.
86 Die Navigationselemente Mausberührung eines Objekts geschieht. Der Unterschied zu den Hyperlinks liegt jedoch darin, dass ein Klick oder eine Mausberührung auf der aktuellen Seite ein Ereignis auslösen und den Website-Besucher nicht zu einem anderen Ziel leiten. Nähere Informationen hierzu finden Sie unter dem Thema „Anwenden von Aktionen“ auf Seite 88. Einfügen von Hyperlinks Hinzufügen eines Hyperlinks 1.
Die Navigationselemente 87 Bearbeiten und Entfernen von Hyperlinks 1. Markieren Sie mit dem Zeigerwerkzeug das gewünschte Objekt, oder platzieren Sie per Mausklick eine Einfügemarke in dem Linktext. (Sie müssen nicht den gesamten Hyperlinktext markieren.) 2. Klicken Sie in der Eigenschaftsleiste auf die Option Hyperlink. Das Dialogfeld „Objekteigenschaften“ wird nun geöffnet und zeigt das Hyperlinkziel des ausgewählten Objekts an.
88 Die Navigationselemente Anzeigen und Bearbeiten bestehender Hyperlinks • Klicken Sie im Menü Extras auf den Eintrag WebsiteManager > Hyperlink-Manager, um die Hyperlinks Ihrer Website aufzulisten, ihre Namen zu ändern oder sie zu löschen. Anwenden von Aktionen Aktionen lassen sich für Objekte (nicht für Texte) festlegen und bieten Ihren Website-Besuchern mehr Interaktionsmöglichkeiten.
Die Navigationselemente 89 dieses Objekt bei der Mausberührung immer vor allen anderen Objekten angezeigt wird (also nicht verdeckt ist). Auf diese Weise lässt sich z. B. ein Foto weiter unten in einem Bilderstapel mit der Mausberührung oben auf den Stapel legen. • Drucken: Drucken der aktuellen Seite über ein DruckenDialogfeld (bei Mausklick). • Slider: Hinzufügen einer Aktion (Wiedergabe, Pause usw.) zu einer Navigationsschaltfläche, um die Wiedergabe des Sliders zu steuern.
90 Die Navigationselemente Wenn Sie mit diesem Feature arbeiten möchten, müssen Sie ein Benutzerkonto bei der Pinterest-Website anlegen. • Benutzerdefiniert: Hiermit können Sie selbst ein JavaScript festlegen, das als Reaktion auf einen Mausklick, Tastendruck usw. gestartet werden soll. Die Registerkarte „Aktionen“ wird nur angezeigt, wenn Sie ein Objekt auswählen. Nach der Auswahl von Text ist diese Registerkarte nicht verfügbar.
Die Navigationselemente 91 Einfügen von Ankern Ein Anker ist eine bestimmte Position auf einer Webseite, die als Ziel für einen Hyperlink (siehe Seite 86) fungieren kann. Diese für die Website-Besucher unsichtbaren Anker markieren für gewöhnlich den Anfang von Absätzen, interessante Textstellen oder Bilder auf einer Webseite. Anhängen von Ankern an einen Textbereich 1.
92 Die Navigationselemente 3. (Optional) Aktivieren Sie die Option Anker in Navigation einschließen, damit der Anker über die Navigationsleiste angesteuert werden kann anstatt über einen Hyperlink. Sie müssen hierbei sicherstellen, dass in den Einstellungen Ihrer Navigationsleiste die Option Anker einschließen aktiviert und ein Titel für den Anker eingestellt sind. 4. Klicken Sie auf die Schaltfläche OK. Anhängen von Ankern an Objekte 1. Wählen Sie das Zielobjekt mit dem Zeigerwerkzeug aus. 2.
Die Navigationselemente 93 Anzeigen und Bearbeiten bestehender Anker • Klicken Sie im Menü Extras auf Website-Manager > Anker-Manager, um den Anker für ein bestimmtes Objekt zu prüfen, seinen Namen zu ändern oder den Anker zu löschen. Sie können Anker ebenfalls in die Seitennavigation einbeziehen. Arbeiten mit Lightboxen Lightboxen bieten elegante und moderne Präsentationsmöglichkeiten für verschiedene Webinhalte, die dann einfach über Ihren Seiten eingeblendet werden.
94 Die Navigationselemente Lightboxen lassen sich für die Anzeige folgender Inhalte konfigurieren: • Bilder (als größere Variante einer Bildminiatur, die Sie bereits auf einer Webseite platziert haben). • Formulare Ihrer Website. • Ein Anmeldungsfeld für die Zugangskontrolle. • Seiten (Ihrer Website oder aus dem Internet). • Blogs, Foren oder RSS-Feeds. • Word-Dateien, PDFs oder andere Dateitypen. Erstellen einer Lightbox für die Bilder auf Ihrer Webseite 1.
Die Navigationselemente 95 Um die Darstellungsgröße der verknüpften Lightbox-Bilder einzuschränken, skaliert WebPlus größere Bilder automatisch auf eine maximale Breite und Höhe (standardmäßig 800 x 600 Pixel). Das Seitenverhältnis der Bilder bleibt hierbei unverändert. Bilder, deren Abmessungen kleiner als die Standardwerte sind, werden nicht skaliert. Sie können die Maximalwerte für Breite und Höhe jederzeit anpassen.
96 Die Navigationselemente Erstellen einer Lightbox-Diashow 1. Erstellen Sie eine Lightbox für ein Bild auf Ihrer Webseite (siehe oben). 2. Klicken Sie in dem Dialogfeld Bild bearbeiten auf die Registerkarte „Hyperlink“ und dann auf die Registerkarte „Zielfenster“. 3. Geben Sie eine Bezeichnung für die Diashow in das Feld Name der Diashow ein. Dieser Name wird dann auch für andere Bilder verwendet, die Sie zu dieser Diashow hinzufügen. Klicken Sie auf die Schaltfläche OK. 4.
Die Navigationselemente 97 Anzeigen beliebiger Hyperlinkziele in Lightboxen Lightboxen lassen sich nicht nur für die Darstellung von Bildern einsetzen. Eine Lightbox ist im Grunde ein Fenster, in dem Sie jede Art von Hyperlinkziel (siehe Seite 86) einblenden können – von den Seiten Ihrer Website (z. B. ein Formular oder eine Anmeldungsseite) bis zu beliebigen Internetseiten, Blogs, Foren oder RSS-Feeds.
98 Die Navigationselemente
Interaktive Objekte
100 Interaktive Objekte
Interaktive Objekte 101 Einfügen von Slidern Slider bieten elegante und flexible Möglichkeiten für die Animation von Panels und lassen sich unter anderem für Werbebanner, News-Ticker und Alternativen zu Navigationsleisten einsetzen. Jeder Slider besteht aus einer Reihe von Panels – es kann jedoch immer nur ein Panel gleichzeitig angezeigt werden. Sie können auf jedem Panel eine Mischung aus Bildern, Texten, Linien und Formen platzieren.
102 Interaktive Objekte Für die Darstellung der Panels stehen Ihnen verschiedene Animationstypen zur Verfügung. Der Quelldatei-Browser bietet eine breite Auswahl an professionellen Slidern. Nach dem Platzieren auf der Seite können Sie jede dieser Slidervarianten über das Slider Studio flexibel anpassen. Auf diese Weise lassen sich Panels hinzufügen, neu ordnen und löschen, sodass der Slider am Ende genau Ihren Vorstellungen entspricht. Einfügen eines Sliders 1.
Interaktive Objekte 103 Auswählen eines Sliders • Klicken Sie auf einen beliebigen Punkt des Sliders und dann unter der Auswahl auf das Symbol Übergeordnetes Element auswählen. Manche Slider gehören zu einer Gruppe von Objekten. In diesem Fall können Sie den Slider über die Registerkarte Objekte auswählen. Bearbeiten von Slidern auf einer Seite Standardmäßig enthält jeder Slider ein Set von Platzhalterpanels.
104 Interaktive Objekte Bearbeiten von Slidern direkt auf einer Seite 1. Wählen Sie den Slider aus. 2. Über die Kontextleiste sind nun folgende Änderungen möglich: • Einfügen, Kopieren und Löschen von Panels • Festlegen von Namen für die Panels • Festlegen von Aktionen für die Panels Über die Panelnavigation lässt sich jedes einzelne Panel wie eine „Miniseite“ bearbeiten.
Interaktive Objekte 105 Bearbeiten eines Sliders im Slider Studio 1. Klicken Sie auf einen Punkt des Sliders und dann in der Kontextleiste auf die Schaltfläche Slider Studio. 2. In dem Slider Studio können Sie den Slider nun mit verschiedenen Registerkarten bearbeiten: • Slideroptionen: Hier ändern Sie die Optionen für die Wiedergabe (Animationstyp, Autoplay, Schleifenwiedergabe der Panels und die Animationszeit).
106 Interaktive Objekte Einfügen einer Fotogalerie In WebPlus können Sie eine auf Flash™ oder JavaScript basierende Fotogalerie in jede beliebige Webseite einfügen. Für die Galerien sind unterschiedliche Designs mit verschiedenen Navigationsmethoden für die enthaltenen Bilder verfügbar. Die Galerietypen Für Ihre Flash- oder JavaScript-Fotogalerien stehen Ihnen sehr unterschiedliche Galerieformate zur Verfügung.
Interaktive Objekte 107 Professionelle Flash-Fotogalerie (Live Feed) Diese Galerien bieten die gleichen Optionen wie Professionelle Flash-Fotogalerien. Die Fotos lassen sich jedoch als Fotostream (in Form eines RSS-Feeds) aus Ihrem Konto bei Flickr einfügen sowie aus jedem anderen Bildhosting-Service, der RSS 2.0 unterstützt, oder auch aus SlideShowPro Director.
108 Interaktive Objekte Einfügen einer Fotogalerie Fotogalerien lassen sich genau so auf Ihren Seiten einfügen, wie einzelne Fotos. Das aktuell angezeigte Foto ist hierbei lediglich von einem Hintergrund, einer Navigationsleiste und Vorschauminiaturen eingerahmt. Einfügen einer Fotogalerie 1. Klicken Sie in der Kategorie „Interaktive Objekte“ der Registerkarte QuickBuild auf das Symbol Fotogalerie. 2.
Interaktive Objekte 109 Einfügen von Fotos in eine Fotogalerie 1. Für alle Galerietypen (außer den Varianten mit Live Feed) legen Sie in dem Dialogfeld folgende Optionen fest: • Hinzufügen einzelner Dateien Klicken Sie auf Dateien hinzufügen, um die gewünschten Bilddateien auszuwählen. Wenn Sie mehrere Dateien auswählen möchten, halten Sie die Strg-Taste gedrückt (für nicht aufeinander folgende Dateien) oder die Umschalttaste (für aufeinander folgende Dateien), während Sie auf die Dateinamen klicken.
110 Interaktive Objekte • 3. (Nur für professionelle Flash-Fotogalerien) Um die Fotos mit Hyperlinks zu versehen, klicken Sie auf Hyperlink bearbeiten. Wählen Sie in dem Dialogfeld einen Hyperlinktyp aus. Sie können hier die Verwendung von Hyperlinks deaktivieren, Hyperlinks zu den Originalbildern erstellen oder Hyperlinks zu anderen Hyperlinkzielen festlegen (z. B. Seiten Ihrer Website oder einer anderen Website). Klicken Sie auf die Schaltfläche Weiter.
Interaktive Objekte 111 Bearbeiten der Fotogalerie Nachdem Sie die Fotogalerie in eine Webseite eingefügt haben, lässt sie sich jederzeit bearbeiten. Bearbeiten einer Fotogalerie 1. Wählen Sie die gewünschte Galerie auf der Webseite aus. 2. Führen Sie einen Doppelklick auf die Galerie aus. Es wird nun das Dialogfeld Fotogalerie angezeigt. Die Optionen in diesem Dialogfeld sind identisch mit denen, die für die Erstellung der Galerie verfügbar waren.
112 Interaktive Objekte Einfügen von Google Maps Google Maps sind ideal, wenn Sie Ihren Website-Besuchern eine genaue Karte zu Ihrem Unternehmen oder den Anfahrtsweg zu einem besonderen Event zur Verfügung stellen möchten. Diese Karten eignen sich ebenfalls hervorragend, um Sehenswürdigkeiten zu markieren. Auf jeder Karte können Sie Marker platzieren, um bestimmte Orte zu kennzeichnen.
Interaktive Objekte 113 Einfügen einer Google Map 1. Klicken Sie in der Kategorie „Interaktive Objekte“ der Registerkarte QuickBuild auf das Symbol Google Map und ziehen Sie den Mauszeiger mit gedrückter Maustaste über Ihre Seite, um die Größe der Karte zu bestimmen. 2. Tragen Sie in dem Dialogfeld „Google Map“ Ihre Postleitzahl oder Adresse in das Feld Folgenden Ort suchen ein und klicken Sie anschließend auf Suchen.
114 Interaktive Objekte 3. Geben Sie einen Namen für den Marker ein. Dieser Name wird als QuickInfo angezeigt, wenn ein WebsiteBesucher den Mauszeiger auf dem Marker platziert. Hier könnten Sie z. B. den Namen einer Firma eintippen. 4. Legen Sie eine Klickaktion für den Marker fest. Diese bestimmt, welche Informationen bei einem Mausklick angezeigt werden. 5.
Interaktive Objekte 115 Die Rolloveroptionen Wenn Sie einen Rollovereffekt einrichten, legen Sie zunächst den Rolloverzustand oder die Zustände für ein Objekt fest und weisen dann jedem Zustand ein bestimmtes Bild zu. WebPlus bietet Ihnen für die Rolloverzustände vier Grundoptionen: Normal Dies ist der „Ruhezustand“ der Grafik vor Beginn des Rollovereffekts. Diesen Zustand müssen Sie für alle Objekte festlegen. Mouseover Dieser Zustand wird ausgelöst, wenn sich der Mauszeiger auf dem Objekt befindet.
116 Interaktive Objekte Der hier nicht dargestellte Zustand Klick+Mouseover wird für ein Mouseover-Ereignis verwendet, das nach dem Klick auf das Objekt eintritt. Für jeden Rollovereffekt können Sie ebenfalls ein Hyperlink-Ereignis festlegen, wie z. B. den Wechsel zu einer anderen Webseite. Dieses Ereignis wird automatisch ausgelöst, wenn ein Webseitenbesucher auf das Rolloverobjekt klickt und dann die Maustaste loslässt.
Interaktive Objekte 117 Schaltfläche Durchsuchen oder QuelldateiBrowser um die entsprechende Bilddatei von einem Datenträger oder aus Ihren gespeicherten Quelldatei-Paketen auszuwählen. • (Optional) Legen Sie für die Bilder die Exportoptionen fest (siehe „Einstellen der Bildexportoptionen“ in der WebPlus-Hilfe). • Wenn Sie die Bilder in Ihre Website integrieren möchten, aktivieren Sie die Option Dateien in Website einbetten.
118 Interaktive Objekte Führen Sie einen Doppelklick auf die Rollovergrafik aus, um das Dialogfeld „Rollover bearbeiten“ zu öffnen. Stellen Sie die gewünschten Werte ein. Einfügen von Rollover-Popups In WebPlus werden Rollover-Popups hauptsächlich für Bilder verwendet. Wenn ein Website-Besucher den Mauszeiger auf eine Bildminiaturansicht bewegt, wird automatisch eine vergrößerte Darstellung des entsprechenden Fotos eingeblendet (für gewöhnlich ein wenig gegen die Miniatur versetzt).
Interaktive Objekte 119 Einfügen von Rollover-Popups 1. Klicken Sie in der Kategorie „Interaktive Objekte“ der Registerkarte QuickBuild auf das Symbol Rollover-Popup und ziehen Sie den Mauszeiger mit gedrückter Maustaste über Ihre Seite, um die Größe des Rolloverobjekts zu bestimmen. 2.
120 Interaktive Objekte • (Optional) Legen Sie für eines oder beide Bilder die Exportoptionen fest (siehe „Einstellen der Bildexportoptionen“ in der WebPlus-Hilfe). • (Optional) Wenn Sie die Bilder in Ihre Website integrieren möchten, aktivieren Sie die Option Bilddateien in Website einbetten. 3. (Optional) Legen Sie in der Registerkarte Hyperlinks ein Hyperlinkziel für den Rollover fest. 4. Klicken Sie auf die Schaltfläche OK.
Smart-Objekte
122 Smart-Objekte
Smart-Objekte 123 Anmeldungsformulare Mit WebPlus lässt sich schnell und einfach ein Feld auf einer Webseite platzieren, mit dem sich die Besucher an- und abmelden können. Auf diese Weise können registrierte Website-Besucher per Anmeldung bei der Website auf eingeschränkte Seiten zugreifen. Das Anmeldungsfeld gehört zu dem Mitglieder-Manager Ihrer Website in den Serif Webressourcen. Registrierte Benutzer lassen sich über www.serifwebresources.
124 Smart-Objekte Besitzen Sie bereits ein Konto und sind angemeldet, wird das Dialogfeld für Website-Mitglieder-Manager geöffnet. 4. Wählen Sie in dem Dialogfeld für Mitglieder-Manager den Mitglieder-Manager Ihrer Website aus. Falls Sie noch keinen dieser Manager angelegt haben, klicken Sie auf Neu erstellen. Nähere Informationen hierzu finden Sie unter dem Thema „Der Mitglieder-Manager Ihrer Website“ auf Seite 150. 5. In dem Dialogfeld „Bearbeiten“ sind nun verschiedene Optionen verfügbar: 6.
Smart-Objekte 125 Einfügen eines Blogs Ein Blog (Kurzform von „Weblog“) übernimmt die Funktion eines Tagebuchs/Nachrichtenblattes auf Ihrer Website, in dem Sie mit einem unkomplizierten Texteditor Ihre eigenen Artikel veröffentlichen. Bei den Blogs ist es üblich, dass die Besucher der Website die verschiedenen Artikel kommentieren können.
126 Smart-Objekte Einfügen von Blogs Blogs lassen sich genau wie alle anderen Objekte in WebPlus behandeln, sodass Sie das gewünschte Objekt einfach an der passenden Stelle Ihrer Webseite absetzen können. Einfügen eines Blogs auf einer Seite 1. Klicken Sie in der Kategorie „Smart-Objekte“ der Registerkarte QuickBuild auf das Symbol Blog. 2. mit gedrückter Ziehen Sie den Mauszeiger Maustaste über Ihre Seite, um den Bereich und die Größe für den Blog zu bestimmen. 3.
Smart-Objekte 127 5. Geben Sie in das Dialogfeld „Konfigurieren“ einen Namen für Ihren Blog ein. Dieser Blogtitel wird auch am Anfang des im Web publizierten Blogs angezeigt. 6. Klicken Sie auf die Schaltfläche Speichern. Der nun angezeigte hellblaue Bereich kennzeichnet den Blog. Nach dem Einfügen in die Seite können Sie den Blog beliebig über sein per Rechtsklick geöffnetes Kontextmenü oder auch die Kontextleiste bearbeiten, konfigurieren und verwalten.
128 Smart-Objekte wählen die Tags und den Poster des Artikels aus, aktivieren die Rückverfolgung oder geben einen Kommentar ein. Verwalten Ihres Blogs • Wählen Sie den Blog aus und klicken Sie in der Kontextleiste auf Verwalten. Nähere Informationen sowie eine Beschreibung der einzelnen Optionen finden Sie in der Hilfe zu den Webressourcen. Klicken Sie einfach in dem SmartObjekt-Dialogfeld des Blogs auf „Hilfe“. Weitere Informationen zu den Smart-Objekten finden Sie in der WebPlus-Hilfe.
Smart-Objekte 129 Möchte sich einer Ihrer Website-Besucher an einer Forumsdiskussion beteiligen, gibt er einfach selbst die Anmeldungsdaten zu seiner Person ein und kann anschließend Beiträge in das Forum schreiben. Die Forum-Features • Anlegen mehrerer untergeordneter Foren (Plato, Aristoteles, Descartes usw.) in Kategorien (z. B. Philosophen). • Festlegen einer Zugangskontrolle für Benutzer und Moderatoren.
130 Smart-Objekte Einfügen eines Forums Foren lassen sich genau wie andere Objekte auf Seiten einfügen. Sie können jedoch das Forum auch über einen Offsite-Link als Fenster in voller Größe präsentieren. Wenn Sie ein Forum erstellen, müssen Sie es mit einem Mitglieder-Manager Ihrer Website verbinden. Der Manager gilt für diese bestimmte Website. Er fungiert als „Sammelbecken“ für die Speicherung der Smart-Objekte, wie z. B.
Smart-Objekte 131 Besitzen Sie bereits ein Konto und sind angemeldet, wird das Dialogfeld für Website-Mitglieder-Manager geöffnet. 4. Wählen Sie in dem Dialogfeld für Mitglieder-Manager den Mitglieder-Manager Ihrer Website aus. Falls Sie noch keinen dieser Manager angelegt haben, klicken Sie auf Neu erstellen. Nähere Informationen hierzu finden Sie unter dem Thema „Der Mitglieder-Manager Ihrer Website“ auf Seite 150. 5. Geben Sie in das Dialogfeld „Konfigurieren“ einen Namen für Ihr Forum ein.
132 Smart-Objekte Weitere Informationen zu den Kontooptionen der Serif Webressourcen finden Sie unter dem Thema „Arbeiten mit Smart-Objekten“ (siehe Seite 139). Verwalten Ihres Forums Bis jetzt haben Sie nur ein Standardforum angelegt – ein Unterforum innerhalb einer einzigen Kategorie. Möchten Sie den Namen einer Kategorie bzw. eines Unterforums ändern oder neue Kategorien oder Unterforen in diesen Kategorien hinzufügen, müssen Sie den WebsiteMitglieder-Manager in den Serif Webressourcen verwenden.
Smart-Objekte 133 Einfügen einer Website-Suche WebPlus bietet eine Reihe leistungsstarker Suchoptionen für Ihre Website. Was Sie suchen und in welchen Teilen der Website bestimmt hierbei auch, welche Möglichkeiten Ihnen zur Verfügung stehen. Grundsätzlich gibt es zwei Suchvarianten: • Die Onlinesuche: Bei dieser Suche werden die von einem Besucher eingegebenen Begriffe mit den Wörtern Ihrer Textrahmen, Tabellen und bestimmter SmartObjekte (z. B. Blogs, Foren, CMS-Inhalte usw.) abgeglichen.
134 Smart-Objekte Beide Varianten der Suchfunktion bestehen aus zwei Teilen: einem Formular für die Website-Suche und einem Rahmen für die Website-Suchergebnisse. Ergebnisse der Website-Suche: Hiermit erstellen Sie einen Rahmen, in dem die Suchergebnisse angezeigt werden. Dieser Rahmen wird für gewöhnlich auf einer separaten Seite platziert und ist nicht Teil der Navigationsstruktur Ihrer Website. Für gewöhnlich wird der Rahmen für die Suchergebnisse vor dem Formular für die Website-Suche platziert.
Smart-Objekte 135 Einrichten der Onlinesuche Die Onlinesuche nutzt die Serif Webressourcen, damit Website-Besucher auch die Seitentexte von Server-seitigen Blogs, Foren und CMS-Inhalten durchsuchen können. Für diese Suche müssen Sie daher einen Mitglieder-Manager für Ihre Website einrichten. Eventuell haben Sie diesen Manager bereits erstellt, als Sie andere Smart-Objekte eingefügt haben.
136 2. Smart-Objekte Legen Sie mit den Optionen des Dialogfelds die Darstellung der Texte und Hyperlinktexte fest. Es empfiehlt sich außerdem, die Suchergebnisse auf einer separaten Seite einzublenden. Für diese Seite können Sie dann z. B. auch ein anderes Design festlegen als für den Rest der Website. Um die Darstellung auf der Seite zu ändern, führen Sie einfach einen Doppelklick auf das Objekt für die Suchergebnisse aus. Einfügen eines Formularobjekts für die WebsiteSuche 1.
Smart-Objekte 137 4. Wählen Sie den zuvor erstellten Rahmen für die Suchergebnisse in dem Dropdownfeld Objekt für Suchergebnisse aus. 5. Um die Eigenschaften für die Smart-Suche über die Serif Webressourcen festzulegen, klicken Sie auf Mitglieder-Manager für Website auswählen. Wählen Sie in dem Dialogfeld den Manager für Ihre Website aus oder klicken Sie auf Neu erstellen, um einen neuen Manager für Ihre Website anzulegen. 6.
138 Smart-Objekte Hinzufügen von Tags für die Smart-Suche zu Seiten Mit der Onlinesuche können Sie die Suche gezielt auf Seiten beschränken, denen Sie zuvor einen Smart-Tag zugewiesen haben. Wenn Sie Ihr Formular für die Website-Suche konfigurieren, wählen Sie einfach die Tagnamen aus, um die Suche auf die entsprechenden Seiten einzugrenzen. Einfügen eines Smart-Tags 1. Klicken Sie mit der rechten Maustaste auf eine Seite und in ihrem Kontextmenü auf Seiteneigenschaften. 2.
Smart-Objekte 139 Starten der Indexerstellung • Wechseln Sie zu der Seite Ihrer Website, auf der Sie das Suchformular platziert haben, und führen Sie eine Suche nach allen Suchbegriffen in Ihrer Website aus. Über den Mitglieder-Manager Ihrer Website können Sie auf www.serifwebresources.com jederzeit den Indexstatus Ihrer Website prüfen. Öffnen Sie hierzu die Registerkarte Erweitert und dann die Registerkarte Website-Suche.
140 Smart-Objekte Werfen wir nun einen genaueren Blick auf die einzelnen Smart-Objekte der Webressourcen und ihre verschiedenen Anwendungsmöglichkeiten. Name Verwendungszweck Buchungsassistent für Unterkünfte Diese Ressource ist perfekt für Onlinebuchungen in Gasthäusern, Pensionen und Ferienanlagen und bietet verschiedene Preisoptionen für unterschiedliche Zeiträume und Wochentage.
Smart-Objekte 141 Artikel bewerten und kommentieren. Für das CMS lassen sich separate Farben festlegen. Forum News Abstimmung Buchungsassistent Shoutbox Mit diesem Objekt erstellen Sie ein Forum für Diskussionsbeiträge, das sich in verschiedene Kategorien und Unterkategorien einteilen lässt. Mit diesem Objekt platzieren Sie ein News-Fenster auf Ihrer Seite. Mit dieser Ressource können Sie online eine Umfrage durchführen, um die Meinung der WebsiteBesucher zu einem bestimmten Thema einzuholen.
142 Smart-Objekte Da die Smart-Objekte in den Serif Webressourcen gespeichert werden, können Sie bei dem Erstellen und der Verwaltung der Objekte einfach auf die HilfeSchaltfläche klicken, wenn Sie zusätzliche Informationen zu einem Objekt benötigen. Aus Sicherheitsgründen sind diese Objekte nur über eine Anmeldung bei den Serif Webressourcen verfügbar, die Sie aus WebPlus aktivieren können.
Smart-Objekte 143 Webressourcen anmelden, indem Sie auf Einfügen > Smart-Objekt klicken. Löschen der Kontodetails • Klicken Sie auf den Menüpunkt Extras > Optionen und dann in der Kategorie Optionen > Allgemein auf die Schaltfläche Kontodetails löschen. Alle gespeicherten Details zu der Anmeldung bei den Serif Webressourcen werden nun gelöscht, sodass Ihre automatische Anmeldung nicht mehr funktioniert. Bei der nächsten Anmeldung müssen Sie dann einige Details eingeben.
144 Smart-Objekte Anlegen eines Mitglieder-Managers für Ihre Website Als neuer Benutzer müssen Sie zunächst einen WebsiteMitglieder-Manager für Ihre Website anlegen, damit Sie später auch mit Smart-Objekten arbeiten können. Der Manager ist eine zentrale Anlaufstelle für Design, Bearbeitung und Verwaltung der Smart-Objekte, die Sie in Ihrer Website verwenden möchten.
Smart-Objekte 145 dieser Smart-Objekte müssen Sie jedoch in dem MitgliederManager für Ihre Website erstellen. Wenn Sie nun mit der Arbeit fortfahren, sollten Sie stets im Hinterkopf behalten, dass sich ein Smart-Objekt mehrmals in Ihre Website einfügen lässt. Sie können dann für jede dieser Varianten die Darstellung genau anpassen. Nähere Informationen hierzu finden Sie unter dem Thema „Bearbeiten von Smart-Objekten“ auf Seite 147. Einige Smart-Objekte, wie z. B.
146 Smart-Objekte Konfigurieren von Smart-Objekten Sie müssen für ein neu erstelltes Smart-Objekt einen Namen und eine Beschreibung eingeben und in manchen Fällen auch festlegen, wie das Smart-Objekt in Ihrer Website funktionieren soll. Konfigurieren eines Smart-Objekts 1. 2. Gehen Sie in dem Dialogfeld Konfigurieren wie folgt vor: • Geben Sie einen Namen für das Objekt ein.
Smart-Objekte 147 Bearbeiten von Smart-Objekten Indem Sie ein Smart-Objekt bearbeiten, können Sie seine Darstellung genau an das Design Ihrer Website anpassen. Die Standardeinstellungen des Objekts lassen sich flexibel ändern. Welche Einstellungen für die Objekte verfügbar sind, variiert je nach Objekttyp. Nachdem Sie ein Objekt erstellt haben, können Sie es entweder in dem Mitglieder-Manager Ihrer Website oder direkt auf der Seite bearbeiten.
148 Smart-Objekte Einfügen von Smart-Objekten in Seiten Einfügen von Smart-Objekten in Ihre Webseite 1. Klicken Sie in dem Bearbeiten-Dialogfeld auf die Schaltfläche Einfügen. 2. Um das Objekt mit einer Standardgröße einzufügen, platzieren Sie den Mauszeiger an der gewünschten Stelle der Seite und drücken die linke Maustaste. ODER Ziehen Sie den Mauszeiger mit gedrückter Maustaste über die Seite, um die Abmessungen des Smart-Objekts selbst festzulegen.
Smart-Objekte 149 bestimmte Daten der Website-Besucher, wie Kommentare zu Artikeln, E-Mail-Adressen, Abstimmungsergebnisse und ein Nachrichten-Logbuch für Chats. Für einen Blog ist es zum Beispiel absolut wichtig, dass Sie neue Artikel verfassen und die bestehenden Artikel verwalten. Verwalten von Smart-Objekten über den MitgliederManager Ihrer Website 1. Führen Sie in dem Mitglieder-Manager Ihrer Website einen Doppelklick auf das Smart-Objekt aus. 2.
150 Smart-Objekte Der Mitglieder-Manager Ihrer Website Der Mitglieder-Manager für Websites von den Serif Webressourcen übernimmt zwei wichtige Aufgaben: • Hier können Sie die Sicherheitseinstellungen für Ihre Website festlegen – z. B. den Zugang zu bestimmten Seiten sperren oder bestimmen, welche WebsiteBesucher Zugang zu Foren haben. Darüber hinaus bearbeiten Sie hier auch Blog-Artikel oder erstellen CMS-Inhalte.
Smart-Objekte 151 Einrichten des Mitglieder-Managers für Ihre Website Mit dem Mitglieder-Manager verwalten Sie ebenfalls Blogs, Foren und andere Smart-Objekte Ihrer Website. Erstellen eines Mitglieder-Managers für Ihre Website 1. Klicken Sie im Menü Einfügen auf Smart-Objekt. 2. Melden Sie sich bei den Serif Webressourcen an. Falls Sie noch keine gültigen Zugangsdaten für die Webressourcen besitzen, müssen Sie sich zunächst registrieren lassen. 3.
152 7. Smart-Objekte Per Doppelklick auf den Eintrag können Sie verschiedene Optionen für die Zugangskontrolle Ihrer Website festlegen. Die Optionen für die Zugangskontrolle Der Mitglieder-Manager Ihrer Website bietet verschiedene Objekte für die Zugangskontrolle, die Sie bequem auf Ihren Seiten platzieren können. Anmeldungsformular für Mitglieder: Mit dieser Option fügen Sie ein Anmeldungsformular direkt in Ihre Seite ein.
Smart-Objekte 153 Dieses Anmeldungsformular lässt sich auch über die Registerkarte „QuickBuild“ einfügen. Nähere Informationen hierzu finden Sie unter dem Thema „Die Anmeldungsformulare“ auf Seite 123. Anmeldung mit Mailinglisten: Mit diesen Objekten können Website-Besucher Newsletter abonnieren, Einladungen bestätigen, Informationsmaterial anfordern usw. Die Listen lassen sich manuell kontrollieren oder mit einer Selbstanmeldung.
154 Smart-Objekte Festlegen einer Zugangskontrolle für Benutzer 1. Erstellen Sie einen Mitglieder-Manager für Ihre Website. Nähere Informationen hierzu finden Sie unter dem Thema „Der Mitglieder-Manager Ihrer Website“ auf Seite 150. 2. Melden Sie sich bei der Website www.serifwebresources.com an. 3. Geben Sie in die Registerkarte Gruppen einen Gruppennamen ein und klicken Sie auf Gruppe erstellen. 4.
Smart-Objekte 155 2. Aktivieren Sie die Option Seite mit Kennwort schützen, um die Zugangskontrolle einzuschalten. Es wird nun die Schaltfläche Ändern/Verwalten verfügbar geschaltet. Klicken Sie auf diese Schaltfläche, um die aktuell verfügbaren Gruppen (fett markiert) aufzulisten sowie den Mitglieder-Manager Ihrer Website, zu dem die Gruppen gehören. 3. Wählen Sie in dem Dialogfeld für die Benutzergruppen die gewünschte Gruppe aus (z. B. Mitglieder) und klicken Sie auf OK.
156 Smart-Objekte Anlegen einer Mailingliste 1. Klicken Sie auf den Menüpunkt Einfügen > SmartObjekt. 2. Wählen Sie in dem Dialogfeld für Mitglieder-Manager den Mitglieder-Manager Ihrer Website aus. Falls Sie noch keinen dieser Manager angelegt haben, klicken Sie auf Neu erstellen. Nähere Informationen hierzu finden Sie unter dem Thema „Der Mitglieder-Manager Ihrer Website“ auf Seite 150. 3. Wählen Sie in dem Dialogfeld „Smart-Objekt einfügen“ die Option Anmeldung für Mailingliste aus. 4.
Soziale Netzwerke
158 Soziale Netzwerke
Soziale Netzwerke 159 Einfügen von Facebook-Objekten Mit Facebook-Objekten können Sie verschiedene Live-Feeds per Streaming auf Ihren Webseiten anzeigen oder auch eine „Gefällt mir“-Schaltfläche platzieren, über die WebsiteBesucher Ihre Seiten mit Freunden teilen oder auf ihren eigenen Facebook-Seiten für Sie „die Werbetrommel rühren“ können. Wir möchten Ihnen empfehlen, selbst ein FacebookKonto anzulegen, wenn Sie mit diesen Objekten arbeiten möchten.
160 Soziale Netzwerke 3. Aktivieren oder deaktivieren Sie in dem Vorschaufeld die Option Aktualisieren. Hiermit können Sie per Vorschau prüfen, wie sich die Darstellung des Objekts auf der Seite ändert, wenn Sie verschiedene Einstellungen vornehmen. 4. Konfigurieren Sie die Funktionalität des Objekts: • Aktuelle Website-URL nutzen Aktivieren Sie diese Option, um die aktuelle URL Ihrer Website zu verwenden.
Soziale Netzwerke 161 Bearbeiten von Facebook-Objekten Nachdem Sie es auf einer Seite platziert haben, können Sie das Facebook-Objekt jederzeit bearbeiten. Bearbeiten eines Facebook-Objekts 1. Führen Sie einen Doppelklick auf das Objekt aus. Es wird nun das Dialogfeld für die Bearbeitung angezeigt. Die Optionen in diesem Dialogfeld sind identisch mit denen, die für die Erstellung des Objekts verfügbar waren. 2. Nehmen Sie die gewünschten Änderungen vor und klicken Sie auf OK.
162 Soziale Netzwerke Die verschiedenen Twitter-Objekte Die Twitter-Objekte, die Sie auf Ihren Seiten platzieren können, unterscheiden sich stark in ihrer Funktionalität und den Möglichkeiten, die sie Ihren Website-Besuchern bieten. Objekttyp Features TweetSchaltfläche Hiermit können Website-Besucher einen Tweet zu Ihrer Website auf dem eigenen Twitter-Profil posten. FolgenSchaltfläche Hiermit können Website-Besucher Ihrem Benutzerkonto bei Twitter folgen.
Soziale Netzwerke 3. 163 Konfigurieren Sie die Funktionalität der Schaltfläche: • Aktuelle Website-URL nutzen Aktivieren Sie diese Option, um die aktuelle URL Ihrer Website zu verwenden. Wenn Sie die Option deaktivieren, können Sie in dem Feld URL für Tweet selbst eine Webadresse eingeben. • Tweet-Text Hier geben Sie den Tweet-Text ein. Dieser Text wird in dem Tweet-Feld angezeigt und lässt sich vor Übermittlung des Tweets noch bearbeiten.
164 Soziale Netzwerke 4. (Optional) Konfigurieren Sie die Darstellung des Objekts mit den übrigen Optionen (diese variieren je nach ausgewähltem Typ). 5. Klicken Sie auf die Schaltfläche OK. Einfügen einer Folgen-Schaltfläche 1. Klicken Sie in der Kategorie „Soziale Netzwerke“ der Registerkarte QuickBuild auf das Symbol TwitterObjekt und klicken Sie dann auf einen Punkt der Seite, um das Objekt zu platzieren. 2.
Soziale Netzwerke 165 Bearbeiten von Twitter-Objekten Nachdem Sie es auf einer Seite platziert haben, können Sie das Twitter-Objekt jederzeit bearbeiten. Bearbeiten eines Twitter-Objekts 1. Wählen Sie das auf einer Seite platzierte Objekt aus. 2. Führen Sie einen Doppelklick auf das Objekt aus. Es wird nun das Dialogfeld für die Bearbeitung angezeigt. Die Optionen in diesem Dialogfeld sind identisch mit denen, die für die Erstellung des Objekts verfügbar waren. 3.
166 Soziale Netzwerke Websurfern teilen oder auch in der +1-Registerkarte ihres Profils bei Google+ aufführen. Die +1-Registerkarte zeigt alle von einem Besucher empfohlenen Links an. Die „Google +1“-Schaltfläche kann ebenfalls anzeigen, wie viele Personen Ihre Webseite bereits empfohlen haben. Wir möchten Ihnen empfehlen, selbst ein Konto bei Google+ anzulegen, wenn Sie mit diesen Schaltflächen arbeiten möchten. Nähere Informationen zu Google+ finden Sie unter plus.google.com.
Soziale Netzwerke 167 4. (Optional) Wählen Sie in dem Feld Größe die Abmessungen für das Objekt aus. 5. (Optional) Wählen Sie in dem Feld Anmerkung eine Formatierung für die Anmerkung aus. 6. Klicken Sie auf die Schaltfläche OK. Bearbeiten einer „Google +1“-Schaltfläche 1. Wählen Sie die auf einer Seite platzierte Schaltfläche aus. 2. Führen Sie einen Doppelklick auf die Schaltfläche aus. Es wird nun das Dialogfeld für die Bearbeitung angezeigt.
168 Soziale Netzwerke Einfügen eines LesezeichenSymbolstreifens für soziale Netzwerke Wenn Sie einen Lesezeichen-Symbolstreifen für soziale Netzwerke auf einer Seite platzieren, können die WebsiteBesucher Ihre Website mit anderen Benutzern teilen oder für Ihre Website auf einem sozialen Netzwerk die Werbetrommel rühren – schnell und einfach per Klick auf das entsprechende Symbol.
Soziale Netzwerke 169 Einfügen eines Lesezeichen-Symbolstreifens für soziale Netzwerke 1. Klicken Sie in der Kategorie „Soziale Netzwerke“ der Registerkarte QuickBuild auf das Symbol Lesezeichen-Symbolstreifen für soziale Netzwerke und klicken Sie dann auf eine beliebige Stelle Ihrer Seite, um das Objekt zu platzieren. 2. Um das Symbol für eine Website in den Streifen einzutragen, klicken Sie auf den Namen der Website in der Liste Nicht im Streifen enthalten und dann auf die Schaltfläche +.
170 Soziale Netzwerke Bearbeiten eines Lesezeichen-Symbolstreifens für soziale Netzwerke 1. Wählen Sie den auf einer Seite platzierten Symbolstreifen aus. 2. Führen Sie einen Doppelklick auf den Symbolstreifen aus. Es wird nun das Dialogfeld für die Bearbeitung angezeigt. Die Optionen in diesem Dialogfeld sind identisch mit denen, die für die Erstellung des Symbolstreifens verfügbar waren. 3. Nehmen Sie die gewünschten Änderungen vor und klicken Sie auf OK.
Multimedia
172 Multimedia
Multimedia 173 Einfügen von Videos WebPlus enthält einen optimierten Videoplayer von Flowplayer, der zu vielen Dateiformaten kompatibel ist, und mit dem Sie einzelne Videos und Playlisten direkt auf Ihren Seiten platzieren können. Hierfür lassen sich sowohl auf Ihren Festplatten gespeicherte Videos verwenden als auch auf Ihrem Webspace gespeicherte Videos und auch Streaming-Videos von anderen Onlinequellen. Unterstützte Videoformate Das primär unterstützte Videoformat ist MP4 (*.mp4).
174 Multimedia Wenn Sie Dateien hinzufügen und ein Video größer ist als 5 MB, werden Sie automatisch aufgefordert, das Video direkt an Ihren Webspace zu übertragen. Hierdurch verkürzen Sie die Zeit bei einem vollständigen Upload der Website, da die gesamten Dateien nicht erst von Ihrer Festplatte auf den Webspace „geschaufelt“ werden müssen.
Multimedia 4. 175 Fügen Sie die Videos in den Player ein: • Hinzufügen einzelner Videos Klicken Sie auf Dateien hinzufügen, um die gewünschten Videodateien auszuwählen. ODER • Hinzufügen aller Videos in einem Ordner Klicken Sie auf die Schaltfläche Ordner hinzufügen, um alle Videos aus einem bestimmten Ordner zu importieren. Wählen Sie den Ordner aus und klicken Sie auf OK.
176 Multimedia vollständige Webadresse ein. Natürlich können Sie die Adresse auch per Kopieren und Einfügen übertragen. Auf diese Weise lassen sich zum Beispiel Videos anderer Websites integrieren. 5. (Optional) Um ein Video aus der Playliste zu entfernen, aktivieren Sie das Kästchen links neben seiner Miniatur und klicken auf Löschen. 6. (Optional) Um die Reihenfolge der Videos in einer Playliste zu ändern, verwenden Sie die Symbole Aufwärts und Dialogfelds. 7.
Multimedia 177 Ersetzen von Videos und Bearbeiten der Playliste Für einen bestehenden Videoplayer können Sie jederzeit Ihre Auswahl an Videos oder auch die Playliste ändern Ersetzen Ihrer Videos und Bearbeiten der Playliste 1. Führen Sie einen Doppelklick auf das Videoobjekt Ihrer Seite aus. 2.
178 Multimedia Einbetten einzelner YouTube-Videos 1. Öffnen Sie die Website www.youtube.com in Ihrem Browser und wählen Sie das YouTube-Video aus, zu dem Sie einen Link erstellen möchten. 2. Kopieren Sie die URL-Adresse des Videos (oder den Einbettungscode). Der Code enthält eine einzigartige, alphanumerische ID, die den Videoclip eindeutig identifiziert. 3. Klicken Sie in der Kategorie „Mediadateien“ der Registerkarte QuickBuild auf das Symbol YouTube und dann auf einen Punkt Ihrer Seite. 4.
Multimedia 5. (Optional) Wenn Sie nur einen Teil des Videos anzeigen lassen möchten, geben Sie die Start- und Endzeit (in Sekunden) an. 6. Um das Video in den Standardplayer von YouTube einzufügen, klicken Sie auf OK. 179 Wenn Sie ein YouTube-Video durch ein anderes ersetzen möchten, führen Sie einfach einen Doppelklick auf ein bestehendes YouTube-Video aus. Fügen Sie nun die zuvor kopierte URL des Ersatzvideos in das Dialogfeld ein.
180 Multimedia Einbetten von Vimeo-Videos 1. Öffnen Sie die Website www.vimeo.com in Ihrem Browser und wählen Sie das Vimeo-Video aus, zu dem Sie einen Link erstellen möchten. 2. Kopieren Sie die URL-Adresse des Videos (oder den Einbettungscode). Der Code enthält eine einzigartige, alphanumerische ID, die den Videoclip eindeutig identifiziert. 3. Klicken Sie in der Kategorie „Mediadateien“ der Registerkarte QuickBuild auf das Symbol Vimeo und dann auf einen Punkt Ihrer Seite. 4.
Multimedia 6. 181 (Optional) Aktivieren/Deaktivieren Sie die Kontrollkästchen für die Videoeinstellungen. Fügen Sie den Titel in das Intro des Videos ein. 7. Klicken Sie auf die Schaltfläche OK. Einfügen von Flash-Dateien (SWF) SWF-Dateien können Filme, Animationen oder interaktive Features enthalten, die auf das Format des Flash™ Players setzen. Beachten Sie bitte, dass Webbrowser die FlashAnimationen und Movies nur auf „normalen“ Computern anzeigen können.
182 Multimedia Animation von der WebPlus-Datei getrennt halten, und lieber eine Verknüpfung zu der Flash-Datei in Ihre Seite einfügen möchten, deaktivieren Sie die Option FlashDatei in Website einbetten. 3. (Optional) Legen Sie in dem Feld Zusätzliche Dateien eine kleine Liste mit Dateien (z. B. Bildern) an, aus denen Ihr Flash-Movie besteht. Mit dieser lokalen „Bibliothek“ haben Sie die zusätzlichen Dateien stets griffbereit und können schnell einen Verweis auf die Dateien erstellen.
Multimedia 183 Bearbeiten von Flash-Movies • Führen Sie einen Doppelklick auf Ihr Flash-Movie aus. Einfügen von Ton und Musik WebPlus enthält einen Audioplayer von jPlayer, der für ein Höchstmaß an Kompatibilität auf HTML 5 setzt. Auf Ihrer Seite mit einem Player können Sie dann eine einzelne Audiodatei einbinden oder auch mehrere Stücke als Playliste. Hierfür lassen sich sowohl Audiodateien von Ihrem Computer verwenden als auch StreamingAudiodateien aus dem Internet.
184 Multimedia Einfügen einzelner Audiodateien oder Playlisten 1. Klicken Sie in der Kategorie „Mediadateien“ der Registerkarte QuickBuild auf das Symbol Audioplayer. 2. Platzieren Sie den Mauszeiger an der gewünschten Position für den Audioplayer auf der Seite und klicken Sie einmal. 3.
Multimedia 185 • Hinzufügen von Audiomaterial, das zuvor über den Onlineressourcen-Manager hochgeladen wurde Klicken Sie auf die Schaltfläche URL hinzufügen und aktivieren Sie die Option Aus Onlineressourcen hinzufügen. Wählen Sie über das Dropdownfeld eine Datei aus. ODER • Hinzufügen von Audiomaterial, das sich bereits online befindet Klicken Sie auf die Schaltfläche URL hinzufügen und geben Sie die URL der Audiodatei als vollständige Webadresse ein.
186 Multimedia Der Audioplayer wird nun an der Stelle auf der Seite platziert, die Sie angeklickt haben. Mit dem Onlineressourcen-Manager (Extras > Website-Manager) können Sie Ihren Webspace nach Audiodateien durchsuchen sowie auch manuell Audiodateien an Ihren Webspace übertragen. Alle im Onlineressourcen-Manager angezeigten Audiodateien sind auch in der oben erläuterten Dropdownliste Aus Onlineressourcen hinzufügen enthalten.
Formulare
188 Formulare
Formulare 189 Einfügen von Formularen Mit Webformularen können Sie auf effiziente und moderne Weise neue Informationen von den Besuchern Ihrer Website erfragen. Formulardaten lassen sich auf unterschiedliche Weise sammeln – per E-Mail, in einer Skriptdatei (lokal oder auf einem Remote-Server) oder über die Webressourcen von Serif. Nähere Informationen hierzu finden Sie unter dem Thema „Übertragen von Formularen“ auf Seite 199.
190 Formulare eingegebenen Daten. Nähere Informationen zu der TabReihenfolge und der Validierung finden Sie in der WebPlusHilfe. Jedes Feld ist durch einen bestimmten Satz Formularfeldeigenschaften definiert, die sein Aussehen, seine Werte, die Validierungsmethode sowie die Aktion festlegen, die von dem Feld erwartet wird. Die verschiedenen Funktionen der Formulare werden erst verfügbar, nachdem Sie die Website im Internet publiziert haben.
Formulare 191 Die Formularvorlagen sind für häufig verwendete Formulare aus den Bereichen Benutzerzuweisung, Kommentare und Anmeldung entworfen. Sie können natürlich auch selbst Formulare entwerfen, z. B. für die Übermittlung von Lebensläufen oder Umfragen. • Wenn Sie lieber alles von Grund auf selbst aufbauen, fügen Sie alternativ ein leeres Formular in eine Seite ein und füllen es dann mit Formularfeldern aus der Registerkarte QuickBuild.
192 Formulare Erstellen eines Formulars mit einer Vorlage 1. Wählen Sie in der Registerkarte QuickBuild das Symbol Formular der Kategorie „Formulare“ aus und klicken Sie auf die Seite. 2. Öffnen Sie im Formular-Designer die Registerkarte Vorlagen und wählen Sie eine Formularvorlage aus (z. B. „Anmeldung“ usw.). Mit der Vorschau auf der rechten Seite können Sie die einzelnen Vorlagen bequem prüfen. 3. Wählen Sie in der Registerkarte Thema einen Look für Ihr Formular aus. 4.
Formulare 193 finden Sie unter dem Thema „Übertragen von Formularen“ auf Seite 199. 7. Klicken Sie auf die Schaltfläche OK. Wenn Sie noch keine Übermittlung für die Formulardaten festgelegt haben, werden Sie automatisch aufgefordert, zum Formular-Designer zurückzukehren (klicken Sie auf „Abbrechen“) und diesen Schritt nachzuholen. Wenn Sie auf „OK“ klicken, müssen Sie die Formularübermittlung später noch festlegen. Das Formular wird nun auf Ihrer Seite platziert.
194 3. Formulare Sie können den standardmäßig verwendeten Namen übernehmen (dieser dient nur zur eindeutigen Identifikation innerhalb des Formulars) oder auch abändern. Legen Sie anschließend die Bezeichnung fest, die auf dem Bildschirm zu dem Formularfeld angezeigt werden soll. Neuordnen der Felder • Wählen Sie in der Vorschau ein Formularfeld aus und klicken Sie auf das Symbol Aufwärts oder Abwärts. Entfernen von Formularfeldern • Wählen Sie ein Formularfeld aus und klicken Sie auf Löschen.
Formulare 195 Großbritannien, die US-Bundesstaaten usw.) klicken Sie auf Quelldateien und dann in dem Menü auf Feld aus einem Quelldatei-Paket laden. Wählen Sie anschließend einfach mit dem Quelldatei-Browser das gewünschte Feld der Kategorie „Kombinationsfelder“ aus. Entwerfen komplett neuer Formulare Wenn Sie Ihr Formular mit WebPlus von Grund auf selbst entwerfen möchten, fügen Sie zunächst ein leeres Formular in Ihre Seite ein und füllen es dann mit den gewünschten Formularfeldern.
196 Formulare Einfügen von Formularfeldern in das Formular • Klicken Sie in der Registerkarte QuickBuild auf ein Formularfeld (z. B. ein Eingabefeld) und dann in den Formularbereich, um das Feld zu platzieren. Wenn Sie ein Formularfeld in dem Formular platzieren, werden die Felder mit dem Formular verankert.
Formulare 197 Auswählen von Formularen mit dem QuelldateiBrowser 1. Klicken Sie in der Registerkarte Vorlagen des Formular-Designers auf die Schaltfläche QuelldateiBrowser. 2. Wählen Sie ein Formular der Kategorie Seiteninhalt > Formularvorlagen des Quelldatei-Browsers aus. Nähere Informationen zu Quelldateien finden Sie unter dem Thema „Arbeiten mit dem Quelldatei-Browser“. Möchten Sie ein Formularfeld speichern, das Sie verändert oder selbst entworfen haben, legen Sie es einfach als Quelldatei ab.
198 Formulare Auf der Seite bleibt das Formular stets gesperrt, um eine versehentliche Bearbeitung zu verhindern. Wenn Sie das Design jedoch frei verändern möchten, können Sie die Sperre einfach aufheben. Aufheben der Formularsperre für die Bearbeitung • Klicken Sie in der Formularkontextleiste auf die Option Formular freigeben. Nachdem Sie die Formularsperre aufgehoben haben, können Sie das Formular zwar flexibel verändern, der Formular-Designer steht Ihnen jedoch nicht mehr zur Verfügung.
Formulare 199 Übertragen von Formularen Alle Webformulare müssen an einen bestimmten Empfänger versandt werden, damit ihre Daten ausgewertet werden können. Hierzu klicken Ihre Website-Besucher auf eine spezielle Schaltfläche Absenden, die Sie als Formularfeld im Formular-Designer oder bei dem Erstellen komplett neuer Formulare festlegen. Diese zwingend erforderliche Schaltfläche wird häufig zusammen mit der Schaltfläche Zurücksetzen in einem Formular platziert.
200 Formulare Weitere Informationen zu den optionsspezifischen Einstellungen finden Sie in der WebPlus-Hilfe. Serif Webressourcen Konfigurieren der Serif Webressourcen 1. Wählen Sie die Option Serif Webressourcen aus und klicken Sie neben dem Feld E-Mail-Adresse auf Auswählen. Falls Sie noch nicht bei den Serif Webressourcen angemeldet sind, müssen Sie diesen Schritt nun nachholen. 2. Geben Sie in das Feld „Neu hinzufügen“ die E-MailZieladresse ein und klicken Sie auf Neu hinzufügen.
Formulare 201 einfach die gewünschte Option in dem Dropdownfeld aus. Wenn Sie mit der Option „Benanntes Fenster“ oder „Dokumentrahmen“ arbeiten, können Sie zusätzlich den Namen des Fensters bzw. Rahmens angeben. Nähere Informationen hierzu finden Sie unter dem Thema „Einfügen von Hyperlinks und Aktionen“ auf Seite 85. 4. Wählen Sie ein Betreff-Feld aus. Hierdurch werden die übermittelten Formularfelddaten für ein ausgewähltes Formularfeld als Betreffzeile der E-Mail verschickt.
202 9. Formulare Wenn Sie mit einem E-Mail-Formularfeld die Bestätigungs-E-Mail an Ihre Website-Besucher verschicken möchten, können Sie das E-MailFormularfeld in der Dropdownliste Bestätigungsfeld auswählen. 10. Klicken Sie auf die Schaltfläche OK. reCAPTCHA-Gateway Wird der Test bestanden, initiiert das Objekt automatisch die Formularübermittlung. Eine E-Mail Adresse Mit dieser Option können Sie die allgemein üblichen POSTund GET-Übertragungsmethoden umgehen.
Formulare 203 Einrichten der direkten E-Mail-Übertragung • Klicken Sie auf das Symbol und geben Sie eine E-MailAdresse als Ziel ein (oder wählen Sie eine bereits bekannte Adresse in dem Dropdownfeld aus). Ein Skript von meiner Festplatte Diese Option ist speziell für erfahrene Webdesigner konzipiert, die sich gut in der Erstellung von Skripten auskennen.
204 Formulare Einrichten einer Remote-Skriptdatei 1. Klicken Sie auf das Symbol und geben Sie einen Formularnamen ein. 2. Geben Sie die URL ein, die direkt auf die Skriptdatei verweist. 3. Wählen Sie eine Übertragungsmethode, einen Codierungstyp, einen Zeichensatz und ein Zielfenster oder einen Zielrahmen aus. Keine Übermittlung Es werden keine Formulardaten übertragen.
Text
206 Text
Text 207 Importieren von Texten aus einer Datei Das Importieren von Texten aus einer bestehenden Datei ist eine der einfachsten Möglichkeiten, den Text für eine Website zu erstellen. Alternativ können Sie den Text natürlich auch mit WritePlus neu verfassen. Wenn Sie Ihre Texte für gewöhnlich mit einer Textverarbeitung wie Microsoft Word erstellen, lassen sich die einzelnen Dateien schnell und unkompliziert in eine Website importieren. Neben dem WritePlus-Format „*.
208 Text WebPlus importiert den Text in einen ausgewählten Textrahmen oder erstellt automatisch einen neuen Textrahmen, wenn Sie keinen ausgewählt haben. Nähere Informationen hierzu finden Sie unter dem Thema „Einfügen von Textrahmen“ auf Seite 55. WebPlus übernimmt stets die Formatierung aus Texten, die in einer Textverarbeitung erstellt wurden.
Text 5. 209 Ziehen Sie den Cursor mit gedrückter Maustaste über die Seite, um die Rahmenabmessungen selbst festzulegen. ODER Klicken Sie auf die Seite oder die Montagefläche, um einen Rahmen in Standardgröße zu erstellen. Sie können ebenfalls den Text in einen Rahmen importieren, der sich bereits auf einer Seite befindet. Importieren von Text in bestehende Textrahmen 1. Wenn Sie den Text in einen bestehenden leeren Rahmen einfügen möchten, wählen Sie den Rahmen zunächst aus.
210 Text Arbeiten mit künstlerischen Texten Künstlerische Texte sind separate Textobjekte, die Sie direkt auf der Seite eingeben und beliebig platzieren können. Diese Texte sind besonders praktisch für Überschriften, herausgestellte Zitate oder Spezialtexte und lassen sich mit den Standardwerkzeugen für Texte schnell und einfach formatieren. Erstellen von künstlerischen Texten 1. Klicken Sie in der Zeichnungsleiste auf das Symbol Künstlerischer Text. 2.
Text 211 3. Bevor Sie mit der Texteingabe beginnen, sollten Sie über die Textkontextleiste oder das Menü Text die wichtigsten Grundeinstellungen wie Schriftart, Formatvorlage usw. festlegen. Alternativ können Sie diese Optionen auch über das Kontextmenü festlegen. Klicken Sie hierzu mit der rechten Maustaste auf die Einfügemarke und dann auf die gewünschte Option des Untermenüs Textformat. 4. Tippen Sie den Text direkt auf der Seite ein, um ein künstlerisches Textobjekt zu erstellen.
212 Text Bearbeiten von künstlerischen Texten • Ziehen Sie den Cursor über einen Textbereich, um eine blaue Auswahl zu erstellen. Alternativ können Sie auch ein Wort per Doppelklick auswählen. Sie können jetzt entweder einen neuen Text eingeben oder die Buchstaben und Absätze mit den entsprechenden Optionen formatieren, die Rechtschreibung prüfen, den Text in WritePlus bearbeiten usw.
Text 213 „Suchen und Ersetzen“ bearbeiten. Wenn Sie eine längere Story bearbeiten oder noch einige zusätzliche Optionen einstellen möchten, wechseln Sie einfach zu WritePlus (Text > Story bearbeiten). Auswählen und Eingeben von Texten Das Auswählen von Rahmentexten, künstlerischen Texten und Tabellentext funktioniert wie bei den meisten modernen Textverarbeitungen. Um die Bearbeitung zu vereinfachen, wird ein ausgewählter Bereich immer mit einer halbtransparenten, blauen Schattierung gekennzeichnet.
214 Text Bearbeiten von Texten auf einer Seite 1. Aktivieren Sie das Zeigerwerkzeug und wählen Sie den gewünschten Text durch Klicken oder Klicken und Ziehen aus. Das Programm platziert nun eine Einfügemarke an der Position, die Sie angeklickt haben (siehe unten). ODER Wählen Sie ein Wort, einen Absatz oder einen Textbereich aus. 2. Tippen Sie den neuen Text ein. Der Text wird nun entweder an der Einfügemarke platziert oder ersetzt den zuvor markierten Text.
Text 215 Umschalten zwischen den Modi „Einfügen“ und „Überschreiben“ • Drücken Sie die Taste Einfg. Kopieren, Einfügen und Verschieben von Texten Sie können Texte wahlweise mit den Standardbefehlen kopieren und einfügen oder auch die Texte durch Klicken und Ziehen verändern. Wenn Sie keine Einfügemarke platzieren, wird der Text direkt in einen neuen Textrahmen eingesetzt. WebPlus bietet auch eine Funktion, mit der Sie Texte nach Wörtern und/oder Zahlen sortieren können.
216 Text
Kreatives Arbeiten mit Quelldateien
218 Kreatives Arbeiten mit Quelldateien
Kreatives Arbeiten mit Quelldateien 219 Arbeiten mit Quelldateien Quelldatei ist der Oberbegriff für alle Objekte oder Seitenelemente, die Sie auf Ihren Dokumentseiten platzieren können, um deren Layout, Wirkung und Funktionalität genau an Ihre Vorstellungen anzupassen. Die Quelldateien reichen von Grafiken, Bildern, Bildrahmen, Schaltflächen, Slidern und Panels sowie verschiedenen Einstellungen bis zu komplexen Seiteninhalten und auch ganzen Seiten.
220 Kreatives Arbeiten mit Quelldateien Die Designvorlagen der Themenlayouts enthalten bereits einige Quelldateien, die genau auf das jeweilige Design der Website abgestimmt sind.
Kreatives Arbeiten mit Quelldateien 221 • Grafiken: Hier finden Sie die professionell entworfenen Cliparts aus Quelldatei-Paketen. • Bilder: Hier werden Bilder von Ihrer Festplatte gespeichert sowie Bilder aus einem Quelldatei-Paket (nicht alle diese Pakete enthalten auch Bilder). • Seiteninhalt: Hier finden Sie verschiedene Objekte aus den Quelldatei-Paketen, wie z. B. Navigationsleisten, Schaltflächen, Slider, Panels, Bildrahmen, Formulare, Formularfelder sowie Textrahmen und Formen.
222 Kreatives Arbeiten mit Quelldateien speichern, sondern nur die für Objekte festgelegten Einstellungen, verwenden Sie die Kategorie „Einstellungen“ der Registerkarte. Nähere Informationen hierzu finden Sie unter dem Abschnitt „Speichern eigener Quelldateien und ihrer Einstellungen“ auf Seite 227. Suchen nach Quelldateien Die zu Beginn noch leere Registerkarte lässt sich schnell und einfach über den Quelldatei-Browser mit Layoutelementen Ihrer Wahl füllen.
Kreatives Arbeiten mit Quelldateien 223 importieren Sie Bilder, Grafiken oder PagePlusPaketdateien. Sie können die Quelldateien mit Markern versehen und dann Ihr eigenes Quelldatei-Paket speichern oder exportieren. Weitere Informationen hierzu finden Sie unter dem Thema „Entwerfen eigener Quelldatei-Pakete“ in der WebPlus-Hilfe. Arbeiten mit dem QuelldateiBrowser Der Quelldatei-Browser bietet eine breite Palette professionell entworfener Designs, die Sie direkt für Ihre Website einsetzen können.
224 Kreatives Arbeiten mit Quelldateien Durchsuchen von Quelldateien nach Kategorie 1. Klicken Sie in der Registerkarte Quelldateien auf Durchsuchen. 2. Wählen Sie in dem Quelldatei-Browser eine Kategorie in dem Abschnitt Kategorien aus. Für die Kategorie „Grafiken“ werden in dem Hauptfeld z. B. die verschiedenen Unterkategorien aufgelistet. 3. Blättern Sie mit der Bildlaufleiste einfach durch die Unterkategorien, um all ihre Inhalte zu betrachten. Durchsuchen von Quelldateien nach Paketdatei 1.
Kreatives Arbeiten mit Quelldateien 225 Suchen nach Quelldateien Die Suchfunktion filtert die Quelldateien nach vordefinierten und selbst angelegten Markern, die für alle im Quelldatei-Browser angezeigten Quelldatei-Pakete festgelegt sind. Anwenden von Suchfiltern • Für eine einfache Suche geben Sie einfach das gewünschte Wort oder den gewünschten Buchstaben in das Textfeld Suchen oben rechts in dem Dialogfeld ein. Diese Methode ist ideal für alle Marker, die Sie selbst angelegt haben.
226 Kreatives Arbeiten mit Quelldateien Einfügen aller Quelldateien • Klicken Sie in der rechten oberen Ecke jeder einzelnen Miniaturengalerie des Quelldatei-Pakets auf das Symbol Alles hinzufügen. Alle Miniaturen werden nun mit Häkchen markiert. Wenn Sie mit einer dieser Methoden die gewünschten Quelldateien auswählen, sind diese anschließend in der Registerkarte Quelldateien verfügbar, sobald Sie den Quelldatei-Browser schließen.
Kreatives Arbeiten mit Quelldateien 227 Speichern eigener Quelldateien und ihrer Einstellungen In WebPlus können Sie aus den auf Ihren Seiten platzierten Objekten eigene Quelldateien erstellen und speichern. Die Einstellungen für ein Objekt (seine Farbe) lassen sich ebenfalls speichern. Die Quelldateien lassen sich dann immer wieder für Ihre aktuelle WebPlus-Website oder auch für andere Projekte einsetzen.
228 Kreatives Arbeiten mit Quelldateien Speichern der Objekteinstellungen als Quelldatei • Seiteninhalt* (Navigationsleisten, Schaltflächen, Formulare) • Einstellungen* (Hintergründe, Formularthemen, Navigationsleisten, Schaltflächen, CSS-Eigenschaften, Videoplayer, Wasserzeichen, Elementoptionen für ECommerce) * Wenn Sie Ihre Website schließen, müssen alle selbst angelegten Quelldateien gespeichert werden, die Sie für dieses Projekt in diesen Kategorien eingelagert haben.
Kreatives Arbeiten mit Quelldateien 229 Nach der Installation von WebPlus ist die Galerie „Eigene Designs“ leer. Sie können jederzeit Ihre eigenen Objekte in dieser Kategorie speichern. Speichern Ihrer Objekte in der Kategorie „Eigene Designs“ • Ziehen Sie ein Objekt von der Seite und legen Sie es in der Kategorie „Eigene Designs“ der Registerkarte Quelldateien ab. Sie müssen die Kategorie hierfür nicht extra erweitern; WebPlus übernimmt diesen Schritt automatisch für Sie.
230 Kreatives Arbeiten mit Quelldateien Speichern von Seiten Alle Seiten Ihrer Website lassen sich in der Kategorie „Seiten“ der Registerkarte Quelldateien speichern. Speichern einer Seite 1. Wählen Sie die Kategorie „Seiten“ der Registerkarte Quelldateien aus und klicken Sie auf Hinzufügen. 2. Wählen Sie in dem Dialogfeld eine Seite oder MasterSeite Ihrer Website aus. 3. Klicken Sie auf die Schaltfläche OK. Die Seite wird nun in der Kategorie „Seiten“ angezeigt.
Kreatives Arbeiten mit Quelldateien 231 Wenn Sie Hintergründe, Formularthemen, Navigationsleisten, Schaltflächen, CSS-Eigenschaften, Videoplayer, Wasserzeichen oder E-CommerceOptionen erstellen, können Sie die selbst festgelegten Optionen direkt in der Kategorie „Einstellungen“ der Registerkarte „Quelldateien“ speichern. Arretieren von Kategorien und einzelnen Quelldateien Sie können einzelne Quelldateien und ganze Kategorien der Registerkarte Quelldateien für alle Websites zugänglich machen (d. h.
232 • Kreatives Arbeiten mit Quelldateien Um alle Quelldateien einer Kategorie freizugeben, klicken Sie auf die Option Nichts arretieren des Kategorietitels. ODER Um die Arretierung einzelner Quelldateien zu lösen, klicken Sie auf das diagonale Stecknadel-Symbol der entsprechenden Miniaturen.
Vorschau und Publizieren
234 Vorschau und Publizieren
Vorschau und Publizieren 235 Die Aufgabenliste Die Registerkarte Aufgabenliste zeigt Ihnen alle Fehlermeldungen, Probleme, Aufgaben und Erinnerungen zu Ihrer Website an, um die Sie sich vor dem Publizieren der Website noch kümmern sollten. Die einzelnen Einträge bieten interaktive Möglichkeiten, sodass sich die Probleme direkt aus der Liste manuell und automatisch lösen lassen. Jedes Mal, wenn Sie Ihre Website publizieren, werden diese Probleme automatisch in dem Dialogfeld für die Publikation angezeigt.
236 Vorschau und Publizieren Erstellen eigener Listeneinträge In der Registerkarte „Aufgabenliste“ können Sie auch selbst Einträge vornehmen, z. B. damit Sie einen bestimmten Arbeitsablauf nicht vergessen, der erst später in der Designphase erledigt werden muss. Sie können sowohl einen Text als Erinnerung eintragen als auch eine Dringlichkeitsstufe und ein Fälligkeitsdatum (z. B. das Datum, an dem die Website live im Netz stehen muss).
Vorschau und Publizieren 2. 237 Wählen Sie eine der folgenden Optionen in dem Menü aus: • Vorschau im Fenster (Internet Explorer) (Tastaturkürzel: Alt + P): Dieser Befehl öffnet die Website in einem neuen internen WebPlusFenster, sodass Sie über die Reiter der Fensterregisterkarten bequem zwischen Vorschauund Bearbeitungsfenster umschalten können. • Um einen externen Browser zu verwenden, wählen Sie die Option Vorschau in aus.
238 Vorschau und Publizieren Publizieren im Web (mit WebPlus.net) Ihre Website lässt sich bequem per Upload an WebPlus.net (Serif Webhosting) übertragen, damit Ihr Werk für die ganze Welt sichtbar ist! Sie können wahlweise alle Webseiten publizieren oder nur die Seiten, die seit dem letzten Publikationsvorgang aktualisiert wurden. Nähere Informationen zu dem Upload an Ihre Website finden Sie unter dem Thema „Publizieren im Web“ auf Seite 239.
Vorschau und Publizieren 239 dass dieses Angebot momentan nur in englischer Sprache verfügbar ist. Alternativ hat Ihnen vielleicht Ihr Internet-Service, bei dem Sie Ihre E-Mail-Adresse angelegt haben, vielleicht schon einigen Speicherplatz für eine Website oder andere Dateien zur Verfügung gestellt. Publizieren im Web Nachdem Ihr WebPlus-Projekt fertig ist und Sie Ihren Webspace und die Hosting-Umgebung eingerichtet haben, können Sie Ihre Website per Upload im Internet veröffentlichen.
240 Vorschau und Publizieren Festlegen der FTP-Kontoinformationen 1. Klicken Sie in dem Dialogfeld Im Web publizieren: Hosting-Informationen auf Details Eingeben. 2. Geben Sie in das Dialogfeld Kontodetails folgende Informationen ein: • Unterstützt Ihr Webhost eine sichere FTPVerbindung, aktivieren Sie die Option SFTP verwenden. Dieses Übertragungsprotokoll sorgt dafür, dass Daten über einen privaten und sichern Datenstrom an Ihren Host versendet werden.
Vorschau und Publizieren 241 • Wenn Ihr Dienstanbieter keinen bestimmten Ordner vorgeschrieben hat, oder Sie nicht unbedingt alle Dateien in ein spezielles Verzeichnis kopieren müssen, lassen Sie das Feld Ordner einfach leer. • Anschließend geben Sie den Benutzernamen und das Kennwort ein, die Sie von Ihrem Dienstanbieter erhalten haben. Diese beiden Angaben entsprechen höchstwahrscheinlich den Anmeldungsdaten (Login) für Ihre E-Mail-Adresse.
242 Vorschau und Publizieren arbeiten sowohl mit aktiven als auch passiven FTPModi. Eventuell kann Ihnen der Support des Unternehmens hierbei helfen. 3. • Website-URL: Die URL-Adresse Ihrer Website. Nach dem FTP-Upload können Sie die Website mithilfe eines Dialogfelds und dieser URL anzeigen. • Klicken Sie auf OK, um das Dialogfeld „Kontodetails“ zu schließen. Klicken Sie nun in dem Dialogfeld für den ServerUpload auf Test, um Ihr FTP-Konto zu testen.
Vorschau und Publizieren 243 Übertragen Ihrer Website per Upload 1. Wählen Sie in dem Dialogfeld Im Web publizieren das gewünschte FTP-Konto über das Dropdownfeld aus. 2. Arbeitet Ihre Website mit einer Datenbank, ist die Option Vor dem Publizieren zusammenführen aktiviert. Wenn Sie eventuelle Änderungen nicht übernehmen möchten, deaktivieren Sie einfach die Option. Diese Option wird grau dargestellt und ist somit nicht verfügbar, wenn das Programm keine Datenbank oder Änderungen erkennt.
244 6. Vorschau und Publizieren Klicken Sie auf OK. Nachdem WebPlus eine Internetverbindung gefunden hat, geschieht Folgendes: • Wenn Sie das erste Mal eine Website übertragen, werden die ausgewählten Dateien direkt an den Webserver übermittelt. ODER Wenn Sie die Dateien an eine bestehende Website übermitteln, wird ein Dialogfeld für den DateiUpload mit den verschiedenen Aktionen zu den Dateien angezeigt.
Vorschau und Publizieren 245 aktivieren. Standardmäßig ist diese Option jedoch deaktiviert, da diese Suche sehr zeitintensiv ist und den Upload eventuell deutlich in die Länge zieht. Nach erfolgreicher Übertragung aller Dateien zeigt das Programm eine entsprechende Hinweismeldung an. Klicken Sie auf die Schaltfläche Schließen. 7. Wählen Sie in dem Dialogfeld für die WebsitePublikation den Browser aus, in dem Sie die LiveWebsite anzeigen möchten und klicken Sie auf Diese URL anzeigen.
246 Vorschau und Publizieren Anzeigen der publizierten Website Nachdem Sie die Webseiten publiziert haben, können Sie Ihr Werk mit der Option Website online prüfen im Menü Website-Vorschau der Standardsymbolleiste prüfen. Die Website wird nun in ihrem zuletzt aktualisierten Status in Ihrem Standardwebbrowser angezeigt. Wenn Sie die Funktion Website online prüfen das erste Mal benutzen, wird ein Dialogfeld geöffnet, in das Sie die Standardadresse (URL) der Website eingeben müssen.
Anhänge
248 Anhänge
Anhänge 249 Serif-Kontaktinformationen Technischer Support Information dazu, wie Sie technische Unterstützung und Antworten auf produktspezifische Fragen erhalten sowie zur Kontaktaufnahme mit Serif finden Sie unter community.serif.com. Serif-Hauptniederlassung: The Software Centre PO Box 2000, Nottingham, NG11 7GW, Großbritannien Telefon +44 115 914 2000 Fax +44 115 914 2020 Online Webadresse: http://www.serif.com/de Internationale Anfragen Bitte wenden Sie sich an unseren Firmenhauptsitz.
250 Anhänge Warenzeichen und CopyrightVermerke Dieses Handbuch und die darin beschriebene Software werden im Rahmen eines Endbenutzer-Lizenzabkommens zur Verfügung gestellt, das dem Produkt beiliegt. Angaben zur erlaubten und untersagten Verwendung sind in dem Lizenzabkommen enthalten. Warenzeichen Serif ist ein eingetragenes Warenzeichen von Serif (Europe) Ltd. WebPlus ist ein eingetragenes Warenzeichen von Serif (Europe) Ltd. Alle anderen Serif-Produktnamen sind Warenzeichen von Serif (Europe) Ltd.
Anhänge 251 THE PROXIMITY/COLLINS DATABASE © 1990 William Collins Sons & Co. Ltd.; © 1990 Proximity Technology Inc. Alle Rechte vorbehalten. THE PROXIMITY/MERRIAM-WEBSTER DATABASE © 1990 MerriamWebster Inc.; © 1990 Proximity Technology Inc. Alle Rechte vorbehalten. The Sentry Spelling-Checker Engine © 2000 Wintertree Software Inc. WGrammar Grammar-Checker Engine © 1998 Wintertree Software Inc. Andrei Stcherbatchenko, Ferdinand Prantl PayPal © 1999 – 2012 PayPal. Alle Rechte vorbehalten.
252 Anhänge © 2014 Serif (Europe) Ltd. Alle Rechte vorbehalten. Dieses Handbuch darf in jeglicher Form, ob ganz oder teilweise, nur mit ausdrücklicher schriftlicher Genehmigung von Serif (Europe) Ltd. reproduziert werden. Serif WebPlus X8 © 2014 Serif (Europe) Ltd. Alle Rechte vorbehalten. Die in den Beispielen verwendeten Namen und Firmen sind frei erfunden.
Index
254 Index Abmessungen, 34 für die Website, 34 Abstimmung (SmartObjekt), 141 Aktionen, 88 Anhängen von MasterSeiten, 37 Animierte Objekte, 101 Banner, 101 Anker, 91 Anmeldungsformular, 123 Anpassungen (für Bilder), 64 Audio, 183 Audioplayer, 183 Einfügen, 183 Audioplayer, 183 Backups Ihrer Website, 44 Wiederherstellen, 46 Banner (animiert), 101 Bilder, 58 als Quelldateien, 223 Bildeffekte, 64 Bildkorrekturen, 64 in Lightboxen, 93 Popups, 118 Bildrahmen als Quelldateien, 223 Blogs, 125 Einfügen, 126 Verwal
Index Hyperlinks zu Einkaufswagen einfügen, 85 E-Commerce-Schaltflächen, 223 Effekte (für Bilder), 64 Einkaufswagen, 47 Einstellungen, 223 Speichern, 228, 230 Entfernen von Seiten/Master-Seiten, 38 Facebook (Objekte), 159 Farbe Hyperlink, 34 Features, 6 Neu, 6 Flash, 106, 181 Movies, 181 Foren, 128 Einfügen, 130 Verwalten, 132 Formatieren von Text Probleme, 235 Formular-Designer, 189 Formulare, 189 Bearbeiten, 197 Erstellen, 190 Erstellen von Grund auf neu, 195 Formularvorlagen, 191 Quelldateien für, 196 Ü
256 Index Lesezeichen-Symbolstreifen für soziale Netzwerke, 168 Lightboxen, 93 für Bilder, 60 Hyperlinks mit, 85 Like-Schaltfläche (Gefällt mir), 159 Lupe, 62 Mailinglisten, 155 Maps (Google), 112 Master-Seiten, 35, 43 Anhängen, 37 Eigenschaften, 43 Entfernen, 41 Hinzufügen, 40 Mitglieder-Manager einer Website, 144 Navigationsleisten, 75 Erstellen, 75 Schaltflächen für, 81 Neue Features, 6 Objekte (Erneut verwenden in Websites), 227 Objekte für soziale Netzwerke, 159, 161, 165 Facebook, 159 Google+, 165 T
Index Schaltflächen (Buttons), 75, 81 Eigene entwerfen, 84 Schützen von Seiten, 153 Seiten, 35 Hinzufügen und Entfernen, 38 Neuordnen, 41 Seitenfarbe Global, 34 257 Löschen der Kontodetails, 143 Sound Hyperlinks zu Videodateien, 85 Speichern von Designs, 227 Startassistent, 19, 22, 29 Storytext, 55 Studio für Ausschnitte, 63 Support, 249 SWF-Dateien, 181 Tabellen, 70 Übersicht, 70 Technischer Support, 249 Text, 55, 210, 212 Anpassen an Rahmen, 57 Bearbeiten auf einer Seite, 212 Formatierungsprobleme, 23
258 Index Einfügen, 173 Hyperlinks zu Videodateien, 85 Videoplayer, 173 Vimeo, 179 YouTube, 177 Videoplayer, 173 Vimeo-Videos, 179 Vorlage (Designvorlage), 22 Erstellen von Websites, 22 Warten von Websites Backup, 44 Wiederherstellen, 46 Webseiten und Websites, 29 Website-Eigenschaften, 34 Website-MitgliederManager, 150 Websites, 27, 29 Erstellen aus einer leeren Seite, 27 Öffnen bestehender Dokumente, 29 Website-Struktur, 31 Anzeigen, 33 Website-Strukturansicht, 33 Website-Suche, 133 Website-URLs, 85 We
