Der nächste Schritt in die Zukunft

Tags: page4update | Kommentare: 8 | Views: 1916

Mittwoch 8.November 2017

page4 bekommt ein neues Outfit
und eine neue Bedienung

 

Der nächste Schritt in die Zukunft

 

Mit dem nächsten Update machen wir einen großen Schritt in der Weiterentwicklung von page4. Zum einen bekommt unsere Software einen neuen Anstrich. Dezent mit weißem Hintergrund, einfarbigen Icons und schlichteren Dialogen. Zum anderen stellen wir die Benutzerführung etwas um und schaffen dadurch Platz für neue Ideen und Funktionen.

 

 

neues-outfit-2017

 

Ab sofort hast du zwei Menüs zum Bearbeiten. Im Menü oben findest du weiterhin die Palette mit den Inhalten, sofern du bereits eine Webseite hast. Außerdem ist dort weiterhin die Ablage, du kommst mit einem Klick zur Benutzerverwaltung oder kannst dich ausloggen.

Auf der linken Seite findest du nun das Hauptmenü, dargestellt durch einige schlichte Icons mit Beschriftung. Mit einem Klick kommst du so zu einem Dialog oder zu einem Untermenü, welches sich dann nach rechts hin ausdehnt. Das System beherrscht beliebige Ebenen. Klickst du zum Beispiel auf das Icon „Inhalte“, dann blendet das Menü nach links aus und die zweite Ebene blendet nach rechts ein und zeigt dir in zwei Reihen Inhalte, geordnet nach Art. Das haben wir gemacht, um zu einzelnen Inhalten vorgefertigte Muster anzulegen. Wie diese aussehen, kannst du erkennen, wenn du zum Beispiel auf den Inhaltstyp „Text“ klickst. Wir haben dort für jede Überschrift ein Muster angelegt, welches in der Schriftgröße angezeigt wird, die im Design hinterlegt ist. Und zusätzlich noch einen Textblock für den Fließtext. Diese „Muster“ kannst du mit der Maus anfassen und auf deine Seite platzieren.

 

Mit dem Pfeil oben kommst du immer zurück zur vorherigen Menü-Ebene. Klickst du jetzt zum Beispiel auf Buttons, erkennst du den großen Unterschied zum alten System. Aktuell haben wir 22 Vorlagen angelegt. Jeder Button bietet Möglichkeiten zur grafischen Gestaltung und zur Texteingabe. Ziehst du einen Button auf deine Seite, wird genau so ein Button auch angelegt. Inklusive Farbe, Rahmen und Text. Jeden Button kannst du natürlich anschließend noch verändern. (Und wir können später weitere Vorlagen hinzufügen.) Noch existieren nicht für alle Inhaltselemente Vorlagen. In diesem Fall findest du einfach einen Texteintrag mit dem Namen des Inhaltselements. Diesen Eintrag kannst du auf deine Seite ziehen, um das Element dort anzulegen.

 

Nicht so oft benötigte Inhaltstypen haben wir unter einem Icon mit dem Titel „Verschiedenes“ zusammengefasst. Bei der alten Palette hatten wir bereits Schwierigkeiten, neue Inhaltselemente hinzuzufügen, da der Platz begrenzt war. Mit dem neuen System sind diese Beschränkungen nicht mehr vorhanden.

 

Zusätzlich haben wir die meisten Dialoge nun umgestellt auf ein schlichtes Design und den Hintergrund von Hellblau in fast Weiß geändert. Dadurch wirkt das ganze System zeitloser.

 

Wenn du zurück zum Hauptmenü gehst und dann mal auf Design klickst, kommst du in das Menü für den Design-Editor. Dort findest du als Kunde einer Kaufversion oben die Designverwaltung und darunter dann einzelne Icons, um direkt zu der Bearbeitung des aktuellen Designs zu springen. Wir werden bald die neue Seitenverwaltung online stellen und dann wirst du ein ähnliches System auch für Seiten haben. Oben wird dann die Seitenverwaltung ausgewählt werden können und mit einem Klick anschließend der Dialog geöffnet, wo alle Seiten in einem Seitenbaum dargestellt sind. Und darunter werden dann Bearbeitungsmöglichkeiten für die aktuelle Seite eingestellt. So wird es dann zum Beispiel möglich sein, die aktuelle Seite umzubenennen oder zu löschen, ohne die Seitenverwaltung zu öffnen, und vieles mehr.

Wie gesagt, das neue Update ist ein wichtiger Schritt in die Zukunft und sorgt dafür, dass page4 noch besser wird und du noch mehr Möglichkeiten bekommst, deine eigene Webseite zu gestalten und zu pflegen. 

 

Das Update wird, wenn alles planmäßig verläuft, am nächsten Dienstag online gehen. Mit diesem Film kannst du dich schon mal ein wenig vertraut machen und einen Eindruck bekommen, was dich erwartet.

 

Bis demnächst

Manfred F. Schreyer
page4 Ltd.

Mit einem Klick zum Ziel...

Tags: Updatepage4FunktionenContent | Kommentare: 15 | Views: 12293

Mittwoch 23.August 2017

button-2563859-1920

 

Unser neuer Button Content

 

Eine Webseite lebt davon, dass Inhalte miteinander verlinkt sind. Mit der Linkliste haben wir ja schon vor längerer Zeit einen Content veröffentlicht, welcher es ermöglicht, auf einfache Weise Links zu anderen Seiten und Inhalten zur Verfügung zu stellen. Viele User nutzen die Linkliste in einer Sidebar und zeigen ihren Besuchern damit auf einen Blick, was es Neues zu entdecken gibt.

 

Letzte Woche haben wir ein Update für den Bild-Content veröffentlicht und bei einem Bild kann man jetzt auch sehr leicht jede Art von Verlinkung hinterlegen, da wir dort das Standardelement für die Verlinkung eingebaut haben. Außerdem haben wir den Bild-Content für mobile Ansicht weiter optimiert und für zusätzliche Erweiterungen vorbereitet. Zum Beispiel kann man jetzt für die Bildunterschrift auch Google-Fonts nutzenen.

 

Mit dem heutigen Update stellen wir einen neuen Content vor: einen sogenannten Button oder auch Schaltknopf. So ein Button hat zwei Aufgaben. Er soll Besucher zu einer Aktion verleiten. Dazu kann man den Button beschriften. Wenn man auf den Button den Text aufbringt: "Bitte klicken für weitere Informationen ...", dann ist das solch eine Aufforderung. Besucher lieben klare Aussagen. Und sie möchten nicht enttäuscht werden. Was auf dem Button steht, sollte auch "in Erfüllung gehen". Damit so ein Aufruf tatsächlich zu einer Aktion führt (call to action), muss der Button natürlich verlinkt werden. Der Button informiert also durch seine Beschriftung, löst dadurch eine Aktion aus und leitet User weiter. Damit das Ganze dann tatsächlich gut zu deiner Seite passt, kann man den kompletten Button bewusst sehr schlicht gehalten, damit du dich zunächst auf das Wesentliche konzentrieren kannst. Du wirst sehen, das ist schon eine ganze Menge. Später werden wir weitere "Versionen" für Buttons vorstellen. Lass dich überraschen.

 

Jeder Button ist ein Unikat. Das bedeutet, du kannst beliebig viele unterschiedliche Buttons erstellen. Sinnvoll ist es aber, einen Button zu kreieren, der zu der Gestaltung deiner Seite passt. Wenn du mehrere dieser Schaltknöpfe auf deiner Seite verwenden möchtest, kopierst du diese einfach, hast so nur einmal die Arbeit der Gestaltung und machst es dem User einfacher, den Knopf als solchen überall zu erkennen.

 

Wie schon der neue Slider hat auch der neue Button einen Vollscreen Dialog und ist in schlichtem Weiß gehalten. Alle neuen Contents werden zukünftig so gestaltet. Nach und nach werden wir die vorhandenen Contents auf diesen neuen Dialog umbauen. Das wird jedoch einen längeren Zeitraum in Anspruch nehmen, weil wir nicht einfach nur die Optik anpassen, sondern natürlich alles optimieren und, wenn vorhanden, Wünsche unserer User berücksichtigen und einbauen.

 

Wie schon beim Slider kannst du den Text eines Buttons direkt auf der Seite editieren, ohne dazu den Dialog aufrufen zu müssen. Wir arbeiten daran, den Dialog für die Auswahl der Verlinkung zu optimieren. Wenn das fertig ist, dann werden wir auch die Möglichkeit anbieten können, den Link eines Buttons direkt auf der Seite anzupassen. Dann muss man den Dialog nur noch benutzen, um den Button zu gestalten, und kann sehr schnell eine beliebige Anzahl von Buttons beschriften und verlinken.

 

Der Dialog und die Optionen

 

So sieht der neue Button-Content aus.

 

button-v-2-dt

 

Ganz oben liefern wir dir  eine schöne große Vorschau (1). Diese Vorschau passt sich immer sofort an. Wenn du mit der Maus über die Vorschau fährst, wird außerdem der Hover-Effekt angezeigt. Du kannst für den Hover-Effekt die Schriftfarbe, die Rahmenfarbe und die Hintergrundfarbe anpassen (9).

 

Unter der Vorschau befindet sich ein Feld, um den Button zu beschriften. (2) Wenn möglich, solltest du die Beschriftung so kurzfassen, dass nur eine Zeile benötigt wird. Du kannst aber natürlich auch mehrzeilige Buttons anlegen, indem du einen Zeilenumbruch einfügst. Der Abstand zwischen den Zeilen wird automatisch eingestellt und hängt von der Schriftgröße sowie der Schriftart ab.

 

Unter dem Feld für die Beschriftung ist das Element zur Verlinkung eingebaut (3). Wie gewohnt öffnet sich der entsprechende Dialog, wenn du auf das Ankersymbol klickst.

 

Ein Button kann in einer Spalte links, mittig oder rechts (4) positioniert werden. Ist der Button so breit wie die Spalte, in der er angelegt wird, hat die Positionierung natürlich keine sichtbare Auswirkung.

 

Für die Gestaltung (5) stehen dir verschiedene Optionen zur Verfügung. Die Größe des Buttons korreliert mit der Schriftgröße. Dadurch wird garantiert, dass du immer einen perfekten Button bekommst. Der Button ist für die mobile Ansicht optimiert und passt sich entsprechend an. So ist sichergestellt, dass ein Button auch auf deinem Smartphone optimal dargestellt wird und nicht zu groß oder zu klein ist.

 

Den Button selbst gestaltest du mit den Elementen für den Inhalt. Du kannst eine der verfügbaren Schriften auswählen. (6) Hier noch einmal als Hinweis: Im Dialog sind Schriften, die keine Google-Fonts sind, mit (ST) markiert. Achtung: Schriften mit der Kennzeichnung (ST) müssen auf dem Computer des Besuchers vorhanden (installiert) sein, damit der Button für die Besucher deiner Seite so aussieht wie für dich. Verwendest du Google-Fonts, dann kannst du sicher sein, dass die von dir gewünschte und gewählte Gestaltung von allen Besuchern korrekt gesehen wird.

 

Die Schriftgröße kannst du mit einem Schieberegler einstellen oder mit dem Zahlenfeld daneben, und zwar von 10 px bis 99 px: Bewegst du den Schieberegler, siehst du sofort, wie der Button in Abhängigkeit der Schrift größer oder kleiner wird. Jede Schrift kann natürlich eine Farbe bekommen und diese Farbe eine Transparenz erhalten.

 

Um den Button kannst du einen Rahmen legen (7). Auch hier stehen dir alle bekannten Optionen zu Verfügung: verschiedene Rahmenstyles, eine Rahmenstärke, eine Farbe, der du eine Transparenz geben kannst, und über den Rahmen bekommt der Button auf Wunsch abgerundete Ecken. Die Rahmenstärke lässt sich von 0 bis 50 px einstellen und für die Rundung stehen dir Werte von 0 bis 500 px zur Verfügung. Durch den hohen Wert bei der Rundung kannst du theoretisch kreisrunde Buttons erzeugen. Das hängt aber immer von der Beschriftung und dem Innenabstand ab. Wie oben erwähnt, werden wir noch weitere „Button-Variationen" entwickeln, die solche Spezialfälle leichter abbilden können.

 

Natürlich kann jeder Button auch eine Hintergrundfarbe (8) bekommen. Wie du siehst, hat die Hintergrundfarbe einen Papierkorb. Damit lassen sich durchsichtige Buttons erzeugen. Bei einem durchsichtigen Button sollte aber immer ein Rahmen angeschaltet sein; sonst erkennt man den Button nicht als Schaltfläche, sondern sieht nur die Beschriftung.

 

Die Effekte, die angezeigt werden sollen, wenn der Besucher die Maus in den Button bewegt, stellst du zum Schluss ein (9). Alle Farben haben hier auch einen Papierkorb. Benutzt du den Papierkorb, löschst du die Farbe und es wird beim Hovern kein Effekt angezeigt.

 

Ich denke, da wir Standard-Elemente verwenden, solltest du schnell mit der Bedienung zurechtkommen. Nutze den Button gezielt. Auch hier gilt: schlicht ist besser. Zu groß sollte der Button nie ausfallen. Wenn du einen großen Bildschirm hast, dann ziehe deinen Browser lieber einmal etwas kleiner, damit du besser einschätzen kannst, wie deine Seite auf kleinen Bildschirmen aussieht.

 

Bis demnächst

Manfred F Schreyer

 

Volle Breitseite

Tags: Updatepage4GalerieDesignContent | Kommentare: 13 | Views: 20530

Mittwoch 28.Juni 2017

ship-2202910-1280

 

Galerien über den Bildschirm ausdehnen

 

Drei Erweiterungen für alle, die Bilder lieben.

 

  1. Unser Streifencontent hat jetzt eine Extra-Funktion, die man an- und ausschalten kann. Angeschaltet sorgt sie dafür, dass beim Scrollen das hinterlegte Bild zeitversetzt mitscrollt und so eine schöne, aber dezente Animation entsteht.
  2. Es gibt ein neues Inhaltselement, den Slider. Infos auf unserer Online-Hilfe.
  3. Neue Option "Breite ausdehnen" für alle Contents. Erreichbar über den Options-Dialog. Dieser lässt sich aufrufen, indem man auf das Zahnrad in der Toolbar klickt. Dort kann man die Hintergrundfarbe für einen einzelnen Content (Abschnitt) manuell überschreiben, Abstände sowie Linien eingeben und an dieser Stelle findest du auch die Sprungmarke, mit der man zu einem beliebigen anderen Content direkt verlinken kann. Ab sofort steht dort für dich eine weitere Option bereit, die sich " Breite ausdehnen" nennt und die man an- und ausschalten kann.

Animation im Streifencontent

 

Das Inhaltselement "Streifen" ist nur für unsere Kaufversionen freigeschaltet. In der kostenlosen Version kannst du diesen Effekt leider nicht nutzen. Vielleicht ein Grund mehr, auf eine Kaufversion umzusteigen.

 

streifen-neu-2017

 

Es gibt jetzt drei Optionen für den Streifen. "Mitscrollend" sorgt dafür, dass der Streifen mit dem Bild zusammen bewegt wird, wenn ein Besucher durch deine Seite scrollt. Es wird also immer derselbe Auschnitt des Bildes angezeigt. "Fixiert im Hintergrund" bedeutet: Der Streifen platziert das eingeladene Bild in den Hintergrund und zwar über den gesamten Browser (Cover) und zeigt dann in der Höhe vom Streifen immer den Auschnitt über den du dich gerade bewegst. Die neue Funktion "Fixiert mit Animation" platziert ebenfalls das Bild in den Hintergrund. Beim Scrollen wird dann zusätzlich eine Animation angeschaltet, die dafür sorgt, dass das Bild etwas verzögert gescrollt wird. Einen guten Eindruck bekommst du auf der Startseite unserer Beispielwebseite.

 

 

Der neue Slider, ein ganz besonderer Content

 

Beim Austesten der neuen Funktion "Breite ausdehnen" und dem Erstellen unserer Musterseite dazu sind uns viele Ideen gekommen. So haben wir überlegt, ob wir die Slideshow umbauen sollen, damit diese dann auf der vollen Bildschirmbreite angezeigt wird. Wir haben uns dagegen entschlossen und stattdessen einen neuen Content entwickelt, der Slider heißt. Dieser Slider bietet erstmals Möglichkeiten, die wir in die Galerie nicht hätten einbauen können. So könnte der Slider auf deiner Webseite aussehen.

 

slider-preview

 

Was kann man mit dem neuen Slider machen?

 

Wie in der Beispielseite (Link weiter unten) gezeigt, kannst du daraus zum Beispiel einen Header gestalten und dank der Folien könntest du einfach auf der Startseite die verschiedenen Themen deiner Webseite anzeigen lassen und dann zu den entsprechenden Seiten verlinken. Da es sich bei dem neuen Slider um einen Content handelt, lässt sich außerdem festlegen, auf welchen Seiten so ein Header angelegt werden soll.

 

Wir zeigen dir hier zur Inspiration einige Beispiele; so siehst du sehr schnell, was möglich ist und wofür sich der neue Slider eignet.

 

Übrigens, der neue Slider kann auch direkt bearbeitet werden, ohne den Dialog zu öffnen. Einfach mit der Maus in die Texte klicken und diese dann editieren. So wie inzwischen ja auch bei Text und Überschrift. Und zusätzlich kannst du mit einem Anfasser die Höhe des Sliders direkt auf der Seite einstellen. Irgendwann wirst du auch direkt neue Bilder in den Slider (und in andere Inhaltselemente) einbinden können, ohne dafür den Dialog nutzen zu müssen. Wann genau dass sein wird, kann ich aber noch nicht sagen.

 

 

Breite ausdehnen

 

Wir haben diese Funktion aktuell in jedem Content aktiviert. Allerdings ist nicht jedes Inhaltselement für diese Funktion wirklich geeignet. Außerdem musst du einige Besonderheiten beachten:

  1. Die Funktion wird automatisch deaktiviert (abgeschaltet), wenn du eine Sidebar verwendest. Es macht keinen Sinn, einen Inhalt über die gesamte Breite des Browsers auszudehnen, wenn man eine Sidebar hat. Der Inhalt würde sich über die Sidebar legen und so eventuell dafür sorgen, dass man die Sidebarinhalte nicht mehr bearbeiten kann.
  2. Die Funktion wird ebenfalls deaktiviert, wenn das Element sich in einer Reihe befindet oder in eine Reihe geschoben wird, die mehr als eine Spalte hat. Auch hier macht eine Darstellung auf der gesamten Bildschirmbreite keinen Sinn, da alle anderen Spalten von einem solch breiten Inhaltselement überdeckt würden.

 

Du musst dir diese Einzelheiten nicht merken. page4 ist so programmiert, dass das System in den oben beschriebenen Fällen automatisch reagiert. Verschiebst du ein Element mit einer aktiven „Auf Breite ausdehnen-Funktion“ in eine Reihe, in der mehr als eine Spalte vorhanden ist, verbreitert es sich nicht, sondern die Funktion wird ignoriert. Umgekehrt natürlich ebenso. Besitzt du ein Design mit einer oder zwei Sidebars, dann ist die Volle-Breite-Funktion ebenfalls automatisch deaktiviert. Bearbeitest du dein Design, indem du die Sidebars deaktivierst, und liegt das Element, das sich auf volle Breite entfalten soll, in einer Reihe mit nur einer Spalte, dehnt es sich automatisch aus, sobald du das Design speicherst und keine Sidebar mehr aktiv ist.

 

Was kann man mit dieser Option anfangen?

 

Wir haben eine Beispielseite angelegt, auf der wir einige Inhalte zeigen, die sich gut dazu eignen, um die Möglichkeiten der Funktion darzustellen. Zum Beispiel kannst du jetzt bestimmte Galerien links und rechts über deine Seite hinauslaufen lassen, bis zum Browserrand. So eine Galerie in einem Streifen wirkt sehr interessant. Da die Funktion „Auf volle Breite ausdehnen“ an einen Content gebunden ist, kannst du selbst bestimmen, auf welchen Seiten du solch einen Effekt zeigen möchtest, und ob du mehr als eine Galerie über den gesamten Bildschirm laufen lassen willst. Einfach mal ausprobieren. Es ist natürlich möglich, über und unter der Galerie Reihen anzulegen, die mehrere Spalten enthalten.

 

galerie-trash-1

 

Für die Galerien haben wir die Funktion "Breite" etwas erweitert. Bei Galerien gab es bisher zwei Optionen:

Entweder war es möglich, der Galerie eine bestimmte Breite zu geben - dann gab es dazu ein Eingabefeld und einen maximalen Wert für die Breite. Oder die Galerie hat den größtmöglichen Platz in der Breite automatisch eingenommen, weshalb wir darauf verzichtet haben, ein Eingabefeld einzubauen. Mit der neuen Option "Breite ausdehnen" haben wir die Galerien jetzt um eine Funktion erweitert:

Alle Galerien, die keine feste Breite und damit auch kein Eingabefeld für die Breite haben, dehnen sich mit der neuen Funktion automatisch aus.

Die Galerietypen, bei denen du eine feste Breite einstellen kannst, haben nun teilweise zusätzlich zur „Volle-Breite-Funktion“ einen Papierkorb erhalten. Der Papierkorb (1) dient dazu, eingetragene Breiten „hineinzuwerfen“, also zu löschen.

Das bedeutet Folgendes: Hat die Galerie keinen Papierkorb, mit dem man die eingetragene Breite löschen kann, dann dehnt sich die Galerie auch mit der neuen Funktion nicht aus, sondern ist maximal so breit wie eingetragen. Hat die Galerie einen Papierkorb und du löscht damit den Wert, der im Eingabefeld „Breite“ eingetragen ist, dann bedeutet das, die Galerie dehnt sich maximal aus.

 

Einige Anregungen zu der neuen Funktion "Breite ausdehnen"

 

Eine weitere Möglichkeit besteht darin, beispielsweise eine Google Map über die gesamte Breite des Monitors anzeigen zu lassen. Man muss eventuell nur die Einstellungen im HTML anpassen. Ein Beispiel findest du auf unserer Musterseite unter dem Menüpunkt Impressum. Wir haben ganz unten eine Google Map eingefügt und auf volle Breite gesetzt.

Auch Linien lassen sich gut ausdehnen. Je nachdem, wie du diese Linien einbaust, stellen sie durchaus ein interessantes Gestaltungsmittel dar.

Elemente, die eine feste Breite besitzen, wie z.B. ein Formular, eignen sich nicht so gut, um sie in der Breite auszudehnen. Allerdings kann man mit der Hintergrundfarbe einen Streifen erzeugen, der über den gesamten Browser reicht und dann dass Formular mittig darauf platzieren. Einfach mal ausprobieren, welche Elemente gut aussehen und wo ein Streifen keinen Sinn macht.

 

So, wir wünschen nun viel Spaß mit den neuen Funktionen.

 

Bis demnächst

Dein page4-Team

Rechtzeitig zum Sommer

Tags: Updatepage4GalerieBilder | Kommentare: 9 | Views: 21990

Montag 29.Mai 2017

blog-706

 

Neue Funktionen bei der Galerie

 

Mit dem neuen Update bietet page4 euch einige neue Funktionen, die sich User gewünscht haben. Zusätzlich haben wir die gesamte Bildauswahl neu gestaltet, ähnlich wie schon beim Blog. Die Bildauswahl findet jetzt in einem Fullscreen-Dialog statt, das heißt, in der Darstellung stets so groß wie euer Bildschirm, und bietet damit ausreichend Platz für alle Bilder einer Galerie.

 

Die Auswahl eigener Bilder aus der Bildverwaltung wurde ebenfalls auf einen Fullscreen-Dialog umgestellt und optisch angepasst, aber ohne neue Funktionen. Die neuen Funktionen betreffen die Bildauswahl speziell bei den Galerien.

 

Öffnest du nun den Dialog zum Bearbeiten einer Galerie, oder auch, wenn du eine neue Galerie anlegst, dann hast du ganz oben nur noch einen einzigen Button, mit dem du auf die Bildauswahl zugreifen kannst. Die Bilder der Galerie werden nicht mehr direkt im Dialog angezeigt, sondern nur noch, wenn du auf den Button klickst, um das dazugehörige Fenster zu öffnen. So bleibt der Dialog jederzeit übersichtlich, egal, wie viele Bilder zu deiner Galerie gehören.

 

Das schaut dann im Dialog selbst so aus:

galerie-2017-new

Über dem Button siehst du in der Titelzeile (1)  immer genau, wie viele Bilder die Galerie enthält.

 

Die neue Bildauswahl der Galerie

 

Klickst du auf den Button (2), öffnet sich folgender Dialog:

bildauswahl-galerie-new

Ganz oben siehst du die Möglichkeiten (2), die du hast, um neue Bilder hinzuzufügen. Diese Optionen entsprechen nun genau dem Dialog, den du schon vom Design-Editor für den Hintergrund kennst. 

 

Selbst wenn es unwahrscheinlich ist, dass du Bilder aus unserem Archiv für eine eigene Galerie benutzt, kannst du doch auf das page4-Archiv zurückgreifen. Da du ab jetzt, was wir später noch genauer erklären, in der Lage bist, Bilder einer Galerie zu verlinken, könntest du zum Beispiel aus dem Archiv Symbole verwenden, um daraus im Zusammenspiel mit einer Verlinkung eine Navigation zu Bereichen deiner Webseite zu bauen.

 

Auf der linken Seite hast du wie bisher die Option (grüner Ordner), Bilder aus der Bildverwaltung einzubinden. Und mit dem rechten Link (blauer Pfeil) kannst du Bilder direkt von deinem Computer hochladen.

 

Bisher war es so, dass neue Bilder grundsätzlich ans Ende einer Galerie angefügt worden sind. Auf Wunsch einiger Fotografen, die viele Bilder auf ihrer Webseite präsentieren, gibt es jetzt die Option, selbst zu entscheiden, ob die Bilder ans Ende angefügt werden oder doch lieber an den Anfang. Diese Option findest du rechts oben (1) in Form von zwei Icons. Das linke Icon bedeutet, dass alle neuen Bilder an den Anfang angehängt werden. Das rechte Icon platziert alle Bilder wie bisher an das Ende. Grün bedeutet, dass ein Icon aktiv ist.

 

Die Darstellung aller Bilder ist jetzt ebenfalls optimiert. Wenn du den Dialog öffnest, ist stets die Tabellenansicht aktiviert. Du erkennst es daran, dass das entsprechende Icon (4) grün ist. Der Grund, warum wir die Tabellenansicht stets zuerst öffnen, ist ganz einfach. So sieht man vor allem als Newcomer sofort, dass man für jedes Bild eine Bildunterschrift einfügen kann. Außerdem erkennt man gleich die neue Funktion, dass sich nun auch Bilder verlinken lassen. In den anderen beiden Ansichten sieht man nur die Bilder: quadratisch als Vorschau und angeordnet als Gitter. Entweder große Bilder oder kleine Bilder.

 

Wie bisher kannst du Bilder bequem mit der Maus bewegen und ihre Reihenfolge ändern: dazu in der Tabelle einfach eine Zeile anfassen und nach oben oder unten ziehen. In der Gitteransicht einfach das Vorschaubild anfassen.

 

 

Verlinkung von Bildern

 

Rechts neben jedem Bild befinden sich das blaue Symbol einer Kette und daneben ein hellblaues Symbol einer durchtrennten Kette. Diese Icons stehen für die Verlinkung eines Bildes. Klickst du auf das blaue Symbol der intakten Kette, dann öffnet sich das Fenster, mit dem du Links anlegen kannst. Sobald du einen Link gewählt hast, also eine interne Seite, eine externe Seite oder eine E-Mailadresse, und speicherst, färbt sich das Symbol grün (6). Gleichzeitig wird das Icon, um den Link wieder zu löschen, blau. Klickst du darauf, löschst du die Verlinkung. Durch die Farben siehst du sofort, welche Bilder verlinkt sind. In diesem Beispiel sind es das zweite und das letzte Bild, da nur hier das Kettensymbol grün erscheint. Wenn ein Bild in einer Galerie verlinkt ist, dann führt ein Klick auf das Bild natürlich nicht mehr dazu, dass das Original angezeigt wird, sondern dass der Link aufgerufen wird.

 

 

Sortierung der Bilder

 

Die Sortierung für Bilder haben wir gleichfalls überarbeitet. Die Icons dafür findest du links über den Bildern (3). Ein Klick auf ein Icon sortiert die Bilder einmalig. Daher bleibt die Farbe dieser Icons andauernd blau. Sortierst du die Bilder zum Beispiel mit dem ersten Icon nach Namen, und zwar von A bis Z, werden alle Bilder sortiert. Wenn du jetzt neue Bilder hinzufügst, werden diese an den Anfang oder das Ende angefügt, aber ohne einsortiert zu werden. Wenn du Bilder manuell verschiebst, änderst du natürlich gleichzeitig die Reihenfolge und es wäre sicher unerwünscht, wenn das System diese manuelle Veränderung jedes Mal sofort rückgängig macht, weil eine automatische Sortierung aktiv ist. Fügst du also Bilder hinzu oder verschiebst Bilder manuell, möchtest dann aber eine Sortierung durchführen, musst du auf eines der 4 Symbole klicken.

 

Die Funktionen sind ganz einfach.

Das erste Symbol sortiert alphabetisch von A bis Z.

Das zweite Symbol sortiert ebenfalls alphabetisch aber von Z bis A, das heißt umgekehrt.

Das dritte Symbol kehrt die aktuelle Sortierung einfach nur um. Klickst du zweimal auf das Symbol, ist der Urzustand wieder hergestellt.

Das vierte Symbol sortiert nicht wirklich, sondern ordnet die Bilder zufällig an. Jedes Mal wenn du auf dieses Symbol klickst, werden die Bilder völlig zufällig neu angeordnet.

 

Wenn du all deine geplanten Operationen durchgeführt hast – also neue Bilder einfügen, Bilder löschen, Links setzten, sortieren oder was auch immer – dann musst du zwingend auf ‚Übernehmen‘ klicken, um deine Arbeit zu speichern. Klickst du auf ‚Abbrechen‘, gehen alle Änderungen verloren. Wenn du auf ‚Übernehmen‘ klickst, wird der Dialog geschlossen und du bist wieder in der Galerie. Hier musst du ebenfalls zwingend auf ‚Speichern‘ klicken. Ansonsten gehen alle Änderungen verloren. 

 

Mit diesem Update wird demnach ein weiterer Teil von page4 auf ‚Fullscreen Dialoge‘ umgestellt und auf die neue, moderne Optik. Parallel dazu überarbeiten wir die Technik. Daher sollte der neue Dialog insgesamt schneller und besser arbeiten als die alte Bildauswahl. Das gilt insbesondere dann, wenn du viele Bilder nutzt und deine Galerien sehr umfangreich sind.

 

Ein Hinweis noch zur Verlinkung: Nicht alle Galerietypen unterstützen die Verlinkung von Bildern. Wenn du also Links anlegst und beim Klicken auf das verlinkte Bild öffnet sich weiter das Original, ohne dass der Link aufgerufen wird, dann liegt kein Fehler vor, sondern die von dir benutzte Galerie unterstützt die Verlinkungsfunktion nicht. Probiere dann bitte eine andere Galerieart aus.

 

Wir hoffen, das Update kann einige eurer User-Wünsche erfüllen!

 

Wenn ihr zufrieden seid, dann empfehlt uns doch bitte: Freunden, Kollegen, Verwandten, Bekannten etc.

 

Wir arbeiten jetzt weiter unsere „Liste“ ab, damit wir bald ein neues Update präsentieren können. Habt ihr Wünsche oder Verbesserungsvorschläge? Dann immer her damit! Wir hören auf euch.

 

Gruß, Manfred F. Schreyer

und das gesamte Team

Alles Logo?!

Tags: Updatepage4LogoDesign | Kommentare: 4 | Views: 22195

Dienstag 16.Mai 2017

 

blog-1002-logo

 

Ab heute kannst du dein Logo perfekt in deine Webseite einbauen

 

Vor einiger Zeit haben wir daran gearbeitet, branchenspezifische Designvorlagen zu erstellen, und dabei tauchte die Frage auf, wie wir Musterlogos möglichst benutzerfreundlich in Homepageseiten einbinden könnten.

 

Daher haben wir beschlossen, einen neuen Bereich im Design-Editor einzurichten, mit dem du zukünftig ganz einfach und schnell ein Logo auf deiner Homepage platzieren kannst. Das Einzige, was du beachten musst, ist die Tatsache, dass das Logo damit zum Design gehört, das heißt, zu den grundsätzlich für alle Seiten deiner Homepage gehörenden Gestaltungselementen: Es ist am Ende auf jeder deiner Seiten zu sehen. Wenn du also ein neues Design auswählst, was selten vorkommt, dann wird ein im alten Design von dir platziertes Logo überschrieben. Wir sind sicher, das stört normalerweise nicht und in wenigen Sekunden ist das gewünschte Logo wieder eingebunden. 

 

Wir erklären dir nachfolgend, wie das funktioniert. (Mit dieser neuen Optionen können wir nun auch weiter an den geplanten Branchenvorlagen arbeiten und hoffen, sie schon bald vorstellen zu können.) Vorab folgen jetzt noch Infos zu einigen Änderungen, die wir bereits letzte Woche vorgenommen haben.

 

 

Neue Technik für die Design-Vorlagen

 

Parallel zu der Logo-Funktion haben wir letzte Woche die Technik, mit der deine Webseite dargestellt wird, überarbeitet und insgesamt auf sogenannte „Flexboxen“ umgestellt, eine sehr moderne und schnelle Layouttechnik. Am Aussehen deiner Webseite hat sich dadurch nichts geändert. Wir konnten aber sehr viel Code entfernen und dadurch deine Homepage bzw. page4 noch schneller machen. Mit diesen Flexboxen lassen sich ab jetzt neue Strukturen und Funktionen einfacher umsetzen. 

 

 

Vorschau von eingebundenen Videos

 

Ab sofort wird bei jedem Video ein Bild als Vorschau geladen. Das hat mehrere Vorteile. Zum einen funktioniert diese Form der Darstellung extrem schnell, was besonders wichtig ist, wenn eine Homepage viele Videos präsentiert. Zum anderen kann man die Vorschau jetzt auch im Admin-Modus sehen und, wenn man auf das Video klickt, auch im Admin-Modus abspielen.

 

 

Zum neuen Bereich für Logos

 

Wenn du auf „Design bearbeiten“ klickst, gibt es jetzt oben einen neuen Menüpunkt „Logo“ (1), so ähnlich wie es auch einen Punkt „Hintergrund“ gibt. Klickst du darauf, öffnet sich der dazugehörige Dialog und zeigt dir alle Optionen für die Darstellung von Logos.

 

design-logo-bereich

 

Dazu musst du Folgendes wissen:

 

  1. Es kann pro Webseite nur ein (1) Logo eingebunden werden. Du solltest es vorzugsweise als durchsichtiges (transparentes) PNG hochladen, insbesondere, wenn dein Logo eine geometrische Form besitzt, also als Kreis, Rechteck oder beispielsweise als Textband gestaltet ist. Du kannst natürlich auch JPG Bilder hochladen, die dann rechteckig angezeigt werden. Wir haben bei diesem Tool bewusst alles weggelassen, was seine Bedienung kompliziert macht und denken, wenn du ein Logo einbinden möchtest, dann weißt du selbst am besten, in welchem Format du es darstellen willst.

  2. Ein Logo kann folgende Plätze (2) einnehmen:
    1. In der horizontalen Navigation kann es links oder rechts von der Navigation platziert werden. Die Höhe des Logos bestimmt dabei, wie hoch der Navigationsbereich wird. Das Logo ist immer vertikal mittig zur Navigation angeordnet.
    2. Bei einer Navigation in der Sidebar liegt das Logo immer über der Navigation und stets zentriert.
    3. Du kannst dein Logo auch in einem der drei Header unterbringen. In einem Header lässt es sich wie ein normales Hintergrundbild platzieren, also zum Beispiel mittig oder links oben. Der Dialog dazu ist derselbe wie bei einem Hintergrundbild.

  3. Ein Logo hat immer eine Mindestbreite (3) von 50 px. Die Höhe wird stets entsprechend der Breite angepasst. Änderst du den Platz des Logos, also vom Header in die Sidebar Navigation, passt sich eventuell die maximale Breite an, denn eine Sidebar kann nur eine bestimmte maximale Breite einnehmen. Wechselst du danach erneut den Platz, also zurück zum Header, dann lässt sich die Breite wieder auf einen größeren Wert stellen. Die vorher eingestellten Werte gehen dabei eventuell verloren.

  4. Ein Logo kann einen Abstand (4) haben. Bei einer Platzierung in einer horizontalen Navigation wird der Abstand an allen Seiten, also oben, unten, links und rechts eingefügt und beeinflusst so die Positionierung. Passt die Navigation nach Einfügen des Logos nicht mehr in den restlichen verfügbaren Platz, wird automatisch ein Umbruch eingefügt.

    Ist das Logo in der Sidebar platziert, wird der Abstand ebenfalls an allen Seiten eingefügt. Das Logo ist immer mittig zur Sidebar ausgerichtet. Der eingefügte Abstand beeinflusst in der Sidebar unter Umständen die Größe des Logos, da die Sidebar eine feste Breite hat.

    Ist das Logo im Header platziert, dann beeinflusst die Positionierung des Logos den Abstand. Wenn du das Logo mittig präsentierst, wirkt der Abstandsregler nicht, was bedeutet, dass das Logo mittig bleibt, egal, welchen Abstand du einstellst. Ist das Logo links platziert, dann veränderst du mit dem Regler den Abstand links vom Logo; bei rechter Platzierung wird der Abstand rechts verändert. Liegt das Logo oben, wird der Abstand nach oben verändert und wenn es unten steht, kannst du den Abstand nach unten beeinflussen.

 

Du kannst es aus der Verwaltung einladen oder aus unserem Archiv zum Beispiel eines der Dekorationsbilder benutzen, falls du kein eigenes Logo besitzt und eines unserer Symbole verwenden willst. Und natürlich kannst du direkt dein Logo hochladen und es gleich verwenden.

 

Neue Bedienelemente

 

Wie du sehen kannst, bietet page4 erstmals ein neues Bedienelement, einen Slider kombiniert mit einem  Eingabefeld. Du kannst also die Breite deines Logos und auch den Abstand stufenlos mit dem Slider einstellen und live die Größenänderung beobachten oder, wenn es dir lieber ist, konkrete Werte eingeben. Beide Elemente ändern sich automatisch. Wir planen, solche Elemente zukünftig auch dort bei den Inhalten zu verwenden, wo es Sinn macht.

 

Natürlich passen sich die Logos automatisch an mobile Ansichten an. 

 

So, nun viel Spaß damit, das eigene Logo professionell zu präsentieren. Natürlich bleibt die Option, Inhalte frei auf einem Header zu positionieren, weiterhin erhalten.

 

Übrigens: Die Datenbanken für die Erweiterung, später auch eine Headline im Header zu positionieren, haben wir bereits vorbereitet. Die Umsetzung wird noch etwas dauern, da wir in diesem Zusammenhang einige andere Bereiche umbauen wollen, denn die Gestaltung der Headline im Header ist eine Sache des Designs und dazu müssen wir zum Beispiel die Designschriften erweitern.

 

Diesbezüglich  noch ein Hinweis: Vielleicht habt ihr es bemerkt, dass die Schrift für Fließtext jetzt nach oben gerückt ist und die Vorschau rechts eine Scrollbar hat, damit auch bei großen Überschriften alles sichtbar gemacht werden kann. Wenn du alle Schriftauswahlen für die Überschriften löschst, wird nun automatisch für alle Überschriften die Einstellung vom Fließtext genommen. Möchtest du also nur eine Schriftfamilie verwenden, dann kannst du das jetzt viel schneller und bequemer einstellen.

 

Wie immer freuen wir uns über Kommentare, Anregungen und natürlich auch über Lob, das Brot eines jeden Künstlers. Ich finde, die Arbeit unserer Entwickler gleicht manchmal der Arbeit von  Künstlern: Wir skizzieren eine Idee und formen sie so lange um, bis daraus ein kleines Kunstwerk entsteht, welches dann hoffentlich euch und uns viel Freude bereitet.

 

Bis demnächst - mit noch mehr Geistesblitzen aus unserer Ideenkiste


Manfred und das ganze page4-Team

Klicken und bearbeiten

Tags: Updatepage4FunktionenContent | Kommentare: 5 | Views: 19141

Dienstag 18.April 2017

blog-134

 

Zusätzliche Bearbeitungsoption für Texte

 
Einfach in einen Text klicken und ihn dann direkt bearbeiten. Hört sich gut an. Wie immer steckt der Teufel im Detail. Wir haben lange überlegt, wie wir auf der einen Seite die Bedienung vereinfachen können und auf der anderen Seite weiterhin die Optionen zur Verfügung stellen, die page4 so einzigartig machen. Es gibt viele Möglichkeiten, solche Funktionen einzubauen. Wir haben uns verschiedene Systeme angesehen und die jeweiligen Vor- und Nachteile verglichen. Und uns dann entschlossen, einen eigenen Weg zu gehen.
 
Einen ersten Vorgeschmack diesbezüglich haben wir ja bereits mit dem „Abstandselement“ geliefert. Da bei diesem Element lediglich die Höhe eingegeben werden muss, haben wir auf einen Dialog verzichtet und nach dem Anlegen kann man mit der Maus einfach die Höhe bestimmen. Das geht schnell und intuitiv. Es spart Zeit und macht Spaß.
 
Im „Streifen-Content“ haben wir diese Technik mit einem Dialog kombiniert. Um den Streifen zu konfigurieren, klickt man wie bisher auf den Bearbeitungsstift und kann dann im Dialog bequem alle Einstellungen vornehmen. Gleichzeitig erscheint ein Anfasser, wenn man die Maus in das Element bewegt. Diesen Anfasser kann man benutzen, um die Höhe des Streifens zu bestimmen. So kann man sehr leicht und in Echtzeit den Streifen auf der Seite anpassen und hat weiterhin den Dialog für alle Optionen zur Verfügung.
 
Mit dem heutigen Update erweitern wir die wichtigen Inhalte "Überschrift" und "Text" mit einer neuen Funktion.
 

 

Überschriften bearbeiten

 

Ab sofort kann man, wenn man eingeloggt ist, mit der Maus in eine Überschrift klicken und diese dann live direkt bearbeiten. Also einfach klicken und schreiben. Sobald man den Abschnitt verlässt, werden die vorgenommenen Änderungen gespeichert. Beim Speichern wird oben im Fenster kurz durch ein entsprechender Hinweis eingeblendet. Das geschieht quasi in Echtzeit. Um die Überschrift zu gestalten, klickt man wie gewohnt auf den Stift und kann dann dort im Dialog die hinterlegten Formate H1 bis H4 auswählen und außerdem festlegen, wie die Überschrift ausgerichtet werden soll. Für die neue Funktion haben wir die Ansicht leerer Überschriften verändert. Ab sofort wird eine leere Überschrift mit einem Text in der jeweiligen Formatierung angezeigt. Damit man sofort sieht, dass es sich um ein leeres Element handelt, wird die jeweilige Schriftfarbe transparent angezeigt. Leere Überschriften sind nur im Admin-Modus sichtbar. Diese Änderung ermöglicht es, dass du ganz einfach eine neue Überschrift von der Palette auf die Seite ziehen kannst und dann sofort in diese leere Überschrift klickst, um deinen Text einzugeben.
 
Kleiner Tipp: Möchtest du eine zweizeilige Überschrift und selbst bestimmen, wo die neue Zeile beginnt, dann kannst du einen sogenannten weichen Zeilenumbruch verwenden. Halte dabei die Umschalttaste für Großbuchstaben gedrückt und klicke dann auf die Returntaste, also die Zeilenumbruchtaste.
 

 

Texte bearbeiten


Für Texte haben wir die gleiche Technik eingebaut. Ein leerer Textabschnitt wird jetzt auch mit einem "Mustertext" angezeigt, und wenn du in den Text klickst, kannst du den Inhalt direkt bearbeiten. Beim Text kannst du ganz normale Zeilenumbrüche verwenden. Dabei entstehen dann "richtige" Absätze, die im Dialog mit den Absatzformaten belegt werden können. Verwendest du einen "weichen" Zeilenumbruch wie oben beschrieben, entsteht zwar eine neue Zeile, aber kein neuer Absatz. Also genauso, wie du es auch im Editor gewohnt bist, wenn du den Dialog öffnest.
 
Hast du im Text eine Tabelle eingefügt, kannst du die Tabelle auch direkt dort bearbeiten und Text hinzufügen. Du klickst dazu einfach in die jeweilige Zelle und schreibst dann deinen Text sofort hinein. Mit den Pfeiltasten kannst du in die nächste Zelle "springen", sofern sich der Cursor am Ende des Textes befindet. Das funktioniert in alle Richtungen.
 
Hast du eine Liste bzw. Aufzählung eingefügt, kannst du diese natürlich auch bearbeiten. Bei Listen spielen "weiche" Zeilenumbrüche - wie oben beschrieben - eine große Rolle. Mit einem normalen Zeilenumbruch erzeugst du einen neuen Listeneintrag. Mit einem weichen Zeilenumbruch bleibst du im gleichen Eintrag und es wird nur eine neue Zeile angefangen. Auch diese Funktion ist identisch mit der bisherigen Funktion direkt im Dialog.
 
Bilder im Text
Es gibt aktuell zwei Möglichkeiten, Bilder in einen Text einzufügen. Entweder nutzt du die von uns zur Verfügung gestellte Option, links oder rechts ein Bild einzufügen. Oder du nutzt die vom Texteditor im Menü zur Verfügung gestellte Möglichkeit, Bilder einzufügen. Auf die vom Editor bereitgestellte Option, Bilder einzufügen, haben wir keinen direkten Einfluss. Solche Bilder können im neuen Direkt-Editor angefasst und vergrößert und verkleinert sowie verschoben werden. Dabei ist das Verschieben sehr eingeschränkt, weil das Bild im Textfluss verankert wird und man keine Möglichkeiten der Kontrolle hat. Bilder, die über die von uns zur Verfügung gestellte Funktion eingebunden werden, können aktuell nicht direkt bearbeitet werden. Das ist aber zu einem späteren Zeitpunkt vorgesehen.
 


Was du wissen solltest


Die neue Funktion ermöglicht es euch, in einen Text zu klicken und dann sofort den Text zu bearbeiten. Das bedeutet aber logischerweise, dass eingebaute Verlinkungen im Admin Modus nicht mehr aufgerufen werden können. Klickst du auf einen Link in deinem Text, dann wird der Cursor angezeigt und du kannst den Text bearbeiten, aber nicht den Link aufrufen. Um einen Link zu testen, musst du deine Seite ab sofort im ausgeloggten Zustand betrachten. Das kannst du in einem weiteren Browserfenster oder einem zusätzlichen Browser ganz leicht machen. Es gibt aktuell keine technische Möglichkeit, das anders zu realisieren, es sei denn, wir hätten zum Aufrufen der Editierfunktion spezielle Tastenkombinationen verwendet. Damit behindert man aber die leichte und schnelle Bedienung.
 

 

Einige kleine Tipps


Du kannst, wenn du dich im editierten Text befindest, mit den Standardfunktionen deines Computers ausgewählte Texte formatieren. Mit der Tastenkombination STRG & B machst du den Text fett, mit STRG & I stellst du ihn kursiv. Bei einem Mac nimmst du anstelle der STRG Taste die Befehls-Taste. Diese vom System zur Verfügung gestellte Funktion ist cool, denn du kannst damit ganz bequem und easy einzelne Textstellen formatieren. Einfach klicken, selektieren und die Tastenkombination anwenden. Fertig. Die Standardfunktionen um Texte zu formatieren sind für Überschriften deaktiviert.
 

 

Unterschiede zu anderen Systemen

 

Wir verzichten bewusst darauf, im Direktmodus zusätzliche Menüs anzuzeigen, um damit Optionen auszuwählen, mit denen man Überschriften und Texte formatieren kann. Solche Menüs lenken unserer Meinung nach ab und überfrachten die Direktbearbeitung. Es ist aus unserer Sicht viel besser, den Bearbeitungsstift zu nutzen und den Dialog aufzurufen, wenn man eine Überschrift oder einen Text formatieren will. Bei allen von uns getesteten Systemen hat uns ein zusätzliches Menü nicht überzeugt. Die Mitbewerber gehen hauptsächlich so vor, weil sie keine eigenen Dialoge anbieten. Dann macht es durchaus Sinn. Unser Ziel ist es aber, euch weiterhin die vielfältigen Optionen anzubieten, die man nur mit Dialogen einbauen kann und die direkte Bearbeitung von Texten als Option zur Verfügung zu stellen, um schnelle Korrekturen usw. zu erleichtern.
 

 

Ausblick


Wir werden jetzt nach und nach überall dort, wo es sinnvoll ist, eine direkte Bearbeitung einbauen. Bei manchen Inhalten geht das relativ leicht. Bei anderen ist das nur schwer oder gar nicht möglich. Die nächste Funktion, die wir in diesem Zusammenhang neu gestalten, ist die Bearbeitung von Bildern. Wir haben dazu bereits gute Ideen, müssen aber vor der Konkretisierung dieser Pläne noch einige andere, schon länger geplante Umbauten vornehmen.

Außerdem haben wir einige neue Contents in Arbeit, die bald in die Testphase gehen. Bis demnächst also.
 
Manfred F. Schreyer
page4 Ltd.

 

Umstellung auf SSL

Tags: VorankündigungUpdateTechnikSSLpage4 | Kommentare: 0 | Views: 13265

Mittwoch 12.April 2017

blog-359

 

SSL FAQ

 

Wenn ihr euch innerhalb der letzten Wochen zum Bearbeiten eurer Webseite angemeldet habt, ist euch wahrscheinlich aufgefallen, dass der Bearbeitungsmodus via HTTPS/SSL aufgerufen wird. Diesen Schritt haben wir bereits vollzogen, weil alle aktuellen Browser inzwischen eine Sicherheitswarnung herausgeben, wenn ein Formular ohne SSL aufgerufen wird. Gleichzeitig konnten wir mit dieser Umstellung einige Tests durchführen, um die SSL-Umstellung bei page4 auf Herz und Nieren zu prüfen.

 

Die Testphase ist jetzt abgeschlossen und wir haben alles vorbereitet, um in Kürze SSL dauerhaft auch für die Besucher eurer Webseiten zu aktivieren. Deshalb möchten wir euch einmal die wichtigsten Aspekte dieser Umstellung näherbringen und erläutern.

 

 

Was ist HTTPS/SSL und welchen Vorteil habe ich davon?

 

Sicherheit im Internet ist wichtiger denn je und die Verschlüsselung des Datentransfers von und zu Webseiten trägt dazu erheblich bei. Webseiten, die über HTTPS (2) aufgerufen werden, sind mit einer "Punkt zu Punkt" Verschlüsselung gesichert und gewährleisten einen sicheren Datentransfer vom Server, wo die Daten für die Webseite liegen, bis zum Browser des jeweiligen Besuchers deiner Webseite. Dies zeigt der Browser meist mit einem grünen Schloss (1) in der Browserzeile an.

 

ssl

 

Eine Verschlüsselung der Daten über SSL erhöht das Sicherheitsniveau eurer Webseiten und wird von Suchmaschinen immer mehr als positiv bewertet. Besucher eurer Webseite sehen, dass eingegebene Daten, wie z. B. in ein Kontaktformular, auf die gleiche Art und Weise gesichert sind, wie sie es von Shops kennen. Dies sorgt dafür, dass Vertrauen aufgebaut wird. Es ist also eine grundsätzliche gute Sache, dass immer mehr Webseiten und jetzt auch alle mit page4 erstellten Webseiten SSL verwenden.

 

 

Was muss ich beachten, um HTTPS nutzen zu können?


Um alle technischen Aspekte haben wir uns gekümmert. Um eine effektive Verschlüsselung der Webseite zu garantieren, müsst ihr darauf achten, dass alle Bestandteile, die auf eurer Webseite eingebunden sind, via HTTPS geladen werden. Unser System übernimmt dies automatisch für alle Bilder, Galerien und andere Inhalte, die direkt von uns kommen.

 

Für Skripte (oder andere Inhalte wie z. B. Bilder) von Drittanbietern, die in einem HTML-Inhalt eingebunden werden, können wir dies leider nicht automatisch garantieren. Alle diese Inhalte müssen HTTPS unterstützen und auch direkt mit "https://" oder "//" eingebunden sein.

 

Falls ihr euch nicht sicher seid, ob eure eingebundenen Skripte/Widgets HTTPS unterstützen, ruft eure Seite einfach einmal via https:// auf. Wird der Inhalt angezeigt, dann ist alles in Ordnung. Falls nicht, müsst ihr beim Anbieter des Skriptes anfragen, ob eine SSL-Version verfügbar ist. Keine Sorge, fast jeder größere Anbieter bietet mittlerweile HTTPS an und ihr solltet da keine Probleme bekommen. Das Gleiche gilt für Bilder, die ihr direkt von externen Webseiten verlinkt. Diese müssen auch via HTTPS eingebunden werden.

 

 

Aktuell kann man die Webseiten sowohl via HTTP als auch via HTTPS erreichen - wird sich daran etwas ändern?


Kostenlose Webseiten:
Alle Aufrufe von kostenlosen Seiten werden ab dem 02.05.2017 (Übergangszeit für euch, um externe HTML-Elemente zu aktualisieren) automatisch auf die SSL-Version umgeleitet.

Webseiten mit eigenen Domains:
Die Umstellung erfolgt hier auch am 02.05.2017, jedoch mit einem Unterschied. Wir sind uns bewusst, dass einige von euch evtl. externe Skripte/Bilder nutzen, die leider nicht mit SSL kompatibel sind, daher haben wir uns dazu entschlossen, euch die Möglichkeit zu geben, die Weiterleitung auf SSL auf eigenen Wunsch ggf. zu deaktivieren. Prüft bitte, ob eure Seite zu eurer Zufriedenheit mit SSL funktioniert und falls nicht, schreibt uns einfach eine Mail und wir deaktivieren die Weiterleitung für euch.

 

 

Welche Zertifikate verwendet ihr für die Verschlüsselung?

 

Alle kostenlosen Webseiten bzw. die "meinname.page4.com" Adressen sind über ein sogenanntes Wildcard-Zertifikat (*.page4.com) erreichbar, welches auch unsere Firmenwebseiten schützt.

 

Für eure eigenen Domains generieren wir für jede Webseite ein eigenes SSL-Zertifikat von Let's Encrypt. Dies ist vollständig kostenfrei für euch und wir erledigen automatisch alles Nötige. Weitergehende Informationen (leider aktuell nur auf Englisch) unter https://letsencrypt.org/how-it-works/



Für Nachfragen stehen wir euch natürlich wie immer per Mail oder direkt hier per Kommentar zur Verfügung.

 

Schöne Grüße

Manfred F. Schreyer

page4 Support-Team

Wichtige Info

Tags: Wartungupdatepage4 | Kommentare: 9 | Views: 10514

Freitag 17.März 2017

astronaut

 

Wartungsarbeiten für SSL

 

Liebe page4 user

 

am Montag, den 20.3.2017 werden wir von 5 bis 7 Uhr morgens wichtige Arbeiten an unserer Serverstruktur vornehmen. Dies ist notwendig, damit wir in Kürze alle Webseiten auf SSL umstellen können. Während der Wartungsarbeiten kann es vorkommen, dass ihr eure Webseite für einige Minuten nicht bearbeiten könnt. Solltet ihr in dieser Zeit online und eingeloggt sein, führt das dann dazu, dass ihr ausgeloggt werdet. Nicht gespeicherter Text würde in diesem Fall dann verloren gehen. Wir bitten daher, wenn möglich, in diesem Zeitraum keine größeren Arbeiten vorzunehmen und hoffen auf euer Verständnis.

 

Sobald SSL angeschaltet ist, wird es von Seiten der aktuelle Browser auch keine Warnmeldungen mehr geben. Falls ihr Inhalte auf eurer Seite habt, die nicht mit SSL funktionieren - das betrifft nur externe Scripts, die ihr über den HTML Content eingebunden habt - dann solltet ihr diese Inhalte umgehend aktualisieren.

 

Mehr Infos, sobald wir alles fertig haben und ihr eure Seiten dann über SSL aufrufen könnt.

 

Ein schönes Wochenende und bis bald

 

Manfred F. Schreyer

page4 Ltd.

 

Unsere neue Designverwaltung

Tags: Updatepage4FunktionenDesign | Kommentare: 5 | Views: 2419

Montag 19.Dezember 2016

 

Neu und einzigartig!

 

Mit dem heutigen Update gehen wir einen weiteren Schritt in Richtung "Design Webbaukasten". Kein mir bekanntes System bietet im Designbereich die Möglichkeiten, die page4 hat. Und kein Hompagebaukasten hat eine Design-Verwaltung. Ab heute ist das anders. Als erstes und meines Wissens nach einziges System hat page4 nun einen Bereich, in dem ihr Designvorlagen ablegen, kopieren, konvertieren und vor allem im Hintergrund bearbeiten könnt. Um die wichtigsten Funktionen einmal in einem Satz vorzustellen. Was genau für Vorteile die Verwaltung für Designvorlagen hat und was man damit anfangen kann, zeige ich euch gleich.

 

Wichtig ist, diese Funktion steht nur Kaufversionen zur Verfügung. Kostenlose Versionen haben keine Designverwaltung und können die daraus resultierenden Vorteile auch nicht nutzen. Wir bitten dafür um Verständnis. Wir finanzieren uns nur über unsere Kaufversionen. Wer page4 liebt und bisher nur eine kostenlose Version hat, sollte vielleicht mal über ein Upgrade nachdenken.

 

Schon ab 16,5 Cent pro Tag bekommt ihr fantastische Funktionen und gleichzeitig hilft ihr uns dabei, page4 noch besser zu machen. Oder anders ausgedrückt, page4 kostet in der Lightversion nur 5 Euro im Monat inkl. eigener Domain und, unter anderem, der einzigartigen Designverwaltung.

 

Aber nun genug Eigenwerbung. Lasst mich euch zeigen, was unser Entwicklerteam auf den Weg gebracht hat.

 

Die Designverwaltung

 

Du findest diese Verwaltung (2) zukünftig als erstes im Menü "Design" (1), noch über dem Punkt "Design auswählen oder bearbeiten". Wer eine Kaufversion hat, der kennt das Diskettensymbol bereits. Bisher konnte man über diesen Eintrag nur das aktuelle Design abspeichern. Jetzt findet ihr darunter die neue Designverwaltung.

 

 

Sobald du auf den Punkt "Designverwaltung" (2) klickst, öffnet sich der Dialog der Designverwaltung. Wir haben diesen Dialog ähnlich gestaltet wie in unserem Blogmodul. Zum einen hast du dann sehr viel Platz. Und zum anderen können wir den Dialog sehr leicht erweitern und wir planen, noch einige Ideen für die Designverwaltung umzusetzen.

 

 

Folgende Möglichkeiten stehen dir aktuell in der Designverwaltung zur Verfügung:

 

1) Eigene Designs = Nehmen wir an, du hast noch nie ein Design abgespeichert und öffnest die Designverwaltung und du hast immer nur unsere neuen editierbaren Vorlagen genutzt bzw. dein aktuelles Design ist so eine Vorlage. Dann hast du nur den Bereich "Eigene Designs" und dort findest du dann nur das aktuell von dir verwendete Design, grün unterlegt und rechts als "Aktives Hauptdesign" (4) bezeichnet. Das aktive Hauptdesign ist immer das Design, mit dem deine Webseite aktuell deinen Besuchern gezeigt wird.

 

A) Klassik Ablage = Dieser Bereich ist nur sichtbar, wenn du aktuell ein altes Design benutzt oder in der Vergangenheit mindestens ein altes Design abgespeichert hast. Ansonsten ist dieser Bereich nicht sichtbar. Löscht du alle dort enthaltenden Vorlagen, wird die Ablage ebenfalls unsichtbar. Unten siehst du einen Auschnitt aus dieser Ablage.

 

 

Was kann man mit Designvorlagen machen, die in der Klassik Ablage gespeichert sind?

 

Konvertieren (1)

Du kannst eine alte Designvorlage jetzt einfach in der Ablage konvertieren. Klickst du auf "Konvertieren", dann erzeugt das System eine Kopie des Designs, konvertiert diese Vorlage in ein editierbares Design und legt dieses Design dann in die Ablage "Eigene Designs" ab. Im oberen Bild habe ich das konvertierte Design mit der Nummer (8) markiert. Du siehst, dass der Name automatisch angelegt wird. Vorne steht "Konvertiert:" und dahinter der Originalname. So siehst du sofort, woher dieses Design kommt. Diese Aktion wird komplett im Hintergrund ausgeführt. Bei Kaufversionen, die noch ein altes Design haben, haben wir daher im Hauptmenü "Design" den Menüpunkt "Konvertieren" entfernt. Damit konnte man zwar sein Design konvertieren, war aber gezwungen, mehr oder weniger live das Design umzubauen und sobald man auf speichern geklickt hat, war das neue Design online. Jetzt kann man komplett im Hintergrund seine alte Vorlage konvertieren und bearbeiten. Kostenlose Versionen haben weiterhin den Menüeintrag, da sie keine Designverwaltung haben.

 

Als aktives Hauptdesign setzen

Natürlich kannst du ein altes Design weiterhin benutzen und als aktiv setzen. Wir empfehlen dir aber dringend, auf eine neue Vorlage umzusteigen. Die alten Vorlagen sind nicht mehr zeitgemäß und vor allem für mobile Ansicht nicht optimiert.

 

Umbenennen

Du kannst alle gespeicherten Designvorlagen frei benennen. Das geht auch mit alten Designvorlagen.

 

Kopieren

Du kannst alle gespeicherten Designvorlagen kopieren und diese Funktion steht auch alten Vorlagen zur Verfügung.

 

Löschen

Solange das Design kein aktives Hauptdesign ist, kannst du es natürlich aus der Verwaltung löschen. Ein einmal gelöschtes Design kann nicht wieder hergestellt werden.

 

Wie du vielleicht bemerkt hast, kann man ein altes Klassik-Design nicht bearbeiten. Das geht deshalb nicht, weil die gesamte Struktur anders ist. Um ein Klassik-Design im Design-Editor zu bearbeiten, muss es konvertiert werden. Existiert ein Konverter, dann sieht das Ergebnis normalerweise fast genauso aus wie die Originalvorlage. Bei einigen alten Vorlagen gibt es keinen Konverter. Dann legen wir ein Basisdesign an. Allerdings bist du nicht mehr gezwungen, dein aktuelles altes Design zu konvertieren um auf ein neues Design umzusteigen. Du kannst in der Designverwaltung ein neues Design anlegen und dass dann in Ruhe im Hintergrund bearbeiten und wenn es fertig ist, als neues aktives Hauptdesign verwenden.

 

 

Was kann man mit der Ablage "Eigene Designs" machen?

 

Die nachfolgenden Zahlen beziehen sich auf das obere Bild (Eigene Designs).

 

Neues Design anlegen (2)

Wenn du diese Funktion benutzt, wird ein neues Design angelegt und zwar mit minimalen Einstellungen. Wir haben alle Elemente ausgeblendet und alle Bereiche auf neutral gesetzt, so dass wirklich ein "leeres" Design erzeugt wird. Der Vorteil besteht darin, dass du sofort anfangen kannst zu gestalten, ohne erst alle Werte "zu neutralisieren". Möchtest du mit einer von unseren Vorlagen starten, so kannst du natürlich jederzeit mit einem Klick eine Vorlage auswählen und das neutrale Design überschreiben.

 

Als aktives Hauptdesign setzen (6)

Wie auch in der Klassik Ablage musst du in der Lage sein, jede deiner gespeicherten Designvorlagen als aktives Hauptdesign zu setzen. Du fährst dazu mit der Maus über ein gespeichertes Design und klickst dann in der Werkzeugleiste auf "Als aktives Hauptdesign setzen". Dann passiert folgendes: Der Eintrag wird grün hinterlegt. Rechts oben wechselt die Info von "Nicht verwendet" zu "Aktives Hauptdesign". Einige Menüpunkte aus der Werkzeugleiste (wie der Papierkorb) werden ausgeblendet und sehr wichtig: Deine Webseite wird jetzt mit diesem Design angezeigt.

 

Umbenennen (5)

Das Umbenennen einer Designvorlage dient lediglich dazu, dir die Möglichkeit zu geben, deine Vorlagen mit Namen zu versehen, die dir die Verwaltung erleichtern. Ansonsten hat das Ändern der Bezeichnung keine Auswirkung. Alle Einträge werden alphabetisch sortiert. Die Namensänderung sorgt für eine Umsortierung.

 

Nicht verwendet (3)

Bis auf das aktive Hauptdesign bekommen alle gespeicherten Designvorlagen aktuell die Markierung "nicht verwendet". Nicht verwendete Designvorlagen können beliebig bearbeitet oder gelöscht werden, ohne dass deine Besucher etwas davon bemerken. Sobald die Designverwaltung in der Lage ist, einzelnen Seiten unterschiedliche Designvorlagen zuzuweisen kannst du anhand dieser Markierung sofort alle Designs erkennen, die nicht verwendet werden.

 

Einige Anmerkungen

 

Unter dem Punkt (B) siehst du den Hinweis, dass das aktive Hauptdesign auf 14 Seiten verwendet wird. Da es aktuell nur ein Design für alle Seiten gibt, wirst du beim aktiven Hauptdesign immer die Gesamtanzahl der Seiten deiner Homepage sehen. Sobald die Verwaltung in der Lage ist, Designvorlagen auf beliebige Seiten anzuwenden, bekommt diese Anzeige einen Sinn. Nehmen wir an, du hast 50 Seiten und verwendest für 3 Seiten ein zweites Design, dann ist das aktive Hauptdesign natürlich nur noch auf 47 Seiten aktiv. Bei dem zweiten Design steht dann "Auf 3 Seiten verwendet". Löscht du ein Design, welches von Seiten benutzt wird, dann wird wieder das Hauptdesign verwendet. Es wird also niemals passieren, dass Seiten kein Design haben. Aber diese Dinge musst du erst beachten, wenn wir die Verwaltung erweitert haben.

 

WICHTIG: Bisher ist es so: Du öffnest den Design-Editor und wählst ein anderes Design aus und speicherst es ab. In dem Moment ist das bisherige Design weg und wird durch das neue Design ersetzt. Es besteht keine Möglichkeit, dass alte Design wieder einzuladen. Wir müssten dazu ein Backup vom vorherigen Tag hochladen.

 

Mit der neuen Verwaltung verhält es sich ähnlich. Öffnest du direkt über das Menü den Design-Editor und wählst dann ein neues Design aus und speicherst es ab, überschreibst du das aktive Hauptdesign durch das neue Design. Und zwar auch in der Verwaltung.

 

Gehst du zuerst in die Verwaltung und bearbeitest von dort aus das aktive Hauptdesign und während der Bearbeitung wählst du ein neues Design und speicherst dann das Design ab, überschreibst du ebenfalls das bisherige Hauptdesign. Dieser Schritt kann nicht rückgängig gemacht werden. Wir empfehlen dir, dass aktuelle Hauptdesign einfach zu kopieren, bevor du es direkt bearbeitest. So kannst du im Zweifel immer wieder auf die Kopie zurückgreifen.

 

Im Moment bekommst du mit der Designverwaltung vor allem ein Werkzeug, um auf einfache Weise von einem alten Design auf eine neue Vorlage umzusteigen oder um beliebig viele Designvorlagen selbst zu erstellen und im Hintergrund zu gestalten. Sobald die Verwaltung in der Lage ist, Designvorlagen beliebigen Seiten zuzuweisen kannst du deine Homepage noch individueller gestalten. Die Möglichkeiten sind extrem vielfältig.

 

Hier eine kleine Auswahl an Ideen. Du kannst diese Ideen bereits jetzt vorbereiten und wenn die zusätzlichen Optionen online sind, mit einem Klick aktivieren.

 

1) Du möchtest auf einigen Seiten kein Hintergrundbild.

2) Du möchtest auf jeder Seite 10 andere Bilder im Hintergrund, im Header usw. als Slideshow.

3) Du möchtest einige Seiten ohne Sidebar oder mit zwei Sidebars.

4) Du möchtest auf einigen Seiten keinen Header haben.

5) Du möchtest auf einigen Seiten keinen Footer haben.

6) Du möchtest auf jeder Seite unterschiedliche Hintergrundbilder haben.

7) und vieles mehr.

 

Aus meiner Sicht ist dies Update eines der wichtigsten Updates der letzten 2 Jahre. Wer wirklich individuelle Webseiten gestalten will und keine Lust auf Wordpress und Co. hat und auch nicht selbst programmieren will, der bekommt jetzt mit page4 einzigartige Funktionen zur Gestaltung und das zu einem sehr guten Preis. Zusammen mit der neuen Seitenverwaltung, die eine enge Verbindung zum Designverwaltung haben wird, bietet das neue Update extrem viele Optionen und vor allem ermöglicht es allen Usern einer Kaufversion, die Gestaltungsarbeiten komplett unsichtbar im Hintergrund vorzunehmen. Das gibt es aktuell meines Wissens bei keinem einzigen Webbaukasten weltweit. Zumindest kenne ich kein System mit diesen Optionen.

 

Wir freuen uns wirklich, wenn ihr einen Kommentar hinterlässt und uns eure Meinung sagt. Vor allem sind wir an Ideen und Wünsche interessiert, denn wir entwickeln page4 für unsere User und neue Funktionen machen nur Sinn, wenn sie für Kunden und User einen Mehrwert bieten.

 

Viel Spaß beim Gestalten und Ausprobieren und nochmal: Wer jetzt noch eine alte Designvorlage nutzt sollte die Gelegenheit ergreifen und umsteigen. So einfach war es noch nie.

 

Bis demnächst

Manfred F. Schreyer

page4 - der Design Webbaukasten

 

 

 

PS: Du hast noch keine page4 Webseite? Dann nutze jetzt unser Weihnachtsangebot und spare im ersten Jahr richtig Geld.

 

 

PPS: Nicht vergessen, hinterlasse einen Kommentar (hier oder auf unserer Facebook Seite) und die Adresse deiner Webseite und du hast die Chance, eine Premiumversion dauerhaft kostenlos zu nutzen. Es lohnt sich.

Tipp 11: Einfach mal kopieren

Tags: UpdateTippspage4Funktionen | Kommentare: 4 | Views: 1559

Freitag 16.Dezember 2016

 

Kopieren geht schneller

 

Warum etwas erneut machen, wenn es bereits fertig ist und nur noch angepasst werden muss? Einfach kopieren und bearbeiten geht viel schneller. Insbesondere, wenn es sich um ganze Seiten einer Homepage handelt. So eine Seite besteht ja nicht nur aus Inhalten. Es steckt auch jede Menge Gestaltungsarbeit dahinter. Man muss die Abstände optimieren, Spalten anlegen und vieles mehr. Wenn die Seite perfekt ist, eignet sie sich vielleicht als Vorlage für eine neue Seite, die nur andere Inhalte bekommt.

 

Mit page4 ist es sehr leicht, Seiten zu kopieren, Inhalte zu kopieren und dabei viel Zeit zu sparen. Dazu haben wir heute einige Tipps und Anregungen und einen Ausblick auf die Zukunft für euch.

 

 

Seiten kopieren

 

Seiten werden bei page4 im Seitenmanager verwaltet. Diese Verwaltung findest du, indem du ganz oben im Hauptmenü auf den Punkt "Seiten" klickst. Es öffnet sich der nachfolgende Dialog. In diesem Dialog sind alle Seiten aufgelistet, die deine Homepage hat. Seiten können Inhalte enthalten, mit einem Namen in der Navigation angezeigt werden, damit man sich als Besucher die Seite ansehen kann und letztlich enthalten Seiten alle Informationen darüber, was passieren soll, wenn die Seite in der Navigation angeklickt wird.

 

In der Seitenverwaltung, wie der Seitenmanager zukünftig genannt wird, bearbeitest du nicht die Inhalte, die auf der Seite sind, sondern nur Dinge, welche die Seite als Ganzes betreffen. Dazu gehört neben dem Namen der Seite auch die Möglichkeit, eine Seite zu kopieren. Das geht ganz leicht. Nachfolgend zeigen wir dir den aktuellen Dialog vom Seitenmanager, so wie du ihn kennst. Und wir zeigen dir einen Ausblick, wie der Seitenmanager im kommenden Jahr aussehen wird, sobald wir alle Arbeiten daran abgeschlossen haben.

 

 

Der aktuelle Seitenmanager

 

 

Der Seitenmanager (1) ist ein Vollscreen-Dialog und zeigt auf der linken Seite alle Seiten an, die es in deiner Homepage gibt. Daneben enthält der Seitenmanager Werkzeuge, mit denen du Seiten anlegen, löschen und kopieren kannst. Um eine Seite zu kopieren, bewegst du die Maus zu der "Masterseite", die du kopieren willst und klickst auf die Seite, um sie zu markieren. Dann hast du zwei Optionen. Entweder nimmst du das blaue Symbol in der Werkzeugleiste neben der Seite rechts (im Seitenbaum). Oder du nimmst das ganz rechte Seitensymbol (2) auf der rechten Seite und klickst darauf, um die Seite zu kopieren. Die Seite wird immer unter die Originalseite im Baum angelegt und vor dem Namen wird "Kopie von" angehängt. Nach dem Kopieren solltest du den Namen anpassen und die Seite, wenn nötig, an den vorgesehenen Platz schieben. Alle Aktionen werden direkt ausgeführt und gespeichert. Nach dem Schließen des Dialogs kannst du zu der Seite gehen und die Inhalte anpassen.

 

Wichtiger Hinweis

Kopierte Seiten sind sofort für deine Besucher sichtbar. Du solltest diese Seite daher erstmal auf "unsichtbar" schalten, indem du den Dialog zum Bearbeiten der Seite aufrufst und die entsprechende Option markierst. So kannst du in Ruhe die neuen Inhalte einbauen und wenn die Seite fertig ist, kannst du sie mit einem Klick für alle sichtbar machen.

 

 

Die geplante neue Seitenverwaltung

 

 

Die neue Seitenverwaltung sieht dem Blogmodul ähnlich und ist auch ein Vollscreen-Dialog. Die Schrift wird etwas größer sein und die Werkzeigleiste im Seitenbaum erscheint nur noch bei der aktiven Seite bzw. wenn du mit der Maus über einen Seiteneintrag fährst. Dadurch wird der Dialog gerade bei vielen Seiten um einiges schneller als der alte Dialog. Auch hier wirst du wie gehabt eine Seite mit dem blauen Symbol kopieren können. Der rechte Bereich ist verschwunden. Dafür hast du alle Funktionen oberhalb vom Seitenbaum und auch dort eine Funktion zum Kopieren der ausgewählten Seite. Es ändert sich für dich also sehr wenig, was die grundsätzliche Bedienung betrifft.

 

 

Seitenvorlagen in 2017

 

 

Weil bald Weihnachten ist, möchte ich euch noch einen kleinen Blick in die Zukunft zeigen. Wenn man eine neue Seite anlegt, dann hat man aktuell ein "leeres Blatt Papier". Mit der oben erklärten Funktion, eine Seite zu kopieren, kann man sich viel Arbeit ersparen.

 

Manchmal ist es aber gar nicht so einfach, die gewünschten Inhalte gut strukturiert anzulegen. Dafür gibt es irgendwann im kommenden Jahr eine ganz tolle, neue Funktion. Die sogenannten Seitenvorlagen. Wenn du eine neue Seite anlegst, wird diese nicht sofort im Seitenbaum angelegt. Es öffnet sich vielmehr der Dialog zum Bearbeiten der Seite, wo du den Namen festlegst und einiges mehr. Dort wird die Standardseitenvorlage angezeigt, eine leere, einspaltige Seite.

 

Klickst du nun auf diese Seitenvorlage, öffnest sich der oben angezeigte Dialog und du kannst aus einer umfangreichen Sammlung an Beispielseiten die für dich passende Vorlage auswählen, indem du einfach darauf klickst. Die Vorlage wird geladen und im Dialog "Neue Seite anlegen" kannst du dann gleich alles eintragen, was benötigt wird, zum Beispiel die Seite, wenn gewünscht unsichtbar schalten.

 

Mit dem Klick auf "Anlegen" wird die Seite nun angelegt und enthält dann Beispielbilder und Blindtext, angeordnet wie in der Vorschau dargestellt. Jetzt brauchst du nur noch die Bilder austauschen, die Texte überschreiben und fertig ist eine perfekt organisierte Seite, die du natürlich jederzeit beliebig anpassen kannst.

 

Wie gesagt, dass ist aktuell nicht mögllich. Es wird aber im Frühjahr 2017 kommen, soviel ist bereits sicher. Mit vielen weiteren tollen Funktionen. Jetzt erstmal viel Spaß beim Kopieren und Zeitsparen. Wie man Inhalte kopiert, findest du ausführlich in unserer Online-Hilfe erklärt.

 

Bis demnächst

Manfred F. Schreyer

page4 - der Design Webbaukasten

 

 

PS: Du hast noch keine page4 Webseite? Dann nutze jetzt unser Weihnachtsangebot und spare im ersten Jahr richtig Geld.

 

 

PPS: Nicht vergessen, hinterlasse einen Kommentar (hier oder auf unserer Facebook Seite) und die Adresse deiner Webseite und du hast die Chance, eine Premiumversion dauerhaft kostenlos zu nutzen. Es lohnt sich.

Slideshow Hintergrundbereich

Tags: UpdateToolsTippsFunktionenBilderDesign | Kommentare: 1 | Views: 1680

Donnerstag 17.November 2016

 

Der perfekte Augenblick...

 

Unser Webbaukasten page4 ist insbesondere für Fotografen und alle, die gerne Bilder veröffentlichen geeignet. Es gibt eine Vielzahl an verschiedenen Galerien. Man kann im Header eine Slideshow einbauen mit tollen Effekten. Es gibt eine Bildverwaltung, so dass man Bilder nur einmal hochladen muss und diese dann beliebig oft verwenden kann. Die intelligente Seitenverwaltung erlaubt bis zu 10 Ebenen und man kann bequem hunderte von Seiten managen und hat genug Platz für alle Bilder und genug Ebenen um mehrsprachige Seiten zu erstellen. Perfekt für Seiten, die den richtigen Moment einfangen und vorstellen wollen...

 

Unser Design-Editor erlaubt einzigartige und vor allem wirklich individuelle Gestaltungen völlig ohne Programmierung oder dass man dafür externe Fachleute bezahlen müsste. Mit page4 kann jeder Design-Experte werden. Beste Voraussetzungen also für ein optimales Umfeld für deine Fotos und deine Leidenschaften.

 

Mit dem heutigen Update dürften wir all die erfreuen, die Bilder lieben und die eingefangenen Momente gerne mit anderen teilen wollen. Versprochen.

 

 

 

Wechselbilder für den Hintergrund

 

Die Idee, im Hintergrund mehrere Bilder zu hinterlegen, die dann in Form einer Slideshow nacheinander gezeigt werden und dabei überblenden ist nicht neu. Viele unserer Mitbewerber haben diese Funktion schon eine ganze Weile. Das weiss jeder, der verschiedene Baukästen kennt. Wer page4 kennt weiss aber auch, dass wir immer ein Interesse haben, bekannte Funktionen zu optimieren, zu verbessern und überraschende Ideen hinzuzufügen. Es gibt nichts, was man nicht verbessern kann und Updates sind für uns immer eine Gelegenheit, Verbesserungen vorzustellen. Aufgrund unserer langen Erfahrung - den ersten Webbaukasten haben wir bereits 2004 auf den Markt gebracht - haben wir in den Tiefen von page4 eine Menge Ideen "versteckt" die wir nach und nach zum Leben erwecken. Ich freue mich, euch heute zeigen zu können, wie wir uns Wechselbilder für den Hintergrund vorstellen.

 

 

Der allgemeine Hintergrund

 

Das heutige Update ist für unsere Kaufversionen wesentlich umfangreicher als für die kostenlose Version. Da wir auch den Usern einer kostenlosen Version eine Freude machen wollten, haben wir den allgemeinen Hintergrund für alle Versionen identisch gemacht.

 

 

Wer ein neues editierbares Design benutzt und auf Design editieren klickt bekommt oben im Browser ein Menü angezeigt und kann dort unter anderem den Hintergrund (1) auswählen. Der Hintergrund ist die unterste Ebene deiner Webseite und dehnt sich grundsätzlich immer im gesamten Browser aus. Du kannst den Hintergrund mit einer Farbe belegen und ein Bild einbinden und angeben, wie das Bild skaliert wird, wie es ausgerichtet sein soll und ob es gekachelt werden soll, wenn es nötig ist. Außerdem kannst du angeben, ob das Bild fixiert ist oder mitscrollt, wenn du den Inhalt deiner Seite scrollst.

 

Bisher gab es zum Auswählen eines Bildes drei Icons. Eines zum Hochladen eines Bildes von deinem Computer, eines um ein Bild aus deiner Bildverwaltung zu laden und eines um auf unser Bildarchiv Zugriff zu haben. Und einen Papierkorb, um das verlinkte Bild zu löschen. Diese Icons gibt es im Hintergrundbereich nicht mehr. Es gibt nur noch zwei Icons (2). Einen Stift und den Papierkorb. Mit dem Papierkorb löscht du wie bisher die Verlinkung zu deinem Bild wobei du jetzt mit einem Klick alle hinterlegten Bilder entfernst. Aber keine Sorge, die Bilder sind weiterhin verfügbar, da immer nur die Verlinkung unterbrochen wird und die Bilder in der Bildverwaltung hinterlegt bleiben.

 

Mit dem Stift öffnest du nun einen neuen Dialog. Mit diesem Dialog kannst du bis zu 10 Bilder aussuchen, sortieren und hinterlegen. Sobald du mehr als ein Bild eingeladen hast wird die Angabe der Zeit (3) aktiv und die vorhandenen Bilder nacheinander in einer Endlosschleife angezeigt. Du kannst die Zeit für das Überblenden stufenlos von 3 bis 30 Sekunden einstellen.

 

 

Der neue Bildauswahl-Dialog

 

 

Hier siehst du den neuen Dialog zur Bildauswahl (1). Die Icons aus dem bisherigen Auswähler findest du nun oben im Dialog zusammen mit einem kleinen Text (2). Die Funktion ist wie bisher und öffnet entsprechende Dialoge um dir zu ermöglichen, die gewünschten Bilder einzubinden.

 

Der Dialog ist eine erste Version und daher sehr einfach gehalten. Du kannst hiermit bis zu 10 Bilder einladen. Die eingebundenen Bilder werden als Vorschau (3) angezeigt. Mit der Maus kannst du die Reihenfolge ändern und Bilder wieder löschen indem du auf das rote Kreuz klickst was erscheint, wenn du mit der Maus über ein Vorschaubild fährst. Mehr brauchst du nicht für die Slideshow.

 

Wir werden im Frühjahr 2017 den Dialog komplett überarbeiten. Sobald wir die geplanten zusätzlichen Funktionen eingebaut haben wird der Dialog ersetzt und dann auch in den Galerien eingebaut. Dann wirst du mit dem Dialog die Bildunterschriften der Galeriebilder verwalten, zusätzliche Bildquellen haben und vieles mehr. Außerdem wollen wir uns im nächsten Jahr auch dem Thema Video verstärkt widmen.

 

Wichtig: Du musst den Dialog mit dem Button "Übernehmen" schließen wenn du die Änderungen speichern willst. Klickst du auf "Abbrechen" gehen alle Änderungen verloren.

 

 

 

Mehr Funktionen für die Kaufversionen

 

Ein Design besteht aus mehr als einem Bereich und jeder Bereich hat auch einen Hintergrund. Daher kannst du mit dem Design-Editor von page4 jeden Bereich mit einer Hintergrundfarbe oder bzw. und einem Hintergrundbild versehen.

 

Es gibt viele Bereiche. Den allgemeinen Hintergrund haben wir weiter oben ja schon beschrieben. Daneben gibt es noch den Inhaltsbereich. Also der Bereich, wo alle Inhalte deiner Webseite eingebunden werden. Es gibt zwei Sidebars, eine linke und eine rechte Sidebar. Es gibt drei Header oben und drei Footer unten. Wenn du eine Streifenstruktur aktivierst, dann gibt es neben jedem Header, jedem Footer und dem Inhaltsbereich noch Außenbereiche, sogenannte Streifen, die links und rechts bis an den Rand des Browsers reichen.Wenn die Navigation nicht in einem Header platziert ist, hat auch die Navigation einen Bereich, der Optionen für den Hintergrund hat.

 

All diese Bereiche kannst du bearbeiten und mit einer Farbe, Rahmen, Effekte und auch mit einem Hintergrundbild belegen. Die meisten Bereiche kannst du ein- oder ausblenden. Du entscheidest das mit einem Mausklick.

 

Mit dem neuen Update ändert sich einiges für diese Bereiche. Alle Dialoge, welche es ermöglichen, dass man ein Hintergrundbild einladen kann, haben jetzt den neuen Bildauswähler und erlauben dir in JEDEN Bereich im Hintergrund eine Slideshow einzubauen. Du kannst also jeden Header, jeden Footer, jede Sidebar, jeden Streifen und sogar die Navigation mit einer Slideshow im Hintergrund versehen. Allerdings solltest du jetzt nicht wahllos alle Bereiche umbauen. Das wäre viel zu viel des Guten. Man kann zwar alles gleichzeitig benutzen aber das sieht  bestimmt nicht gut aus. Weniger ist hier wirklich viel mehr.

 

Nachfolgend zeigen wir dir anhand des Dialoges, der erscheint, wenn du den Header 1 auswählst der Unterschied zwischen einer kostenlosen Version und einer Kaufversion. Für die kostenlose Version ändert sich nichts. Jede Kaufversion hat dagegen ab sofort den geänderten Bildauswähler und damit die Optionen für eine Slideshow im Hintergrund.

 

 

 Dialoge im Design-Editor bei einer kostenlosen Version

 

 

 

Dialoge im Design-Editor bei einer Kaufversion

 

 

 

Der Unterschied

In der kostenlosen Version kannst du wie bisher ein Bild in jeden Hintergrund eines Bereiches einbinden und das Werkzeug dazu sieht aus wie immer. Nur das Label hat sich leicht verändert. Dort steht jetzt "Bild(er)" statt wie früher "Bild". Hast du eine kostenlose Version, erkennst du an dem Label, dass du mit einer Kaufversion überall dort eine Slideshow einbauen könntest - vielleicht ein zusätzlicher Grund über ein Upgrade nachzudenken.

 

In allen Kaufversionen kannst du nun in jedem Bereich deiner Webseite wo du bisher ein Bild hinterlegen konntest nun bis zu 10 Bilder hinterlegen und diese nacheinander in beliebiger Geschwindigkeit als Slideshow anzeigen lassen. Du solltest diese Freiheit aber mit Bedacht nutzen. Der Sinn dieser Optionen ist nicht zwingend, dass du nun dein gesamtes Design mit Slideshows hinterlegst und deine Besucher gar nicht mehr wissen wohin sie schauen sollen weil ständig überall Bilder auftauchen und verschwinden.

 

Der Sinn besteht vielmehr darin, dass du völlige Freiheit hast, selbst zu entscheiden, wo du in dem Design deiner Webseite gerne eine perfekte Bildershow hinterlegen möchtest. Ob im Hintergrund der Seite, im Header 1, 2 oder 3 oder doch lieber im Footer. Ob in der linken oder rechten Sidebar oder sogar unter deinen Inhalten. Oder vielleicht doch lieber als Streifen, der über den gesamten Browser geht.

 

Du allein bestimmst, was dir gefällt. Und zwar mit jedem editierbaren Design und wo und wie oft du willst.

 

 

Unsere Musterseite für den Slider

 

Damit du eine kleine Hilfe hast, wie so etwas aussehen könnte, haben wir ein paar Seiten für dich vorbereitet und zeigen dir dort einige Bereiche, wo so ein Slider angelegt werden könnte. Auf den Seiten erklären wir die neue Funktionen noch etwas genauer und beschreiben wie wir die unterschiedlichen Slider gebaut haben. Beachte bitte, dass die Funktion im Design-Editor eingebaut ist und daher an das Design gebunden ist. Wechselt du das Design, gehen deine Hintergrundslider verloren. Normalerweise ist es bei page4 nicht zwingend notwendig, ein einmal erstelltes Design zu wechseln. Du kannst alle Designvorlagen selbst nachbauen ohne dazu dein aktuelles Design zu wechseln.

 

Auf den Beispielseiten sieht es so aus, als ob wir verschiedene Designvorlagen bzw. Designideen innerhalb einer Webseite verwenden. Dass ist nicht der Fall. Wir haben mehrere Accounts kopiert und dann in den einzelnen Accounts das Design entsprechend angepasst. Die Navigation verlinkt nicht zu Seiten sondern zu den entsprechenden Accounts. So entsteht der Eindruck als ob alles eine Webseite ist. Wir wollen im Laufe des kommenden Jahres die Funktion fertigstellen, die es ermöglicht, beliebige Seiten mit von dir erstellten und gespeicherten Designvorlagen zu verbinden. Dann kannst du in einer Webseite beliebig viele Designvorlagen nutzen. Dass wird aber noch etwas dauern.

 

Du findest die Seiten unter der Adresse bgslider-1.features.page4.com und wenn du oben die einzelnen Navigationspunkte anwählst dann zeigen wir dir verschiedene Beispiele wie man den Slider nutzen könnte.

 

Viel Spaß beim Ansehen, nachbauen und selbst probieren.

 

 

Dein page4 Team

Manfred F. Schreyer

Raumgestaltung

Tags: Updatepage4FunktionenContent | Kommentare: 9 | Views: 9480

Mittwoch 26.Oktober 2016

 

Freiräume nutzen

 

Im Zuge unserer doch sehr umfangreichen Umgestaltung des Seitenmanagers habe ich Vorlagen gestaltet, die man zukünftig beim Anlegen einer neuen Seite auswählen kann. Es wird dann keine leere Seite angelegt sondern eine Seite mit Blindtext, Bildern aus unserem Archiv und mehr. Du musst diese Inhalte dann einfach nur überschreiben und sparst eine Menge Arbeit. Dabei habe ich schmerzhaft eine Möglichkeit vermisst, größere Abstände zwischen einzelnen Elementen anzulegen. Aus diesem Grund habe ich mich mit meinem Team zusammengesetzt und über den schon lange geplanten "Abstands-Content" diskutiert. Nun ist es ja so, dass ein Inhaltselement, welches im Grunde aus keinem Inhalt sondern aus leerem Raum besteht nur eine einzige Option hat: Wie hoch ist dieses Element bzw. wie groß soll der Abstand werden. Ich habe dann einen Dialog mit Vorschau vorbereitet und der Option, in dieser Vorschau mit der Maus den Abstand durch Verschieben einzustellen und dann meinen Mitarbeitern freie Hand gegeben, dass kurzfristig umzusetzen.

 

Herausgekommen ist dann allerdings was ganz anderes. Der erste Content bzw. das erste Abschnittselement ohne Dialog. Mein Team wusste, dass ich am liebsten page4 so umbauen möchte, dass man einfache Dinge direkt auf der Seite editieren kann ohne einen Dialog aufrufen zu müssen. Da der Abstand ein sehr einfaches Element ist, hat mein Chefentwickler sich entschlossen, diesen Content zu nehmen und die Basis von page4 gleichzeitig so zu erweitern, dass wir zukünftig mehr solcher Funktionen einbauen können. Das bedeutet nicht, dass wir neue Inhalte ohne Dialog bauen wollen sondern dass wir bestehende Inhalte jetzt ganz einfach um Funktionen erweitern können, die man direkt auf der Seite ausführt. Es kommen also spannende Zeiten auf uns zu.

 

Im ersten Schritt werden wir allerdings nur zwei solcher Optionen vorstellen. Damit ihr schon mal Appetit auf mehr bekommt...

 

 

Der neue Abstands-Content

 

Der Abstands-Content macht nur eins: Er schafft Freiräume auf deiner Seite und hilft dir dabei, den Raum zur Gestaltung zu nutzen. Unten siehst du so einen Abstand im Admin-Modus. Wenn du ganz genau hinsiehst entdeckst du einen ganz leicht grauen Kasten zwischen dem Bild oben und der Überschrift unten. In der Besucheransicht ist dieser Bereich natürlich durchsichtig.

 

 

Wenn du nun die Maus über den Bereich bewegst erscheint die übliche Bearbeitungsleiste wie bei anderen Contents bzw. Abschnittsbereichen aber es fehlt der Stift zum Bearbeiten und es fehlen die Optionen.

 

 

Den Stift brauchst du nicht. Am unteren Rand siehst du einen blauen Balken und in der Mitte sind zwei Pfeile und eine Pixelangabe. Sobald du mit der Maus über diesen Balken gehst ändert sich der Cursor und du kannst den Balken anfassen und nach oben oder unten verschieben. Beim Verschieben wird die Zahl ständig angepasst. Die Zahl sagt dir, wie hoch der Abstandscontent ist bzw. wie viel Freiraum du schaffst. Der minimale Abstand beträgt 20 px. Dann ist der Content so hoch wie der blaue Balken. Der maximale Abstand kann 500 px betragen. Dass ist schon eine ganze Menge Freiraum. Selbstverständlich kannst du das Abstandselement löschen, kopieren und verschieben und mit dem Pluszeichen jederzeit weitere Abstände hinzufügen.

 

Das Zahnrad für die Optionen brauchst du nicht. In den Optionen kannst du bei jedem anderen Content ja einstellen, wie viel Abstand vom Inhalt zum Rand sein soll, ob es einen Rahmen geben soll und eine Hintergrundfarbe. All diese Optionen machen bei einem Content, der nur Freiraum schaffen soll, keinerlei Sinn.

 

Sobald du den blauen Balken bewegst und dann die Maus nicht mehr gedrückt hältst wird der Content gespeichert. Bei jeder Speicherung wird oben am Browserrand kurz eine Meldung eingeblendet.

 

Nutze den Abstands-Content um "Ruhezonen" für deine Besucher zu schaffen. Wenn du Räume nutzt, um Inhalte zu trennen sorge dafür, dass die Räume einheitlich hoch sind. Du kannst natürlich beliebig viele Abstandselemente untereinander platzieren. Und natürlich auch in Spalten, in den Sidebars oder im Footer 1 einbauen.

 

 

 

Die neue Funktion im Streifen-Content

 

Wie oben in der Einleitung beschrieben haben wir die Basis von page4 erweitert und sind nun in der Lage, zusätzliche Funktionen zur Verfügung zu stellen. Für den Streifen-Content haben wir das bereits gemacht. Zum einen, weil der Content eine ähnliche Funktion wie der Abstands-Content hat - man kann eine bestimmte Höhe des Streifens angeben - und zum anderen um die neue Basisfunktion gleich einmal zu testen. Wir finden, der Test ist gelungen. Urteilt selbst.

 

Wenn du einen Streifen-Content anlegst kannst du diesen weiter wie bisher bearbeiten. Es hat sich nichts verändert. Du kannst die Höhe weiter im Dialog eintragen. Soabld der Content auf der Seite angelegt ist und du mit der Maus über den Content fährst siehst du allerdings den Unterschied zu früher. Es erscheint jetzt wie beim Abstands-Content unten ein blauer Balken und zeigt dir an, wie hoch dein Streifen ist.

 

 

Natürlich ist es nicht nur eine Anzeige. Du kannst jetzt den Balken anfassen und direkt auf der Webseite mit der Maus die Höhe vom Streifen einstellen. Das ist viel schöner und besser als den Dialog zu nutzen. Denn du siehst sofort auf der Seite, bei welcher Höhe der Streifen besonders gut zur Geltung kommt. Auch hier werden alle Veränderungen sofort gespeichert. Und wenn du den Dialog öffnest, dann sind dort natürlich die neuen Werte der Höhe eingetragen. Beim Streifen-Content gibt es auch weiterhin das Zahnrad für die Optionen. Mit den neuen Optionen fügen wir neue Funktionen hinzu ohne die bisherige Bedienung zu ändern.

 

Wir brauchen eure Ideen...

 

Schreibt uns doch einfach hier im Blog welche Funktionen euch besonders freuen würden. Welche Inhaltselemente möchtet ihr direkt auf der Seite editieren oder anpassen? Berücksichtigt bitte, dass ein Dialog Platz für vielfältige Einstellungen bietet während das Bearbeiten von Inhalten direkt auf der Seite vor allem schnell gehen soll. Geplant ist, dass wir ermöglichen, dass man Bilder mit der Maus direkt auf der Seite größer oder kleiner machen kann. Und dass man einfach in eine Überschrift klickt, um diese dann direkt auf der Seite zu verändern. Je mehr Ideen von euch kommen umso besser können wir page4 machen. Also traut euch ruhig. Wir werden dann sehen, welche Anregungen sich umsetzen lassen.

 

 

Schöne Grüße vom ganzen Team

Manfred F. Schreyer

page4 Ltd.

Neue Galerien Teil 3

Tags: Updatepage4FunktionenContentBilder | Kommentare: 7 | Views: 4517

Dienstag 18.Oktober 2016

 

Das Karussell ist da

 

Heute dreht sich alles um die vorerst letzte Galerie, ein sogenanntes Karussel. Die Einstellungen sind ähnlich wie bei den anderen Galerien. In der Darstellung werden alle Vorschaubilder in einer Reihe angezeigt. Und zwar so viele gleichzeitig, wie Platz ist. Ist die Automatik eingeschaltet oder klickst du auf den Play-Button werden nacheinander weitere Bilder angezeigt indem links ein Bild verschwindet und rechts ein neues Bild auftaucht. Wie bei einem Karussell werden nacheinander alle Bilder gezeigt und dann beginnt die Galerie von vorne.

 

 

Die neue Diashow (Karussell)

 

Du hast viele Optionen, das Karussell anzupassen. Die Darstellung auf der Webseite hat zwei Variationen. Entweder stellst du den Bildwechsel auf "Manuell" und dann erscheinen unter der Bildreihe Bedienungselemente für deine Besucher oder du stellst auf "Automatik" und es wird nur die Bildreihe angezeigt und die Bilder werden automatisch "durchgeblättert".

 

 

 

 

 

So sieht der Dialog aus:

 

 

Die Bedienelemente erklären sich wie du es gewohnt bist von alleine. Dank der klar strukturierten Aufteilung und den einheitlichen Elementen solltest du sehr schnell damit zurecht kommen. Wie schon beim letzten mal erwähnt, ist es am einfachsten, du legst eine neue Galerie an, bindest die Bilder ein und wählst dann den Typ aus und speicherst den Content ab.

 

Nachfolgend einige Tipps

a) Die Galerie ist max. so breit wie die Spalte, in der sich die Galerie befindet und passt sich natürlich auch auf mobilen Geräten entsprechend an. Wenn deine Seite z.B. 1.000 Pixel breit ist, dann wird das Karussell max. 1.000 Pixel breit, auch wenn du größere Werte einstellst.

b) Die Bilder werden auf der Webseite immer so verkleinert dargestellt, dass der verfügbare Raum ausgefüllt wird. Du solltest daher entweder die Vorschaubilder quadratisch machen oder ein Seitenverhältnis wählen, welches den Orginalbildern entspricht.

 

Zum obigen Dialog noch einige Anmerkungen

1) Das Karussell wählst du oben im Plugin-Bereich aus. Mit diesem Update sind dann insgesamt 7 verschiedene Galerien verfügbar.

2) Die Wartezeit ist der Zeitraum, der vergeht, bis das nächste Bild angezeigt wird. Du hast drei Zeiteinstellungen zur Verfügung. Wenn du auf "Manuell" gestellt hast, wird diese Wartezeit erst aktiv, wenn du den "Playbutton" drückst.

3) Die Bilder können mit einem Rahmen versehen und die Ecken können abgerundet werden. Setze diese Optionen nur dezent ein, damit vor allem deine Bilder zur Wirkung kommen.

4) Der Schatten sollte nur aktiviert werden, wenn zwischen den Bildern genug Abstand eingestellt ist.

 

 

 

Vorschau

Mit diesem Update sind vorerst alle geplanten Galerien online gestellt und beim nächsten Mal gibt es in einem ganz anderen Bereich neue Funktionen. Da wir noch nicht wissen, welche dieser Funktionen zuerst online gehen, möchte ich hier auch diesmal nichts verraten. An der Galerie selbst werden wir auch weiterarbeiten. Es ist geplant, den Bereich, wo die Bilder für die Galerie eingebunden werden in einen eigenen Dialog zu verlagern den du über einen Button erreichen kannst. Dadurch kann man mehr Optionen anbieten und alles viel besser gestalten. Außerdem arbeiten wir an einer verbesserten Online-Hilfe direkt in der Software.

 

Nach dem Abschluss der Galerien-Serie würden wir natürlich gerne wissen wollen, welche Galerie euch am besten gefällt und was ihr euch für die Galerien noch wünscht. Hinterlasst dazu einfach einen oder mehrere Kommentare.

 

Schöne Grüße vom ganzen Team

Manfred F. Schreyer

page4 Ltd.

Neue Galerien Teil 2

Tags: Updatepage4FunktionenContentBilder | Kommentare: 1 | Views: 11197

Mittwoch 5.Oktober 2016

 

Neue Diashow online

 

Heute dreht sich alles um die sogenannte Diashow. In der Vergangenheit basierte diese Galerie auf Flash. Der Nachteil ist inzwischen, dass solche flashbasierten Galerien auf mobilen Geräten von Apple nicht funktionieren. Wir haben daher eine neue Diashow fertiggestellt, die ihr als Ersatz für die alte Classic-Diashow einsetzen könnt. Wir haben bewusst darauf verzichtet, die neue Diashow absolut identisch zu machen. Aufgrund der Vielzahl der Galerien kannst du bestimmte Funktionen besser mit einer anderen Variante abbilden. Die neue Diashow macht daher genau das, was man von einer Diashow erwartet und nicht mehr.

 

 

Die neue Diashow (Diashow)

 

Du hast viele Optionen, deine Diashow anzupassen. Zum Beispiel kannst du, wie an dem Bild unter dem Text gut zu erkennen, die Vorschaubilder in zwei Reihen und seitlich platzieren. Du kannst die Bilder im Gegensatz zur alten Galerie "ausfüllen" lassen. Damit vermeidest du unschöne Ränder und auch mit unterschiedlich großen Fotos sieht die Diashow perfekt aus.

 

 

 

Wie im unteren Bild zu erkennen, kannst du natürlich auch nur eine Reihe von Vorschaubildern anzeigen lassen und diese dann unterhalb der Diashow positionieren. Auf der Webseite selbst besteht die Diashow aus dem Hauptbild, der Leiste mit den Vorschaubildern und neben dieser Leiste befinden sich Pfeile um in der Bildersammlung zu blättern. Klickst du auf das Hauptbild, dann werden die Bilder im Vollbildmodus angezeigt inkl. der Vorschaubilder und mit zusätzlichen Bedienelementen.

 

 

 

So sieht der Dialog aus:

 

 

Die Bedienelemente erklären sich von alleine. Dank der klar strukturierten Aufteilung und den einheitlichen Elementen solltest du sehr schnell damit zurecht kommen. Wie schon beim letzten mal erwähnt, ist es am einfachsten, du legst eine neue Galerie an, bindest die Bilder ein und wählst dann den Typ aus und speicherst den Content ab.

 

Nachfolgend einige Tipps

a) Die Galerie ist max. so breit wie die Spalte, in der sich die Galerie befindet und passt sich natürlich auch auf mobilen Geräten entsprechend an. Wenn deine Seite z.B. 1.000 Pixel breit ist, dann wird die Diashow max. 1.000 Pixel breit, auch wenn du größere Werte einstellst.

b) Du solltest alle Bilder für eine Galerie immer im gleichen Seitenverhältnis oder noch besser in den gleichen Abmessungen hochladen. Außerdem sollten die Angaben in der Galerie so gewählt werden, dass zumindest auch dort das gleiche Seitenverhältnis eingestellt ist wie bei deinen Bildern. Nur dann werden deine Bilder optimal präsentiert.

c) Wenn du Ausfüllen einschaltest, dann wird jedes Bild so verkleinert oder vergrößert, dass die gesamte Fläche der Galerie ausgefüllt ist. Das führt dazu, dass Bilder, die ein anderes Seitenverhältnis haben nur ausschnittsweise gezeigt werden und Bilder, die zu klein sind, vergrößert werden und an Qualität verlieren.

 

 

 

 

Die alte Diashow (Classic Diashow)

 

Wenn du einen ganz neuen Account hast, kannst du diese Galerie nicht mehr auswählen. Es macht keinen Sinn, eine Galerie mit veralterter Technik weiter anlegen zu lassen. Du kannst alles, was die alte Classic Diashow macht mit den neuen Galerien abbilden.

Bist du schon länger bei uns und hast aber keine einzige Galerie vom Typ Diashow auf deiner Seite so kannst du ebenfalls keine neue Galerie "Classic Diashow" anlegen, da der Button zur Auswahl ausgeblendet ist.

Die Classic Diashow ist nur für User, die noch Diashow-Galerien auf der Basis von Flash auf ihrer Seite haben. Du hast zwei Möglichkeiten. Entweder willst du weiter solche Galerien benutzen mit dem Nachteil, dass die Galerien nicht auf jedem Gerät angezeigt werden können. Dann kannst du diese Galerien weiterhin bearbeiten. Oder du möchtest auf die neue Diashow oder eine andere Galerie umsteigen. Dann bearbeite einfach deine alte Diashow-Galerie und wähle einen anderen Typ aus und speichere den Content ab. Alle Bilder werden in die neue Galerie übernommen. Öffnest du diese Galerie erneut um sie zu bearbeiten ist der Punkt "Classic Diashow" allerdings ausgeblendet. Du kannst nicht mehr zurückstellen auf die alte Galerie.

 

In der Palette und im Dialog zum Anlegen von Inhaltselementen ist das Icon für die Diashow verschwunden. Bearbeitest du eine vorhandene alte Flash-Diashow öffnet sich der allgemeine Dialog für Galerien und zeigt dir weiterhin alle Optionen an.

 

So sieht die alte Diashow auf der Webseite aus. Passen Bilder von den Abmessungen nicht in die Diashow werden schwarze Ränder angezeigt.

 

 

 

Der Dialog für die alte Classic Diashow:

 

 

Die Bedienung entspricht der bisherigen Diashow und solange du nicht auf eine andere Galerie umschaltest und dies dann abspeicherst hast du weiterhin eine Flash-Diashow auf deiner Webseite.

 

 

Vorschau

Wir haben noch eine weitere Galerie für euch, die wir aber später vorstellen werden. Wie immer arbeiten wir an interessanten neuen Ideen. Welche wir davon demnächst online stellen werden kann ich aktuell noch nicht sagen. Lasst euch einfach überraschen.

 

Noch einmal der Hinweis an alle User einer kostenlosen Version. Wer viele Bilder verwendet, sollte vielleicht mal über ein Upgrade nachdenken. Mit der Kaufversion kann man beliebig viele Bilder gleichzeitig hochladen und so sehr einfach und schnell eine neue Galerie erstellen. Auch die neuen Funktionen, die wir planen werden nur teilweise für kostenlose Versionen zur Verfügung stehen. Es lohnt sich wirklich, ein paar Euro für eine Kaufversion und eine eigene Domain zu investieren.

 

Schöne Grüße vom ganzen Team

Manfred F. Schreyer

page4 Ltd.

Neue Galerien Teil 1

Tags: Updatepage4FunktionenContentBilder | Kommentare: 6 | Views: 4417

Mittwoch 28.September 2016

 

Zwei neue Galerien verfügbar

 

Ab heute kannst du deine Bilder noch besser präsentieren. Nachdem wir vor einer Weile die Galerien zu einem Content zusammengefasst und dir das sogenannte Mauerwerk vorgestellt haben gibt es heute die ersten Erweiterungen in Form von zwei neuen Galerien. Du kannst mit einem Klick zu den neuen Galerien wechseln.

 

Die Gitter Galerie (Gitter)

 

Deine Bilder werden in einem Gitter dargestellt. Alle Bilder haben die gleiche Größe und du entscheidest, in wie vielen Reihen die Bilder angezeigt werden. Im unteren Beispiel haben wir 2 Reihen eingestellt und aufgrund der Größe der Vorschaubilder passen immer 6 Bilder in einer Reihe. Da die Galerie mehr als 12 Bilder enthält werden unten Steuerelemente eingeblendet. Über diese Elemente kannst du die weiteren Bilder anzeigen lassen. Du kannst selbst entscheiden, ob deine Besucher nur diese Übersicht sehen oder mit einem Klick auf ein Bild in den Vollbildmodus wechseln dürfen.

 

 

 

Abgerundete Ecken für besondere Galerien

 

Du kannst die Bilder auch als Kreis anzeigen lassen. Dazu müssen die Bilder in jedem Fall quadratisch sein und die Rundung muss mind. so groß sein, wie die halbe Breite eines Bildes. Wenn du deine Bilder in dem Format 150 x 150 px anzeigst, musst die Rundung auf 75 px oder mehr eingestellt sein. Dann sieht deine Galerie wie folgt aus:

 

 

 

Natürlich betrifft das nur die Darstellung auf der Seite. Im Vollbildmodus werden die Bilder ganz normal angezeigt. Die Ansicht in der Vorschau ist immer so, dass das Bild soweit verkleinert wird, dass es komplett die Vorschau ausfüllt ohne verzerrt zu werden. Es wird also immer ein Auschnitt angezeigt, der mittig zentriert ist. Im oberen Beispiel ist ein Schatten hinter jedem Bild hinterlegt. Diesen Schatten kannst du an- oder ausschalten. Die Umrandung kannst du selbst bestimmen und Art, Stärke, Farbe und Transparenz vorgeben.

 

So sieht der Dialog aus:

 

 

 

Viele der Optionen kennst du bereits vom Mauerwerk. Dank der klar strukturierten Aufteilung und den einheitlichen Elementen solltest du sehr schnell damit zurecht kommen. Am einfachsten ist es, du legst eine neue Galerie an, bindest die Bilder ein und wählst dann den Typ aus und speicherst den Content ab. Die voreingestellten Werte sorgen in jedem Fall für ein professionelles Aussehen und können dann von dir ganz einfach an deine Bedürfnisse angepasst werden.

 

 

Die Slider Galerie (Slider)

 

Mit der neuen Slider Galerie bekommst du eine völlig neue Art der Galerie für deine Seiten. Am besten wirkt der Slider mit Bildern, die über die volle Breite deiner Seite gehen und nicht zu hoch sind. Beim Slider wird immer nur ein Bild zur Zeit auf der Seite angezeigt. Wenn du die Automatik einstellst, dann zeigt der Slider automatisch nacheinander alle Bilder an. Dabei kannst du wählen zwischen einer Überblendung der Bilder oder einem Verschiebe-Effekt. Die Steuerelemente dienen dazu, manuell durch die Galerie zu steppen. Die Punkte zeigen an, wie viele Bilder in der Galerie sind. Du solltest nicht zu viele Bilder hinterlegen. Im unteren Beispiel sind 36 Bilder eingebunden. Die Steuerelemente kannst du ausschalten. Wenn du keine Steuerelemente anzeigst, dann musst du zwingend die Automatik anschalten, damit alle Bilder nacheinander angezeigt werden, da der Besucher ohne diese Elemente nicht selbst die Bilder wechseln kann. Wichtig ist, dass alle Bilder die gleichen Abmessungen haben. Alternativ kannst du die Option "Ausfüllen" anschalten. Dann werden alle Bilder auf eine Größe gebracht und der Ausschnitt dann mittig angezeigt.

 

 

 

 

So sieht der Dialog für den Slider aus:

 

 

Eine ausführliche Anleitung gibt es hoffentlich bald auf unserer Online-Hilfe. Im Moment haben wir so viele neue Ideen in Arbeit, dass die Hilfe leider etwas zu kurz kommt. Aber wir bleiben am Ball. Die meisten unserer Dialoge sind zum Glück selbsterklärend. Viele Optionen kann man einfach ausprobieren und sieht dann sofort, was passiert. Im Zweifel nutze einfach die Standardeinstellungen. Also einfach einen neuen Content anlegen, Bilder hinzufügen, Galerie auswählen und speichern. Die Galerie wird mit den vorgegebenen Basiseinstellungen angezeigt. So hast du immer eine gut gestaltete Galerie. Zusätzlich kannst du jederzeit einzelne Werte an deine persönlichen Vorlieben anpassen.

 

 

Ein Wort zu unserem Konzept

Manche Baukasten werben damit, dass alles ganz einfach geht. Man klickt in den Text auf einer Seite und überschreibt dann den Text. Im ersten Moment eine coole Sache. Leider geizen solche Baukästen oft auch bei den Möglichkeiten, die Webseite zu designen. Andere Systeme erlauben alles. Du kannst Inhalte beliebig auf der Seite verschieben und hast unendliche viele Optionen, Animationen und was auch immer. Der Nachteil wird deutlich, wenn man klar strukturierte Seiten aufbauen will.

Mit page4 verbindest du beide Welten miteinander. Unser System ist sehr einfach zu bedienen. Inhalte auf die Seite ziehen und mit einem Klick den Bearbeitungsdialog öffnen geht sehr schnell und ist sehr leicht. Speichern und fertig. Ein Design auswählen, eigene Bilder und Farben einfügen, speichern und fertig. Auf der einen Seite sind wir also genauso komfortabel wie die Baukästen, die nur wenige Optionen bieten. Auf der anderen Seite kannst du über unsere Dialoge sehr viele sinnvolle Anpassungen vornehmen und so individuelle Webseiten gestalten. Bei unseren Galerien ist dieses Konzept perfekt umgesetzt. Klare Bedienung und schnelle Ergebnisse. Und unendliche Vielfalt.

 

Ausblick

Wie du bereits an der Bezeichnung dieses Blogartikels sehen kannst, folgt demnächst ein zweiter Teil zum Thema Galerie. Es gibt also in Kürze weitere Galerien für deine page4 Webseite. Ein wichtiges Thema ist dabei Flash. Unsere Diashow ist auf Flash aufgebaut und daher auf vielen mobilen Geräten nicht abspielbar. Außerdem planen viele Browserhersteller, Flash bald nicht mehr zu unterstützen. Wir werden daher bald eine Galerie vorstellen, die unsere Diaschow ersetzen soll. Die neue Galerie kann fast alles wie die Diashow und sieht ziemlich ähnlich aus. Wir haben uns daher entschlossen mit dem nächsten Update für die Galerie die alte Diashow zu entfernen und alle vorhandenen, auf der Diashow basierenden Galerien automatisch in die neue Galerie zu konvertieren. Nach dem Update mit dem Ersatz für die Diashow gibt es also keine flashbasierte Galerie mehr. Dieser Schritt ist notwendig und wir bitten schon jetzt um Verständnis dafür.

 

So, dass wär es für heute. Viel Spaß mit den neuen Galerien. Wer aktuell eine kostenlose Version hat und viele Bilder verwendet, sollte vielleicht mal über ein Upgrade nachdenken. Mit der Kaufversion kann man beliebig viele Bilder gleichzeitig hochladen und so sehr einfach und schnell eine neue Galerie erstellen.

 

Schöne Grüße vom ganzen Team

Manfred F. Schreyer

page4 Ltd.

 

 

PS: Unsere Galerie "Mauerwerk" hat übrigens mit dem Update auch eine Option "Schatten" bekommen. Einfach mal testen.

 

 

 

 

 

 

 

 

 

Inhalte gleichzeitig in linke und rechte Sidebar einbauen

Tags: Updatepage4FunktionenContent | Kommentare: 11 | Views: 3069

Mittwoch 14.September 2016

 

Mehr Platz für deine Inhalte

Ab sofort kannst du beide Seitenleisten (Sidebars) mit eigenem Inhalt füllen.

 

Bisher war es so, dass du entweder die linke oder die rechte Sidebar für eigene Inhalte nutzen konntest. Ab sofort kann man beide Sidebars für eigene Inhalte verwenden. Sobald du dich in deine Seite eingeloggt hast, erscheint jetzt auch in der bisher ungenutzten Sidebar eine leere Spalte, in die du Inhalte einfügen kannst.

 

 

So aktivierst du die Sidebars

 

Bevor wir auf weitere Details eingehen, nachfolgend eine Übersicht, wie du eine oder beide Sidebars aktivierst. Gehe auf "Design editieren" im Menü "Design" und klicke dann auf "Elemente". Du siehst einen Dialog wie unten angezeigt. Setzte die Schaltfläche unter "Sidebar links" auf "An" wenn du links eine Sidebar nutzen willst. Möchtest du auch die zweite Sidebar nutzen, dann schalte in der gleichen Weise auch die Sidebar rechts an. Wenn du das erste Mal eine Sidebar aktivierst kann es sein, dass du den Hintergrund usw. an dein Design anpassen musst, da evtl. noch die Einstellungen aus dem ursprünglichen Design vorhanden sind. Eine Sidebar verwendet immer eine feste Breite. Ebenso wie das gesamte Design. Wenn du zum ersten Mal eine Sidebar sichtbar machst, dann wird die Breite vom Inhalt verkleinert um Platz für die Sidebar zu schaffen.

 

 

 

Optionen für die Sidebar

 

Die Sidebar steht immer links und/oder rechts vom Inhalt. Du kannst den Abstand zwischen Inhalt und Sidebar auf 0 px setzen wenn du möchtest, dass beide Bereiche optisch zu einem Bereich verschmelzen oder einen Abstand einstellen, um die Sidebars klar vom Inhalt zu trennen. Normalerweise dehnt sich die Höhe der Sidebar nur soweit aus, wie benötigt. Je mehr Inhalte du in der Sidebar hast, umso höher wird sie. Du kannst mit einem Klick einstellen, dass die Höhe der Sidebar immer so hoch ist wie die Höhe vom Inhaltsbereich, unabhängig von den Inhalten in der Sidebar. Die Option findest du ebenfalls im Dialog "Elemente" ganz rechts (7). Du kannst diese Option für jede Sidebar getrennt einstellen.

 

 

Spalten für die Sidebar

Hast du eine Kaufversion, kannst du in der Sidebar Spalten einrichten. Wechsle einfach zum Spalteneditor und ziehe dann Spaltenelemente auf die Sidebar. Dir stehen alle Optionen zur Verfügung, die du auch auf der normalen Seite hast. Allerdings macht es nur selten Sinn, mehr als eine Spalte in der Sidebar anzulegen, da diese nur eine begrenzte Breite hat. Es bietet sich lediglich an, wenn man kleine Elemente wie Icons nebeneinander platzieren möchte.

 

 

Inhalte für die Sidebar

Du kannst alle Inhalte benutzen, die du auch auf der normalen Seite nutzt. Also Überschriften, Texte, Formulare, Linien, Social Media Elemente und mehr. Die Sidebar verhält sich wie ein normaler Inhaltsbereich mit einem Unterschied: Sie ist auf allen Seiten sichtbar und hat daher immer denselben Inhalt. Du solltest deshalb in der Sidebar vor allem die Informationen einbauen, die deine Besucher ständig im Blickfeld haben sollen.

 

 

Navigation/Blog-Navigation in der Sidebar

Mit page4 entscheidest du, wo die Navigation sein soll. Du kannst jederzeit die Haupt- oder nur die Unternavigation in eine der Sidebars verlegen. Das geht über den Design-Editor und ist mit einem Klick getan. Ebenso kannst du die Navigation vom Blog in der Sidebar anzeigen lassen. Die Einstellungen dazu nimmst du im Blog selbst vor. In welcher Sidebar die Blognavigation erscheinen soll, wird im Design-Editor unter Elemente festgelegt (4).

 

 

Hauptinhalte und Nebeninhalte

Unter dem Bereich "Aktionen" kannst du einstellen, wie die Inhalte in der Sidebar dargestellt werden sollen (5). Bisher war es so, dass du die Inhalte ausblenden (Aus) oder (Links) bzw. (Rechts) anzeigen lassen konntest. Mit den neuen Optionen ändern sich nicht die Einstellungen aber die Funktion dahinter. Das Ausschalten bleibt gleich. Steht der Schalter auf "Aus" werden keine Inhalte angezeigt. Mit den Schaltern "Links" bzw. "Rechts" legst du nun fest, wo die "Hauptinhalte" angezeigt werden. Stellst du den Schalter auf "Links" werden die Hauptinhalte links angezeigt und umgekehrt. Im Grunde ist es ein Spiegeln der Sidebar.

Was sind Hauptinhalte? Für alle User, die bereits Inhalte in einer Sidebar angelegt haben sind diese Inhalte für das System die "Hauptinhalte". Hast du zum Beispiel zwei Sidebars aktiviert, dann hast du vielleicht festgelegt, dass deine Inhalte in der rechten Sidebar angezeigt werden. Öffnest du nach dem Update den Design-Editor so ist im Bereich "Elemente" der Schalter für die Sidebarinhalte auf "Rechts" gestellt. Die "Hauptinhalte" der Sidebar werden also wie eingestellt, in der rechten Sidebar angezeigt. In der linken Sidebar sind noch keine Inhalte. Alle Inhalte, die du dort anlegst, sind dann die "Nebeninhalte". Klickst du nun im Bereich "Elemente" auf den Schalter "Links" dann tauscht das System die gesamten Inhalte beider Sidebars aus und deine "alten" Inhalte erscheinen nun in der linken Sidebar.

Ansonsten gelten immer die Inhalte der "aktivierten" Sidebar als Hauptinhalte.

 

Ausblick und Anmerkungen

Es gibt kaum ein System, welches Designvorlagen mit zwei Sidebars und zusätzlich einer unteren Sidebar (Footer) anbietet. Und kein System, wo du bei jedem Design selbst entscheiden kannst, welche dieser Bereiche sichtbar sein sollen. Kein anderes System bietet das Spiegeln eines Designs an und wir kennen auch kein System, wo du entscheiden kannst, ob sich die Sidebar ausdehnen soll oder nicht. Auch die Möglichkeit, selbst zu entscheiden, wo du die Navigation oder die Blognavigation haben möchtest, bietet kein anderes System. Natürlich sollte man wie immer, mit allen Funktionen sparsam umgehen. Entscheidend ist nicht, dass man alle Bereiche nutzt, sondern dass man frei entscheiden kann, welche Bereiche genutzt werden sollen. 

 

Die neuen Funktionen sind leider nicht mit alten Designvorlagen nutzbar. Es ist sehr leicht, auf ein neues Design umzusteigen. Vielleicht solltest du jetzt damit anfangen. Wenn du Hilfe brauchst, schicke uns eine Email und wir unterstützen dich dabei.

 

Auch das nächste Update dreht sich noch um diesen Bereich (Footer, Sidebar). Sobald das letzte Update dieser "Serie" veröffentlicht ist, werden wir uns anderen Bereichen zuwenden. Selbstverständlich haben wir natürlich schon neue interessante Funktionen in Vorbereitung. Die Seitenverwaltung bekommt zum Beispiel aktuell bereits einen neuen Dialog im "Fullscreen" Modus und bei der Gelegenheit einige nützliche Erweiterungen. Lasst euch überraschen.

 

Viel Spaß beim Ausprobieren. Je mehr Rückmeldungen wir bekommen (Kommentare, Anregungen, Wünsche) umso besser können wir die nächsten Schritte planen und page4 noch mehr optimieren. Also traut euch, wir freuen uns.

 

Manfred F. Schreyer und das page4 Team

Footer 1 als Sidebar nutzen

Tags: Updatepage4Funktionen | Kommentare: 11 | Views: 2539

Dienstag 6.September 2016

 

Alles im Blick

Mit dem neuen Footer eröffnen sich ganz neue Gestaltungsmöglichkeiten

 

Als wir unseren neuen Design-Editor veröffentlicht haben, kam öfter die Frage auf, wozu braucht man drei Header und drei Footer? Das heutige Update beantwortet einen wichtigen Aspekt dieser Frage. Um flexibel zu sein. Bei unseren alten Vorlagen konnte man nur wenige Designvorlagen mit einem Footer nutzen und man musste unter dem Menüpunkt "Optionen" HTML Code für den Footer einfügen, der dann im ausgeloggten Zustand angezeigt wurde. Mit unseren neuen Designvorlagen und dem Editor mussten wir einen Weg finden, kompatibel zu den alten Vorlagen zu bleiben. Daher haben wir den Footer 1 für die Bearbeitung gesperrt und den hinterlegten Code für den Fussbereich dann im Footer 1 angezeigt, sofern dieser sichtbar war.

 

Mit dem heutigen Update wird diese Sperre aufgehoben und was viel wichtiger ist: Wir erweitern die Funktion für den Footer 1, so dass dieser nun wie eine Sidebar genutzt werden kann. Die anderen beiden Footer haben weiterhin die bisherigen Funktionen die auch vom Kopfbereich (Header) bekannt sind. Wenn du mit dem Update deine Seite bearbeitest und bereits den Footer 1 nutzt wirst du nun dort ein ganz normales Inhaltselement HTML vorfinden, welches du wie gewohnt direkt bearbeiten kannst. In diesem Inhaltselement befindet sich dann der im Fussbreich (Optionen) hinterlegte Code.

 

 

So aktivierst du Footer 1

 

Bevor wir auf weitere Details eingehen, nachfolgend eine Übersicht, wie du den Footer 1 aktivierst. Gehe auf "Design editieren" im Menü "Design" und klicke dann auf "Elemente". Du siehst einen Dialog wie unten angezeigt. Setzte die Schaltfläche unter "Footer 1" auf "An" und der Footer wird sofort unterhalb deines Inhalts angezeigt. Je nach Struktur musst du dann noch bestimmte Einstellungen vornehmen, damit sich der Footer harmonisch in dein Design einfügt.

 

 

 

Optionen für den Footer

 

Mit der neuen Funktionalität ergibt sich bei den Funktionen eine kleine Änderung. Du kannst weiterhin eine Höhe einstellen. Allerdings ist die Höhe jetzt dynamisch. Wenn die Inhalte mehr Platz brauchen, dann dehnt sich der Footer in der Höhe aus. Die eingestellte Höhe ist daher nur noch die Minimalhöhe, die der Footer in jedem Fall einnimmt. Alle anderen Optionen wie Hintergrundbild, Hintergrundfarbe, Rahmen, Abrundungen usw. können wie bisher genutzt werden.

 

 

Spalten für den Footer

Hast du eine Kaufversion, kannst du im Footer Spalten einrichten. Wechsle einfach zum Spalteneditor und ziehe dann Spaltenelemente auf den Footer. Dir stehen alle Optionen zur Verfügung, die du auch auf der normalen Seite hast. Selbstverständlich ist auch der Footer responsive. Das bedeutet, in der mobilen Ansicht werden die Spalten aufgelöst und die Inhalte untereinander angezeigt.

 

 

Inhalte für den Footer

Du kannst alle Inhalte benutzen, die du auch auf der normalen Seite nutzt. Also Überschriften, Texte, Formulare, Linien, Social Media Elemente und mehr. Der Footer verhält sich wie ein normaler Inhaltsbereich mit einem Unterschied: Er ist wie die Sidebar auf allen Seiten sichtbar und hat daher immer denselben Inhalt. Du solltest daher in den neuen Footer vor allem die Informationen einbauen, die deine Besucher ständig im Blickfeld haben sollen. Mit der Linkliste ist es nun zum Beispiel sehr leicht möglich, im Footer quasi eine zusätzliche Navigation einzubauen damit Besucher schneller zu bestimmten Seiten geführt werden können. Als Nutzer einer Kaufversion kannst du so eine Navigation auch mehrspaltig anlegen, da du beliebig viele Linklisten einbauen kannst.

 

 

Footer und Sidebar flexibel nutzen

Mit page4 entscheidest du, welche Bereiche deine Webseite haben soll. Andere Systeme stellen dir verschiedene Designvorlagen vor. Bei einigen Vorlagen ist die Sidebar links, dann wieder rechts oder man verwendet eine Sidebar die unterhalb der Seite liegt, also als Footer. Mit page4 kannst du mit einem Klick beide Sidebars und die Footer ausschalten oder auch beliebig kombinierbar anschalten. Jede Vorlage ist dazu geeignet. Die einzige Begrenzung ist eventuell die Struktur, da wir zum Beispiel bei Struktur 4 absichtlich bestimmte Elemente entfernt haben. Da du aber jede Struktur auf jedes Design anwenden kannst, entsteht dadurch keine Einschränkung.

 

Hast du aktuell ein Design gebaut mit einer Sidebar rechts und möchtest nun zusätzlich einen Footer einbauen, der ebenfalls Inhalte anzeigen kann, dann aktivierst du wie oben gezeigt einfach Footer 1, stellst die Optionen (Farben, Linien usw.) so ein, dass sie zu deinem Design passen und schon hast du einen schönen Bereich unterhalb deiner Webseite um dort wichtige Informationen unterzubringen. Hat dein Footer eine Hintergrundfarbe und möchtest du, dass der Footer bis zum Rand des Browsern ausgedehnt wird dann kannst du in der Kaufversion unsere Copyright-Zeile und den Login-Link ausblenden.

 

Möchtest du einfach nur die Inhalte aus der bisherigen Sidebar in den Footer verlagern, aktivierst du den Footer wie beschrieben und verschiebst dann einfach alle Inhalte aus der Sidebar in den Footer. Anschließend blendest du die Sidebar einfach aus.

 

 

Ausblick und Anmerkungen

Mit dem neuen Footer, der sich nahtlos in die bisherige Bedienung einfügt, weil wir das von langer Hand geplant haben, kannst du nun auch alle Designvorlagen der Mitbewerber "nachbauen" die eine "Sidebar" als Footer nutzen - allerdings viel flexibler und mit mehr Möglichkeiten. Das ist aber nur der erste Schritt. Weitere Optionen für Sidebar und Footer sind bereits fertig und werden bald veröffentlicht. Wir sind natürlich immer darauf bedacht, unsere Kunden, die weiterhin alte Designvorlagen nutzen nicht im Regen stehen zu lassen. Daher müssen wir immer parallel arbeiten. Verwendest du noch eine alte Designvorlage, dann stehen dir diese Funktionen nicht zur Verfügung. Du kannst weiterhin unter dem Menü Optionen deinen HTML Code für den Fussbereich einbinden sofern du ein entsprechendes Design hast. Verwendest du ein neues Design ist dieser Bereich ausgeblendet, da er nicht mehr benötigt wird.

 

Es ist sehr leicht, auf ein neues Design umzusteigen. Vielleicht solltest du jetzt damit anfangen. Wenn du Hilfe brauchst, schicke uns eine Email und wir unterstützen dich dabei.

 

Viel Spaß beim Ausprobieren. Je mehr Rückmeldungen wir bekommen (Kommentare, Anregungen, Wünsche) umso besser können wir die nächsten Schritte planen und page4 noch mehr optimieren. Also traut euch, wir freuen uns.

 

Manfred F. Schreyer und das page4 Team

Neues page4 Blogmodul online

Tags: Updatepage4NewsFunktionenBlog | Kommentare: 17 | Views: 2008

Dienstag 2.August 2016

 

Stifte anspitzen und los gehts

 

Nun steht deiner Creativität nichts mehr im Weg. Ab sofort kannst du alles, was dich bewegt und was du gerne den Besuchern deiner page4 Webseite mitteilen möchtest in dein Online-Tagebuch schreiben und veröffentlichen. Auf deine interessanten Gedanken warten bestimmt schon eine ganze Menge Leser und dank dem neuen page4 Blog-Modul kannst du jetzt beliebig "auf Vorrat" schreiben und selbst bestimmen, wann deine Artikel automatisch online gehen sollen.

 

Auch für die privaten Gedanken sind wir "offen". Möchtest du nur für deine Familie oder deine Freunde schreiben, dann kannst du deinen Blog mit einem Passwort schützen. Das geht mit einem Mausklick und ist sofort aktiv.

 

Du bist schon sehr gespannt? Dann lass mich dir nur noch kurz zeigen, wo du den Blog findest und dann kannst du sofort anfangen und bald deinen ersten Blog-Artikel veröffentlichen.

 

 

 

Das Blog - das Online-Tagebuch bei page4

 

Du brauchst nur auf den Hauptmenü Eintrag "Blog" (1) klicken und bist sofort in der Verwaltung vom Blog. Die bisherigen Untermenüs wurden entfernt da sie nicht mehr notwendig waren. Alle Optionen findest du nun direkt in der Verwaltung.

 

Ausführliche Informationen, wie du das Blog aktivierst findest du ab sofort in unserer Onlinehilfe unter dem Stichwort Blog aktivieren.

 

Um zu diesen Einstellungen zu kommen, musst du nur unten links auf den grünen Eintrag "Einstellungen" klicken. Dort legst du auch alle Parameter für deinen Blog fest. Eine Erklärung zu den Einstellungen findest du ebenfalls in unserer Hilfe.

 

Einige wichtige Punkte vielleicht noch. Wir unterscheiden zwischen einem "Entwurf" und "Veröffentlicht" sowie "Geplant". Ein Entwurf ist immer unsichtbar für deine Besucher. Ein Artikel, der öffentlich ist bleibt solange ein geplanter Artikel, wie das eingetragene Datum noch nicht erreicht ist. Geplante Artikel sind also erst sichtbar, wenn das Veröffentlichungsdatum erreicht ist. Bis dahin werden diese Artikel in der Ablage "Geplant" aufgelistet und auch als "Geplant" markiert. Nur Artikel, die in der Ablage "Veröffentlicht" liegen sind auch sichtbar. Wenn du also einen Artikel fertig geschrieben hast und das Datum auf einen Termin in der Zukunft setzt, dann klicke auf "Öffentlich" und dein Artikel wird automatisch am geplanten Datum sichtbar.

 

Schlagwörter. Beim alten Blog wurden die Schlagwörter in einem Feld eingetragen und mit Kommas getrennt. Beim neuen System schreibst du ein Schlagwort in das dafür vorgesehene Feld und drückst auf "Return". Dann wird das Schlagwort in die Liste über dem Feld aufgenommen. Also bitte nicht mehrere Tags durch Komma getrennt dort eintragen.

 

 

Bilder im Blog. Ein weiterer wichtiger Punkt. Im alten Blog war noch der alte Tiny und die ganz alte Bildauswahl (1) . Dort konntest du direkt Bilder hochladen. Das haben wir aus gutem Grund geändert. Wenn du jetzt im Tiny auf Bild klickst, dann öffnet sich der vom Tiny bereitgestellte Dialog und dort ist jetzt eine Schaltfläche (2) eingebaut, mit der du direkt ein Bild von deinem Computer hochladen kannst. Wenn diese Schaltfläche nicht sichtbar ist bitte den Cache vom Browser löschen.

 

So, genug der Worte, jetzt viel Spaß beim Bloggen. Wie gesagt, ausführliche Anleitungen gibt es in der Online-Hilfe und vielleicht solltest du unseren alten Artikel "Richtig bloggen für mehr Besucher" noch einmal lesen.

 

 

Viel Spaß wünschen

Manfred F. Schreyer
und das gesamte page4 Team

Das neue Blogmodul

Tags: Updatepage4NewsFunktionenBlog | Kommentare: 3 | Views: 1824

Samstag 30.Juli 2016

 

Bloggen wie die Weltmeister

 

Mit unserem neuen Blogmodul wird Bloggen noch einfacher und macht noch mehr Spaß. Und auch das ist nur der Startschuss, denn wir wollen den Blog natürlich noch erweitern und noch weiter verbessern. Insbesondere auch im Frontend. Also neue Templates zur Darstellung der Artikel und der Navigation. Aber dazu mussten wir den ersten Schritt machen und der ist nun fertig.

 

In der ersten Augustwoche, wenn nichts dazwischenkommt vielleicht sogar schon am 1. August geht das neue Blogmodul online.

 

 

 

Das Verwaltungsfenster

 

Leider haben wir hier im Blog nur 740 px Breite zur Verfügung. Das Bild ist aber 1.950 px breit. Wie bei der Seitenverwaltung hast du also den gesamten Bildschirm zur Verfügung. Klicke auf das Bild, um es in der Originalgröße zu sehen. Du hast also sehr viel Platz und immer alles im Blick. Ausführliche Infos dazu möglichst bald in unserer Online-Hilfe.

 

Nachfolgend geben wir dir einen kleinen Überblick über die vielen Funktionen. Wie du siehst, gibt es sehr viele Markierungen auf dem Screenshot.

 

Links ist der Bereich wo du immer Zugriff auf alle Artikel, Kommentare und auf die Optionen hast. Rechts hast du je nach Auswahl unterschiedliche Optionen zur Verfügung.

 

1) Klickst du darauf, werden alle Einträge rechts angezeigt und zwar egal von welchem Typ. Also Entwürfe, Planungen und veröffentlichte Artikel. Hast du mehr als 200 Artikel geschrieben, werden nur die 200 neuesten Artikel angezeigt. Du kannst dann oben rechts (B) das Zeitfenster einschränken. Zum Beispiel könntest du angeben, nur alle Artikel anzuzeigen, die aus 2015 sind oder aus April 2016.

2) Hier sind alle veröffentlichten Artikel, also all die, welche für deine Besucher sichtbar sind.

3) Hier werden alle Entwürfe gesammelt. Jeder neue Artikel ist erstmal ein Entwurf. Das Datum spielt keine Rolle.

4) Geplante Artikel sind alle, die veröffentlicht sind aber ein Datum in der Zukunft haben. Diese werden dann vom System automatisch bei Erreichen des Datums veröffentlicht und damit sichtbar.

5) Du kannst Artikel als Empfohlen markieren. Solche Artikel werden hier abgelegt.

6) Alle gelöschten Artikel landen im Papierkorb. Du kannst sie jederzeit wieder aus dem Papierkorb holen. Erst wenn du den Papierkorb leerst, werden die Artikel darin unwiderruflich gelöscht.

7) Alle von dir angelegten Schlagwörter (Tags) werden hier aufgelistet.

8) Alle Kommentare landen in diesen beiden Ablagen. Im Bereich "Kommentare" sind alle freigegeben Kommentare und im Bereich "Warten auf Freigabe" all die, welche du manuell freischalten musst.

9) Im Bereich Optionen befinden sich alle Einstellungen für den Blog. Dazu klickst du auf diesen Eintrag und es öffnet sich ein Fenster, in dem du Zugriff auf alle Parameter für den Blog hast. Hier schaltest du den Blog aktiv, bestimmst, welche Navigationen angezeigt werden sollen, welches Template verwendet wird und vieles mehr.

 

A) Über den Artikeln befindet sich eine Informationszeile die sich automatisch aktualisiert.

B) Hier kannst du durch Zeiteingrenzung nur bestimmte Artikel anzeigen lassen.

C) Hiermit kannst du Schlagwörter suchen und es werden nur die Artikel angezeigt, die dieses Schlagwort haben. Das Tool ist interaktiv. Sobald du einen Buchstaben eingibst werden alle Tags angezeigt, die diesen Buchstaben enthalten. Du kannst die Suche dann weiter eingrenzen oder den gewünschten Tag aus der angezeigten Liste auswählen.

D) Mit diesem Tool kannst du im Titel eines Blogartikels suchen und dir die Ergebnisse anzeigen lassen. Im Artikel selbst kann nicht gesucht werden. Nur in der Titelzeile.

E) Mit einem Klick setzt du alle Optionen auf die Grundeinstellungen zurück.

F) Immer das erste gefundene Bild im Artikel wird hier als Vorschau angezeigt. Ist kein Bild vorhanden wird eine von uns hinterlegte Grafik angezeigt.

G) Die ersten Wörter von einem Artikel werden hier angezeigt, Zeilenumbrüche werden entfernt. So hast du einen schnellen Überblick um welchen Artikel es genau geht.

H) Jeder Artikel kann manuell auf Entwurf gesetzt werden. Ein bereits veröffentlichter Artikel wird dann wieder für Besucher unsichtbar.

I) Du kannst einen Artikel komplett kopieren.

J) Durch einen Doppelklick auf den Artikel kannst du den Texteditor aufrufen. Alternativ kannst du auch auf diesen Link klicken damit sich der Editor zum Bearbeiten öffnet.

K) Ein gelöschter Artikel wandert erstmal in den Papierkorb und bleibt solange verfügbar wie der Papierkorb nicht geleert wird.

L) Über diesen Link legst du einen komplett neuen leeren Artikel an.

 

Jeder Artikel hat links neben der Vorschau eine Auswahlbox. Du kannst mehrere Artikel gleichzeitig auswählen und dann bearbeiten, also löschen, kopieren usw. Ganz oben ist eine Auswahlbox "Alle auswählen". Hiermit kannst du mit einem Klick alle angezeigten Artikel auswählen. Ein erneuter Klick löscht die Auswahl wieder.

 

 

Der Editor zum Erstellen von Artikeln

 

 

Im neuen Blog-Modul ist jetzt auch der neue Tiny MCE integriert. Diesen kennst du ja bereits. Das Fenster und damit auch der Editor passt sich immer an die komplette Höhe des Browsers an. So hast du genug Platz zum Schreiben. In der Breite haben wir den Editor auf 1.000 px begrenzt. Oben (1) kannst du einen Titel eingeben. Ohne einen eigenen Titel kann der Artikel nicht gespeichert werden. Rechts sind die Optionen zum geschriebenen Blog-Artikel.

3) Bei der Zeit wird immer beim Anlegen des Artikels die aktuelle Zeit eingetragen. Möchtest du einen Artikel später veröffentlichen, kannst du die Zeit manuell überschreiben. Ist der Artikel als "Öffentlich" markiert wird er im Ordner "Geplant" ablegt und automatisch veröffentlicht.

4) Standardmäßig steht jeder Artikel auf "Entwurf". Damit soll verhindert werden, dass du aus Versehen einen unfertigen Artikel veröffentlichst. Klicke auf Veröffentlichen, sobald der Artikel fertig ist und sichtbar werden soll.

5) Du kannst Artikel "empfehlen" und in der Navigation empfohlene Artikel anzeigen lassen.

6) Hier werden alle Tags zum Artikel aufgelistet. Bewegst du die Maus über einen Tag kannst du mit einem dann erscheinenden "x" einen Tag entfernen. Der Tag wird nur vom Artikel entfernt und nicht gelöscht. Mehr zu Tags in der Hilfe.

7) Hier kannst du auf vorhandene Tags zugreifen oder neue Tags anlegen.

 

Wenn du auf Abbrechen klickst gehen alle Änderungen ohne Warnung verloren. Also bitte nur Abbrechen wenn du sicher bist ansonsten auf Speichern klicken um das Fenster zu schließen.

 

Nachfolgend noch kurz der Dialog für die Optionen. Eine einzelne Erklärung dazu spare ich mir hier. Du wirst das alles bald in der Onlinehilfe nachlesen können. Die meisten Optionen erklären sich aber von selbst.

 

 

 

 

Schlussbemerkungen

 

Ich hoffe, dir gefällt unser neues Blog-Modul genauso gut wie uns. Wir haben einige Wochen harter Arbeit investiert und mussten natürlich immer darauf achten, dass alles auch mit den von unseren Kunden bereits erzeugten Daten funktioniert. Zum Glück haben wir einen Kunden, der sehr fleissig ist und unseren Blog wirklich ausgiebig nutzt. Schau dir einfach mal die Seite http://www.hjkc.de/ an. Seit 2011 wurden dort knapp 7.000 Artikel veröffentlicht. Es lohnt sich wirklich aktiv zu werden. Fast 400.000 Besucher haben diese Seite seitdem aufgerufen und wenn man die Kommentare liest, stellt man fest, dass die Bekanntheit der Seite in den Kreisen die sich für dieses Thema interessieren sehr groß ist. Sogar Kosmonaten und Astronauten kennen diese Seite.

 

Google mag es wenn du auf deiner Seite regelmäßig News veröffentlichst. Nutze das Blog-Modul dafür. Das hat mehrere Vorteile. Im Gegensatz zu anderen Baukästen ist unser Blog ein richtiger Blog. Das bedeutet, du hast automatisch eine zeitbasierte Blognavigation in der alle Artikel eingeordnet werden. Du kannst verschiedenen Übersichten einblenden wie zum Beispiel "meist betrachtete Artikel". Unter jedem Artikel kannst du eine Socialshare Leiste anzeigen lassen und vieles mehr.

 

Wie gesagt, wir werden den Blog weiter ausbauen. Mit Funktionen, die du lieben wirst. Wir nutzen den Blog selbst und wollen natürlich in eigenem Interesse, dass dieses Tool immer besser wird.

 

Sobald das neue Blogmodul für alle verfügbar ist gibt es noch eine kleine Zusatzmeldung. Ich denke, diese Vorab-Ankündigung bietet dir die Möglichkeit, dich schon mal zu freuen und dich ein wenig mit dem neuen Blogsystem vertraut zu machen.

 

Eine kleine Sache noch. Wenn das neue Modul aktiv ist brauchst du nur noch auf den Menüeintrag Blog zu klicken um zu Blog zu kommen. Die ganzen Menü-Einträge gibt es dann nicht mehr.

 

Bis in Kürze

Manfred F. Schreyer
und das gesamte page4 Team

Für alle Kaufversionen - der neue Streifen-Abschnitt

Tags: UpdateNewsDesignContent | Kommentare: 17 | Views: 2173

Dienstag 12.Juli 2016

 

Einzigartiges Design mit dem neuen Streifen-Abschnitt

 

Ein neues Tool für alle, die das Besondere lieben

 

Während bei anderen das Sommerloch herrscht, gibt es bei uns eine gute News nach der anderen. Wir haben ja schon letzten Monat gesagt, es bleibt spannend und wir halten Wort. Heute gibt es ein Tool nur für unsere Kunden, die eine Kaufversion nutzen. Wir finanzieren alles durch die User, die mehr wollen, die eine eigene Domain nutzen und die eine unserer sehr günstigen Kaufversionen haben und damit tolle Webseiten bauen. Daher wird es Zeit, mal wieder ein Tool zu bringen, was ausschließlich für unsere Premiumkunden gedacht ist. Wer also eine Light, eine Premium oder eine Professional Version nutzt, darf sich über ein besonderes Highlight freuen.

 

Es gibt kaum einem Webbaukasten im deutschsprachigen Raum, der es erlaubt, solche Effekte wie mit unserem Streifen-Abschnitt so einfach einzubauen. Auch international kennen wir keinen Anbieter, der solch eine Option anbietet vor allem in Verbindung mit so einer einfachen Bedienung.

 

So sieht das neue Inhaltselement aus:

 

 

Die Bedienung ist ganz easy. Du legst einfach einen neuen Content (Inhaltselement) an, so wie du es gewohnt bist. Nutzt eines unserer Bilder aus dem Archiv oder nimmst ein eigenes Bild in entsprechender Größe. Bestimmst die Höhe und Art des Streifens und dann speichern und fertig.

Ausführliche Infos gibt es natürlich auch schon auf unseren Hilfeseiten und wir haben eine bzw. zwei Musterseiten fertiggestellt. Dort erklären wir dir die Funktion auch noch einmal ausführlich und vor allem kannst du live auf einer komplett mit page4 erstellten Seite sehen, wie die Streifen dir helfen ein aussergewöhnliches Design umzusetzen. Auf der Musterseite verwenden wir das Script aus einem unserer Blogartikel um die Navigation stehend zu machen. Wir finden dass sieht einfach besser aus.

 

Warum machen wir das alles? Warum stellen wir in letzter Zeit so viele neue Optionen zur Verfügung? Ganz einfach. Wir brauchen auch mal Lob und hoffen natürlich, je mehr wir euch mit neuen Funktionen und Designvorlagen usw. begeistern können umso fleissiger füllt ihr unseren Blog mit euren Kommentaren.

Das spornt uns dann alle noch mehr an. Versprochen. Lächelnd

 

Ok, dass ist nur die halbe Wahrheit. Es stimmt zwar auch - unser Team besteht aus netten Menschen die sich natürlich freuen, wenn unsere User sich lobend über neue Funktionen äußern oder wenn unser Support helfen konnte und dafür nette Worte bekommt.

 

Aber vordergründig ist es ganz einfach so, dass wir in den letzten Monaten so viele Ideen von Euch bekommen haben und wir natürlich auch ganz viele eigene Ideen haben und nachdem wir eine fantastische Basis entwickelt haben, die alle diese Ideen berücksichtigt, sind wir nun in der Lage, viele tolle Dinge relativ schnell umzusetzen. Klar gibt es immer Bereiche, wo wir wirklich Monate dran arbeiten und "tüfteln" - aber zwischendurch wollen wir euch einfach mal mit solchen Tools wie dem heute vorgestellten Streifen erfreuen.

 

Außerdem wissen wir, dass begeisterte Kunden die beste Werbung für uns sind und was will man mehr. Wir haben Spaß, unsere Kunden sind zufrieden und unser System bekommt immer mehr begeisterte User, weil sich immer mehr rumspricht, dass page4 einfach fantastisch ist und man tolle Webseiten damit erstellen kann. So macht die Arbeit richtig Lust auf mehr. Das musste ich einfach mal loswerden.

 

Der neue Content wird morgen, also am 13. Juli im Laufe des Tages mit ziemlicher Sicherheit online gehen. Ausnahmsweise stelle ich diesen Blogartikel schon ein paar Stunden vorher online, weil es einfach so viele Informationen zu diesem neuen Tool gibt und ihr euch schon mal so richtig mit dem neuen Streifen befassen könnt und dann sofort anfangen könnt, alles auszuprobieren.

 

Bis demnächst und viel Freude beim Gestalten
Euer page4 Team

Manfred F. Schreyer

Neue Sterne am Himmel

Tags: Updatepage4Design | Kommentare: 6 | Views: 2727

Samstag 4.Juni 2016

 

Neue Sterne am Himmel

 

 

27 neue Designvorlagen

 

Gute Nachricht für alle, die gerne auf eine fertige Designvorlage zurückgreifen, um diese dann einfach an die eigenen Wünsche anzupassen. Ab sofort sind weitere 27 neue Vorlagen online und für alle Versionen verfügbar. Unsere neuen Designvorlagen sind, wie vielleicht bekannt, nach Himmelkörpern, also Planeten, Sterne, Sternbilder usw. benannt. Mit der Veröffentlichung der neuen Vorlagen sind damit quasi weitere, neue Sterne am Design-Himmel von page4 aufgegangen.

 

Zusammen mit den 7 Vorlagen, die zum Start verfügbar waren, kannst du nun auf 34 moderne Design-Ideen zugreifen. Die zusätzlichen 33 Classic Designvorlagen, die ebenfalls unsere neue Technik nutzen,, sind weiterhin verfügbar, so dass du jetzt insgesamt 67 vorbereitete Gestaltungsvorschläge zur Auswahl hkast.

 

Das es weiterhin einige hundert alte Vorlagen gibt, sei nur am Rand erwähnt. Du solltest, wenn möglich, auf eine neue Vorlage umsteigen, nur so nutzt du alle Funktionen von page4 und kannst wirklich moderne Webseiten erstellen. In Kürze werden wir einen kleinen Blogartikel schreiben und dir zeigen, wie du ganz einfach zu den neuen Designvorlagen wechseln kannst.

Die alten Vorlagen bleiben natürlich weiterhin online, weil es immer noch User gibt, die so eine Vorlage nutzen und nicht umsteigen möchten. Vielleicht überzeugen die neuen Designvorschläge weitere Nutzer davon, zum neuen System zu wechseln.

 

Ein kleiner Vergleich mit anderen Webbaukästen

 

In Testberichten wird gerade bei Webbaukästen immer gerne geschaut, wie viele Vorlagen ein System bietet. Bisher haben die meisten Testberichte page4 ignoriert, obwohl unser System von sehr vielen Usern genutzt wird. Ich denke, es ist daher angebracht, selbst einmal zu vergleichen, was andere Systeme im Bereich Designvorlagen bieten und ob page4 mithalten kann.

 

Man muss bei so einem Vergleich immer beachten, dass jedes System anders ist und bei den meisten Mitbewerbern hat man nur dann die Chance auf ein individuelles Design, wenn man selbst in den Programm-Code eingreift. Jimdo bietet ein Interface, wo man unter Berücksichtigung bestimmter Regeln eigene selbst programmierte Designvorlagen einbinden kann. Weebly erlaubt es dem User, den completten Sourcecode inkl. Bilder hochzuladen. Andere Systeme erlauben, dass man den hinterlegten Code manuell verändern kann. Wir haben bisher bewusst darauf verzichtet, unseren Usern diese Möglichkeit zu eröffnen, auch wenn das System so programmiert ist, dass wir solch eine Option einbauen könnten. Statt dessen haben wir unseren Designeditor komplett überarbeitet und bieten nun als einziges uns bekanntes System weltweit die Möglichkeit, auf so gut wie alle Parameter einer Webseite über Dialoge Einfluss zu nehmen. Erstmals ist es wirklich möglich, ohne Kenntnisse einer Programmiersprache eine individuelle Webseite zu gestalten. Die von uns zur Verfügung gestellten Vorlagen sind nur als Starthilfe gedacht und wurden, und auch das ist einmalig, komplett mit den vorhandenen Funktionen erstellt, auf die jeder User Zugriff hat.

 

Im Vergleich zu allen anderen Baukästen kann man daher mit page4 wirklich Millionen individueller Designvorlagen selbst erstellen. Während bei Jimdo, Wix, Weebly, 1&1 und anderen Systemen Designvorlagen individuell programmiert werden und dann als User nur begrenzt auf bestimmte Parameter wie Farben und Bilder Einfluss nehmen kann, geht page4 einen ganz anderen Weg.

 

Strukturen - der Rahmen für dein Design

Es gibt aktuell 4 Strukturen, dass sind HTML Gerüste, die bestimmen, wie die möglichen Elemente der Webseite (Header, Sidebar, Footer, Inhalt, Navigation) platziert werden können. Das sind quasi die individuell programmierten Vorlagen, die man als User dann völlig frei gestalten kann. Alle vorhandenen Designvorlagen beruhen auf diesen vier Strukturen. Wir haben natürlich spezielle Tools, um fertige Vorlagen abzuspeichern, aber ansonsten machen wir beim Gestalten von neuen Vorlagen genau das, was du als User auch machen kannst. Natürlich werden wir die Strukturen erweitern und dann damit natürlilch auch Designvorlagen erstellen, die heute vielleicht noch nicht möglich sind. Aber sobald wir das können, steht dir diese neue Struktur dann auch zur Verfügung.

 

Sobald du eine Vorlage eingeladen hast, kannst du diese mit dem Editor komplett an deine Bedürfnisse anpassen. Die Vorlagen dienen eigentlich nur als Idee und Basis, auf der du aufbauen kannst. Wie du es gewohnt bist, kannst du jede Vorlage mit dem Design-Editor bearbeiten und so völlig einzigartige Webseiten gestalten.

 

Zusammen mit den nun 34 neuen Vorlagen haben wir aktuell 67 Vorlagen online, die du nutzen kannst, um deine persönliche Webseite zu gestalten. Wenn man berücksichtigt, dass man jede der Vorlagen auf vielfältige Weise verändern kann, haben wir weit mehr Designvorlagen als die größten unsere Mitbewerber zusammen zur Verfügung stellen. Das hört sich unglaublich an, entspricht aber den Tatsachen. Natürlich haben unsere Mitbewerber Vorlagen, die wir aktuell noch nicht "nachbauen" könnten. Aber wir entwickeln unser System natürlich ständig weiter.

 

Greifen wir uns  einmal folgende Parameter heraus und berechnen daraus dann die möglichen Variationen, die mit den 67 verfügbaren Designvorlagen mindestens möglich sind.

 

 

Die Gesamtbreite des Designs verändern

 

Du kannst die Gesamtbreiten von 700 bis 1.500 px in Schritten von 10 px anpassen. Rechnen wir einfach nur für jede Vorlage 5 verschiedene Breiten, also 700 px, 850 px, 940 px, 1.050 px und 1.200 px. Dann hast du schon 335 Designvariation.Du fragst dich sicher, ob man so einen Vergleich anstellen kann. Dazu musst du wissen, dass Jimdo, ein Mitbewerber aus Hamburg, zwar nur 38 Vorlagen hat, aber selbst behauptet, weit mehr als hundert Designvorlagen anzubieten. Warum? Weil es von den einzelnen Vorlagen sogenannte Variationen gibt und tatsächlich unterscheiden sich diese Variationen zum Beispiel in der Breite der Vorlage, in der Höhe des Headers oder schlicht in den Farben. Alles Einstellungen, die man als User nicht selbst anpassen kann. Da die wenigstens Mitbewerber die Option bieten, die Breite manuell anzupassen geht das nur über diesen Weg und so hat man dann schnell eine Vielzahl an Vorlagen, die sich allerdings kaum unterscheiden. Andere Anbieter machen das ähnlich.

 

Aus Gründen der Fairness gehen wir nur von Variationen aus, die deutlich sichtbar sind. Man könnte natürlich auch berechnen, dass man von jeder Designvorlage rund 80 Variationen herstellen kann nur indem man die Breite anpasst. Denn die 800 px "Spielraum" zwischen 700 und 1.500 px kann man in 10 px Schritten anpassen was 81 verschiedene Breiten ergibt. Dann hätte man nicht 67 Vorlagen sondern insgesamt bereits 5.360 Variationen. Es ist klar, dass kein Baukasten 5.360 verschiedene Templates programmiert, nur um so viele unterschiedliche Breiten zur Verfügung zu stellen. Trotzdem wollen wir nicht unerwähnt lassen, dass du mit page4 dazu einfach nur einen Schieberegler bewegen musst. Das man natürlich auch die Breiten der Sidebars anpassen und Abstände zwischen den Elementen festlegen kann ist selbstverständlich und würde noch mehr Variationen nur im Bereich der Breite ergeben.

 

Halten wir einfach nur fest, unsere 67 Vorlagen ergeben im Zusammenspiel mit 5 verschiedenen Gesamtbreiten bereits 335 unterschiedliche Designvorlagen.

 

Die Höhe des Headers anpassen

 

Du kannst bei page4 natürlich auch die Höhe der Header anpassen. Berücksichtigen wir nur einen Header, da die meisten Anbieter nicht mehr Header zur Verfügung stellen. Du kannst die Höhe im Bereich von  50 bis 500 px in Schritten von jeweils 5px anpassen. Wenn wir je Vorlage nur vier Variationen nehmen, also 100 px, 200 px, 300 px und 400px, kommst du schon auf 1.340 unterschiedliche Designvorlagen. Und du kannst sicher sein, Designvorlagen mit so unterschiedlich hohen Header sehen schon sehr unterschiedlich aus. Auch hier muss man sagen, dass andere System wieder zu jeder Vorlage einfach verschiedene feste Variationen mit unterschiedlichen Headerhöhen liefern, da man diese oft nicht anpassen kann.

 

Wir kommen also allein mit unseren aktuellen Vorlagen und nur durch Anpassung der Gesamtbreite und der Headerhöhe in wenigen Abstufen schon auf gewaltige 1.340 Vorlagen. Nicht eines der uns bekannten Systeme stellt so viele Vorlagen zur Verfügung.

 

Natürlich kannst du noch viel mehr ändern. Eine dritte Option, die auch kein anderes System bietet, möchten wir dir noch vorstellen und in die Berechnung einbauen. Alle anderen Baukästen können zwar die Farben und Schriften der Navigation ändern (mehr oder weniger). Aber jede Designvorlage hat eine Navigation, die fest programmiert ist und ein ganz bestimmtes Aussehen hat und immer an der selben Stelle platziert ist. Bei page4 bist du nicht an solche starren Regeln gebunden.

 

Die Navigation anpassen

 

Du kannst bei jeder Vorlage die Navigation austauschen und du kannst die Navigation an verschiedenen Positionen platzieren. Im Moment haben wir 8 vertikale Navigationstemplates und 11 horizontale Vorlagen. Weitere sind in Kürze fertig.

 

Nehmen wir an, jede der oben möglichen 1.340 Variationen verändern wir, indem wir jeweils 3 Variationen erzeugen durch den Austausch des Navigationstemplates. Dadurch ändert sich das Design ziemlich deutlich, denn Navigationen können sich im Aussehen stark unterscheiden. Allein der Wechsel von einer horizontalen zu einer vertikalen Navigation ergibt schon ein völlig neues Design. Aber auch der Austausch einer horizontalen Navigation durch ein anderes Template kann das gesamte Aussehen stark verändern. Wir erhalten dadurch insgesamt 4.020 Designvariationen, die alle unterschiedlich aussehen.

Zusätzlich erzeugen wir noch jeweils zwei Versionen je Design indem wir die Navigation anders platzieren. Du kannst zum Beispiel eine horizontale Navigation ganz oben über dem Header platzieren, im Header oder unter dem Header. Jedesmal entsteht ein völlig anderes Design mit einem neuen Look. Bei nur zwei Variationen kommen wir so auf 8.040 Designvorlagen, die du in wenigen Sekunden erzeugen kannst.


Brechen wir an dieser Stelle ab, denn es ist noch gar nicht berücksichtigt, dass du bei jeder Vorlage die Struktur und damit die Anordnung ändern, du kannst Elemente wie Header, Footer und Sidebar aus- oder einblenden, das gesamte Design spiegeln, entscheiden ob die Sidebars nur so lang sein sollen wie der Inhalt in der Sidebar es vorgibt oder immer genauso hoch wie die gesamte Webseite, Linien einschalten, Ecken abrunden, Schatten hinterlegen und vieles mehr. Wenn wir all diese Variationen berücksichtigen wäre die Gesamtzahl der schon jetzt möglichen Varianten extrem hoch.

 

Vergleichen wir das ruhig einmal mit den Mitbewerbern. Wix hat im Moment 290 Vorlagen. Weebly kommt auf 60 Vorlagen. Jimdo hat 38 Vorlagen und insgesamt 134 Variationen, also zusammen 172 Templates. 1&1 hat insgesamt 513 Vorlagen. Diese großen Mitbewerber stellen zusammen also insgesamt 1.035 Designvorlagen für ihre User bereit. Wir kommen aufgrund der Möglichkeit von page4 mit unseren aktuellen Vorlagen auf mindestens 8.040 verschiedene Designvorlagen. Und das ist sehr niedrig gerechnet.

 

Du kannst viele Vorlagen, die unsere Mitbewerber anbieten, ganz einfach mit page4 nachbauen. Alles ist noch nicht möglich, da man bei einer individuellen Programmierung jeder einzelnen Vorlage natürlich Dinge einbauen kann, die sich nur schwer mit Bausteinen umsetzen lassen. Wir werden daher weitere Strukturen fertigstellen, um auch ausgefallene Ideen umsetzen zu können. Das Gute daran ist, Designvorlagen, die mit page4 nachgebaut sind, sehen zwar so aus, wie Designvorlagen von Mitbewerbern haben aber nicht deren Begrenzung sondern können mit den vielfältigen Tools von page4 hervorragend optimiert werden.

Schon jetzt ist klar, wer sich mit page4 befasst, wird feststellen, dass kein anderes System so viele Designmöglichkeiten bietet wie wir.

 

Wer die letzten zwei Jahre verfolgt hat wird außerdem feststellen, dass wir regelmäßig neue Updates und neue Funktionen zur Verfügung stellen. Wir arbeiten dabei eng mit unseren Usern zusammen und freuen uns über jede noch so ausgefallene Idee, die uns hilft, page4 noch besser zu machen. Schon jetzt sind ganz viele neue Ideen in Arbeit und werden euch bestimmt begeistern, wenn wir soweit sind, die ersten davon online zu stellen.

 

Bis dahin freuen wir uns über Kommentare, Kritik, Lob und schickt uns weiterhin eure Ideen und Anregungen. Was sinnvoll ist und technisch möglich, kommt in unsere Planung und wird Realität werden.

 

Bis dahin viel Spaß mit page4

Euer page4 Entwicklungs- und Supportteam

 

PS: Es wäre klasse, wenn ihr diesen Artikel mit möglichst vielen Freunden teilt, damit auch diese erfahren, wie man tolle Webseiten bauen kann. Vielen Dank.

PPS: Eine Übersicht aller Designvorlagen findest du auf unserer Webseite unter http://de.page4.com/design/

Neuer Uploader für Bilder

Tags: Updatepage4 | Kommentare: 13 | Views: 3080

Dienstag 17.Mai 2016

 

Einfacher Bilder hochladen

Ab sofort könnt ihr Bilder für eure Webseite noch einfacher hochladen. Voraussetzung ist, dass ihr einen modernen Browser verwendet. Also Firefox, Chrome, Safari, Edge oder den Internet-Explorer ab Version 10. Das Gute daran ist, dass Flash nicht mehr benötigt wird.

Es gibt aktuell zwei Möglichkeiten, bei page4 Bilder hochzuladen.

 

Ein Bild hochladen

Überall wo man genau ein Bild hochladen kann, findet ihr folgende Toolbar.

 

 

 

Die einzelnen Icons haben folgende Funktion.

 

1) Ein Bild aus der Bildverwaltung einladen.

2) Ein Bild aus dem Bildarchiv (frei verfügbare Bilder) einladen.

3) Ein Bild vom eigenen Computer hochladen.

4) Die Verlinkung zum Bild löschen. Das Bild selbst bleibt in der Bildverwaltung erhalten. Möchtest du das Bild komplett löschen, musst du das direkt in der Bildverwaltung machen.

 

Was ist neu?

Klickst du jetzt auf das Icon (3), um ein Bild vom Computer hochzuladen, öffnet sich sofort der Dialog zum Auswählen des Bildes. Flash wird nicht mehr benötigt. Für kostenlose Seiten bleibt die Begrenzung der Dateigröße bei 2 MB, für Kaufversionen haben wir diese Grenze auf 4 MB erhöht. Im Gegensatz zu anderen Systemen laden wir alle Bilder im Original hoch und verkleinern diese nicht. Je größer die Bilddatei ist, umso schneller wird der verfügbare Platz verbraucht. Es ist also weiterhin ratsam, die Bilder vor dem Hochladen auf die benötigte Größe zu optimieren.

 

Mehrere Bilder gleichzeitig hochladen

Überall, wo man mehrere Bilder benötigt (Galerien) haben wir einen Button zum Hochladen eingebaut.

 

Der Unterschied zwischen diesen beiden Button:

1) Mit "Bilder auswählen..." öffnest du die Bildverwaltung und kannst dann beliebig viele Bilder aus der Verwaltung übernehmen.

2) Mit "Bilder hochladen" öffnet sich ein Dialog zum Hochladen von Bilder von deinem Computer.

 

Was ist neu?

Zum einen brauchst du auch hier kein Flash mehr und zum anderen kannst du Bilder zusätzlich per Drag&Drop hochladen. Der Dialog dazu sieht wie folgt aus.

 

 

1) Der Hilfetext sagt dir genau, wie du Bilder hochladen kannst. Entweder schiebst du deine Bilder einfach mit der Maus in den Dialog. Oder du klickst auf den Dialog und es öffnet sich ein Auswahldialog, um Bilder vom Computer auszuwählen. Für die kostenlose Version ist das gleichzeitige Hochladen auf 3 Bilder begrenzt. Du kannst wie in der vorherigen Version mit Flash In Ruhe deine Bilder zum Hochladen "sammeln" und wenn du alle Bilder ausgewählt hast, klickst du auf Hochladen um die Bilder dann auf deine Webseite hochzuladen. Aus technischen Gründen haben wir die maximale Anzahl der Bilder, die du mit einer Kaufversion gleichzeitig "sammeln" und hochladen kannst, auf 500 Bilder begrenzt. Es dürfte sehr unwahrscheinlich sein, dass du mehr als 500 Bilder auf einmal hochladen wirst, so dass diese technische Begrenzung niemals sichtbar werden dürfte. Sollte das doch einmal der Fall sein, erscheint ein Hinweis.

 

Vorschau-Bilder zeigen dir genau, was du ausgewählt hast

Beim "Zusammenstellen" der Bilder zeigt der Dialog von jedem Bild eine kleine Vorschau an. Das sieht dann so aus:

 

 

Der Dialog passt sich deinem Bildschirm an. Reicht der Platz nicht aus, um alle Bilder anzuzeigen, wird eine Scrollbar rechts sichtbar, so dass du jederzeit zu den nicht sichtbaren Bildern scrollen kannst. Hast du alle Bilder ausgewählt, klickst du auf Hochladen (2). Der Dialog schaltet in den "Hochlade-Modus" und blendet die Button unten aus. Du kannst in dieser Zeit keine weiteren Bilder auswählen und das Hochladen auch nicht abbrechen.

 

 

 

1) Über den Bildern, die gerade hochgeladen werden erscheint eine Infozeile und informiert dich darüber, wie viele Bilder bereits hochgeladen sind und wie viele Bilder insgesamt hochgeladen werden.

Alle Bilder "wandern" in der "Bildzeile" von rechts nach links. Dabei wird genau angezeigt, was der Uploader gerade macht.

2) Alle hochgeladenen Bilder erscheinen farbig und befinden sich links von der Mitte.

3) Das aktuelle Bild ist in der Mitte der Zeile und wird langsam farbig. Sobald es komplett hochgeladen ist (komplett farbig ist) wird es nach links verschoben und das nächste Bild wird hochgeladen.

4) Alle Bilder in der Warteschlange sind aufgehellt dargestellt.

5) Unter der Bildzeile siehst du genaue Informationen zum Bild, welches gerade hochgeladen wird. Du siehst den Bildnamen, die Dateigröße und die Abmessungen des Bildes.

Wenn alle Bilder hochgeladen sind, schließt sich der Dialog und du befindest dich wieder im allgemeinen Dialog für die Galerie.

 

Unsere Bildverwaltung

Die Bildverwaltung ist ein Sonderfall. Um neue Bilder in die Verwaltung zu laden musst du auf einen Texlink "Neues Bild hochladen" klicken. Mit dem Update erscheint dann auch der oben beschriebene Dialog und du kannst Bilder auf die neue Art und Weise hochladen.

 

Was ist neu?

Bisher war es so, dass alle Bilder immer im Hauptordner der Verwaltung einsortiert wurden. Das ist jetzt anders. Bevor du neue Bilder in die Verwaltung lädst, solltest du einfach den Ordner auswählen, in dem die neuen Bilder eingeordnet werden sollen. Dazu klickst du einfach mit der Maus auf den Order und die Verwaltung zeigt dir dann rechts alle Bilder aus dem Ordner an. Jetzt weiss page4 wo die neuen Bilder abgelegt werden sollen. Anschließend klickst du auf "Neues Bild hochladen" und nutzt den neuen Dialog zum Hochladen deiner Bilder.

 

Übrigens....

Falls du einen alten Browser verwendest, der die neue Technik nicht unterstützt wird weiterhin der Flash-Dialog angezeigt. So ist sichergestellt, dass du in jedem Fall Bilder hochladen kannst. Entweder mit dem neuen Update und einem neuen Browser oder wie bisher mit Flash und einem älteren Browser. Wir empfehlen dir in jedem Fall, nur aktuelle Browser zu verwenden. So bist du immer auf der sicheren Seite.

 

Viel Spaß mit dem Update und wie immer freuen wir uns natürlich über eure Kommentare, Anregungen und Wünsche.

 

Manfred F. Schreyer
und das Team von page4

Update Galerie Teil 1

Tags: Updatepage4Galerie | Kommentare: 9 | Views: 2899

Mittwoch 20.April 2016

 

Die Galerie "Mauerwerk"

 

Es ist gar nicht so leicht, neue Funktionen mit einem sinnvollen Namen zu versehen. Die neue, ab sofort verfügbare Galerie gibt es auch bei anderen Baukästen in ähnlicher Form und wird dort unter anderem als "Horizontal" oder als "Justified" bezeichnet. Die Galerie macht dabei folgendes: Sie stellt alle Bilder in horizontalen Reihen dar und versucht dabei, die Bilder so zu plazieren, dass ein rechteckiger Raum komplett ausgefüllt wird. Dazu werden die Reihen teilweise unterschiedlich hoch dargestellt, je nachdem wie viele Bilder in einer Reihe passen. Wenn man genügend Bilder in der Galerie eingebaut hat, entsteht im Grunde genommen ein Muster wie bei einem Mauerwerk. Die Bilder bilden dabei die Steine und die gesamte "Mauer" wird mit Bildelementen ausgefüllt. Wir haben uns daher entschlossen, diese neue Galerie einfach "Mauerwerk" zu nennen. Auf jeden Fall ist sie sehr schön, bietet viele Möglichkeiten und hilft dabei, eure Bilder noch besser zu präsentieren.

 

Nachfolgend eine kurze Beschreibung aller Möglichkeiten der neuen Galerie. Viel Spass beim Ausprobieren. Wie immer freuen wir uns natürlich über Lob, Kritik, Anregung und mehr damit wir für euch alles noch weiter verbessern können.

 

Bildauswahl

Die neuen Galerien werden alle in einem Inhaltselement - der normalen Galerie - zusammengefasst. Man kann dann jederzeit mit einem Mausklick zu einer anderen Darstellung wechseln. Die Bildauswahl (1) ist natürlich wie gehabt. Ihr könnt aus der Bildverwaltung Bilder auswählen (2) die bereits hochgeladen sind. Um Bilder von eurem Computer direkt in die Galerie zu laden nutzt man den Button "Bilder hochladen" (3). Normalerweise werden die Bilder in der Reihenfolge angezeigt und sortiert, in der ihr sie aus der Verwaltung auswählt oder hochlädt. Ihr könnt die Reihenfolge jederzeit per Drag&Drop mit der Maus ändern oder wenn ihr auf den Button "A-Z" (4) klickt, werden die Bilder nach dem Namen sortiert. Mit "Invertieren" (5) dreht ihr die Reihenfolge ganz einfach um. Mit "Tabelle" (6) kannst du die Ansicht der eingeladenen Bilder ändern. 

Klickt man auf das Feld "Optionen" welches unter jedem Bild angezeigt wird, kann man eine Beschriftung eingeben. Mit dem roten X löscht du ein Bild aus der Galerie.

 

Plugin (7)

Diese Option ist seit dem Update von letzter Woche online. Im ersten Schritt haben wir hier die Galerie aus der Sidebar eingebaut und die normale Galerie in Classic Galerie umbenannt. Mit dem heutigen Update gibt es eine weitere Galerie mit dem Namen "Mauerwerk". Die nachfolgenden Optionen beziehen sich auf diese neue Galerie. Jede Galerie hat unterschiedliche Optionen. Wenn du eine andere Galerie auswählst, dann ändern sich auch die Einstellungen dafür. Alle von dir gemachten Einstellungen bleiben erhalten, so dass du jederzeit von einer zur anderen Galerien wechseln kannst.

 

Die Darstellung auf deiner Webseite gestalten

8) Die horizontalen Zeilen oder Reihen können eine voreingestellte Höhe bekommen. Du kannst Werte zwischen 50 und 250 px eingeben. Beachte aber bitte, dass die Galerie diese Höhe nur als Richtwert nimmt und je nachdem, wie unterschiedlich deine Bilder sind, auch Reihen anlegt, die eine andere Höhe haben können. Du kannst die Bilder ohne Zwischenraum darstellen (0 px) oder bis zu 50 px Abstand einstellen. Wir finden kleine Abstände von 1 bis 2 px sehen meist am besten aus. Das ist aber natürlich Ansichtssache und hängt auch davon ab, ob du einen Rahmen um jedes Bild legen willst.

9) Jedes Bild kann einen Rahmen bekommen und im Zuge dieser Umrandung kannst du die Ecken abrunden. Der Rahmen kann bis zu 20 px stark sein, eine Farbe und eine Transparenz bekommen und die Ecken können bis 99 px abgerundet werden.

 

Effekte für die Galerie

A) Hovereffekt. Wenn du die Maus über ein Bild bewegst, dann kannst du damit verschiedene Effekte auslösen. Wenn du weiter unten angegeben hast, dass bei einem Mausklick das entsprechende Bild vergrößert angezeigt werden soll, dann erscheint bei jedem Effekt eine Lupe über das Bild, welches du mit der Maus berührst. Ansonsten kannst du aus folgenden Effekten wählen:

Keiner = Das Bild bleibt unverändert. Lediglich die Lupe wird sichtbar, wenn das Bild vergrößert werden kann.

Abdunkeln = Das Bild wird abgedunkelt, wenn du mit der Maus das Bild berührst. Es wird eine dunkle, transparente Fläche über das ganze Bild gelegt.

Schwarz/Weiss = Das Bild wird ohne Farben, also nur in Graustufen angezeigt, solange sich die Maus im Bereich des Bildes befindet.

Sepia = Das Bild wird einfarbig in braunen Farbtönen angezeigt. Dieser Effekt wird gerne verwendet, um Nostalgie zu simulieren.

B) Bildbezeichnung. Damit ist die Beschriftung des Bildes gemeint. Es gibt drei Optionen, diese Beschriftung anzeigen zu lassen.

Nur in Volldarstellung = Die Beschriftung wird nur angezeigt, wenn das Bild vergrößert dargestellt wird.

Beim Drüberfahren = Immer wenn du mit der Maus ein Bild berührst, wird die Beschriftung eingeblendet.

Immer angezeigt = Die Beschriftung ist immer sichtbar.

Damit der Text immer gut lesbar ist, wird er in einem abgedunkelten Feld in heller Schrift mittig angezeigt.

 

Design der Ansicht bei Mausklick

Wenn du eine Galerie angelegt hast, werden die Bilder laut deinen Vorgaben auf der Webseite angezeigt. Bei unserer neuen Galerie werden alle Bilder in Reihen dargestellt, die wie ein Mauerwerk aussehen. Klickst du auf ein Bild, dann kannst du hier entscheiden was passieren soll.

Unter dem Begriff Bildvergrößerung (C) gibt es drei Optionen.

Keine = Es passiert nichts. Der Besucher kann die Bilder nur in der Größe betrachten, die von der Galerie vorgegeben wird.

Lightbox = Das Bild wird in einer Box vergrößert dargestellt und man kann mit Pfeiltasten durch die Bilder steppen.

Vollbild = Der ganze Bildschirm wird abgedunkelt und das Bild so groß wie möglich angezeigt. Auch hier kannst du mit Pfeiltasten durch die Bilder steppen.

 

Bist du zufrieden mit deinen Einstellungen kannst du alles Speichern (D) und die Galerie live auf deiner Webseite ansehen. Möchtest du eine andere Darstelliung, kannst du jederzeit zu einer der anderen beiden Galerie-Arten wechseln. In den nächsten Wochen und Monaten werden wir weitere Galerien einbauen. Unter anderem ist geplant, eine Galeire zu integrieren, die so ähnlich wie die Diashow aussieht, aber ohne Flash funktioniert. Wenn du möchtest, dass deine Galerien auch auf mobilen Geräten anzeigt werden, solltest du einer der neuen Galerien verwenden.

 

Hinweis zum letzten Update

Vielen Dank für die vielen Rückmeldungen zum letzten Update. Wir konnten dadurch einige Dinge noch verbessern. Außerdem haben wir den Kalender um eine kleine Funktion erweitert. Man kann jetzt auch einfach nur das Datum anzeigen. Es ist geplant, den Kalender mit weiteren Funktionen zu versehen. Das wird aber noch etwas dauern. In den nächsten Wochen wird es weitere Updates geben. Wenn ihr besondere Wünsche habt, schreibt uns einfach eine Email. Wir prüfen alles und werden sinnvolle und machbare Vorschläge gerne aufgreifen.

Bis dahin viel Spaß beim Ausprobieren der neuen Galerie.

 

Manfred F. Schreyer und das ganze Team

Update 2016 Teil 2

Tags: Updatepage4News | Kommentare: 18 | Views: 2497

Dienstag 12.April 2016

 

Update nun für alle online

Nachdem wir letzte Woche das Update für alle kostenlosen Seiten online gestellt haben, folgt heute das Update für alle Kaufversionen. Wie versprochen erklären wir heute weitere Teile des Updates.

 

Die neue Linkliste kurz erklärt

Neu: Da die Linkliste sehr viele Optionen enthält und die Vorschau, die gleichzeitig zum Bearbeiten der Liste dient, je nach Inhalt ziemlich hoch werden kann, ist der Dialog flexibel aufgebaut. Hast du einen breiten, großen Bildschirm, dann bricht der Dialog um und zeigt den ersten Teil inkl. der Vorschau links und die Einstellungsmöglichkeiten rechts. Das erleichtert die Erstellung einer Liste und du hast alle Optionen im Blickfeld.

 

 

1) In diesem Bereich füllst du die Linkliste mit Leben. Dazu hast du 4 Elemente, die du anlegen kannst. Das geht auf zwei Arten. Entweder klickst du einfach auf den entsprechenden Button (2 bis 5) oder du ziehst den Button mit der Maus in die Vorschau an die gewünschte Stelle.

Folgende Elemente stehen zur Verfügung

2) Überschrift. So kannst du die Liste gut strukturieren.

3) Verlinkung. Du kannst interne Links zu Seiten, externe Links oder Email-Adressen angeben.

4) Linie. Damit kannst du Bereiche unterteilen.

5) Abstandselement. Zum Gestalten der Liste.

Die Vorschau (6) dient gleichzeitig zum Anlegen und Bearbeiten der Elemente. Ähnlich wie im Formular. Wenn du mit der Maus über ein Element fährst dann erscheint rechts ein Menü zum Bearbeiten und Löschen. Klickst du mit der Maus auf ein Element kannst du es per Drag&Drop verschieben. Wie du am Beispiel sehen kannst, ist es außerdem möglich, verschiedene Icons zu nutzen. Dazu unten mehr.

7) Wie beim Counter haben wir auch hier ein paar Vorlagen mitgeliefert, die du natürlich beliebig anpassen kannst. Aktuell sind es 11 Vorlagen.

 

Das Design der Liste.

Man muss unterscheiden zwischen dem Umfeld, in dem deine Links platziert werden und den Links selbst. Das Umfeld nennen wir hier Listenbox. Die Box selbst kann von einem Rahmen umgeben sein.

8) Die Listenbox hat mehrere Optionen

a) Maximale Breite. Die Liste versucht immer die hier angegebene Breite zu erreichen. Wie alle Inhalte ist auch die Liste dynamisch. Ist die Spalte, in der die Liste erscheint, schmaler so wird natürlich auch die Listenbox nur so breit angezeigt wie möglich.

b) Innenabstand. Hier legst du fest, wie viel Abstand zwischen dem Rand und den Elementen sein soll.

c) Rundung. Natürlich kann die Box auch abgerundete Ecken haben.

d) Hintergrundfarbe. Damit wird die gesamte Box mit einer Farbe hinterlegt. Diese kann zusätzlich eine Transparenz haben.

e) Zwischenabstand. Der Abstand zwischen den einzelnen Elementen.

9) Rahmen. Um die Box kannst du einen Rahmen legen der die üblichen Optionen hat.

 

Kommen wir nun zum Design der Elemente.

Ein Link besteht immer aus zwei Zuständen. Neben der normalen Ansicht möchte man noch, dass sich der Link optisch verändert, wenn man mit der Maus über einen Link fährt. Besucher sind es gewohnt, dass sich Links so verhalten. Man nennt dies auch Hover.

A) Schrift. Du kannst alle aktuell bei uns verfügbaren Google-Fonts nutzen. Außerdem kann du einen Einzug (links) festlegen.

B) Stil. Du kannst die Schrift zusätzlich mit einem Stl versehen (Fett, Unterstrichen oder beides)

C) Icon. Eine neue Funktion, die wir auch bei anderen Inhalten einbauen werden. Wir stellen dir eine Anzahl von Icons zur Auswahl zur Verfügung. Die drei Symbole von der Icon-Auswahl bedeuten folgendes:

a) Eine Vorschau, welches Icon du gewählt hast.

b) Den Auswähler um den Dialog zu öffnen, indem du ein icon wählen kannst.

c) Einen Papierkorb, um die Auswahl zu löschen.

Dahinter ist noch die übliche Farbauswahl um einem Icon eine Farbe zu geben und du kannst bestimmen, welchen Abstand das Icon zur Schrift haben soll. Wenn du an dieser Stelle ein Icon wählst, gilt es für alle Links in der Liste. Du kannst dann in der Vorschau selbst jedem Link auf Wunsch ein individuelles Icon geben.

Der Hover-Effekt

D) Wie der Link aussehen soll, wenn du mit der Maus den Link berührst, legst du hier fest. Neben dem Schriftstil (Fett, Unterstrichen usw.) kannst du noch die Schriftfarbe ändern. Schriftgröße und Schriftart sind immer identisch mit dem Normalzustand.

 

Die Überschriften

Löscht du hier Optionen wie Schriftfamilie oder Farben mit dem Papierkorb so werden immer die im Design hinterlegten Werte für den Fliesstext verwendet. Ansonsten hast du folgende Optionen.

E) Schriftfamilie und Farbe. Einstellungen wie üblich.

F) Hintergrund. Mit Abstand legst du fest, wie viel Abstand zwischen dem Hintergrundrand und der Schrift sein soll. Je größer der Wert, umso höher wird die Unterlegung der Schrift mit einer Fläche. Ausrichtung bestimmt, ob die Überschrift links, rechts oder mittig angeordnet sein soll. Und der Hintergrund kann natürlich noch eine Farbe und Transparenz haben.

 

Die Linien

Alle Linien in einer Liste haben das gleiche Aussehen, welches du hier festlegen kannst.

G) Die Linien können eine Höhe, eine Farbe und eine Transparenz haben.

 

Auch wenn die Linkliste sehr umfangreich ist, wirst du sehr schnell deine eigene Liste erstellen können. Wofür man eine Linkliste verwenden kann, zeigen wir dir in den nächsten Wochen in diesem Blog. Nachfolgend noch einige Detail zu den neuen Funktionen in diesem Update.

 

Icons satt

Icons sind eine schöne Möglichkeit, die Webseite aufzulockern. Wir verwenden für die Icons, die wir dir zur Verfügung stellen, eine spezielle Schrift. Das hat den Vorteil, dass du jedes Icon in jeder beliebigen Größe darstellen kannst und in jeder Farbe. Wir haben bereits neue Inhaltselemente in Arbeit, die unsere neuen Icons benutzen werden.

Nachfolgend eine Übersicht aller aktuell vorhandenen Icons zur Verwendung in der Linkliste und in allen Inhaltselementen, die Icons anbieten.

 

 

Die neuen Dialoge zur Linkauswahl

Wenn du in der Linkliste einen neuen Link anlegen oder bearbeiten willst, klickst du auf den Bearbeitungsstift, der erscheint, wenn du mit der Maus über ein Element fährst. Es öffnet sich folgender Dialog:

 

 

 Dazu ein paar Anmerkungen

2) Jeder Link wird in der Liste mit einer Bezeichnung dargestellt. Du kannst dort entweder den kompletten Link wie "www.google.de" eintragen oder aber eine Erklärung wie "Suchmaschine Google". Lässt du dieses Feld frei, dann kannst du eine dynamische Seitenliste erzeugen. Ein interner Link ist immer ein Link zu einer bestehenden Seite und diese hat normalerweise auch einen Namen. Zum Beispiel "Impressum" oder "Bildergalerie". Wenn du nun einen internen Link auswählst wie zum Beispiel die Seite "Impressum" und das Feld für den Anzeigetext frei lässt und dann speicherst, dann setzt das System automatisch den Seitennamen, also Impressum als Anzeigenamen ein. Damit stellst du eine dynamische Verbindung zur Seite her. Wenn du jetzt die Seite Impressum verschiebst und/oder den Namen der Seite änderst, dann bekommt das die Linkliste mit und aktualisiert ebenfalls den Anzeigenamen und sorgt dafür, dass die Verlinkung weiterhin korrekt ist. Eine gute Möglichkeit, ein Seitenverzeichnis von Seiten darzustellen, die du nicht in der Navigation hast und die der Besucher trotzdem erreichen soll

3) Hier erscheint der Link, den du angelegt hast. Dieses Feld ist nicht dazu da, den Link reinzuschreiben sondern dient nur als Infofeld.

5) Mit dem blauen Icon kommst du zu einem weiteren Dialog, den wir unten noch kurz darstellen. Dort kannst du dann die Verlinkung festlegen und anschließend abspeichern. Nach dem Abspeichern erscheint der von dir gewählte Link in diesem Feld.

4) Das ist die Option, einzelne Links in der Liste mit einem eigenen Icon zu versehen. Wie schon erklärt besteht dieses Element aus Vorschau, Auswahl und Papierkorb.

 

Linkauswahl

Mit diesem Dialog kann man zukünftig Links auswählen. Wir werden diese Option nach und nach in alle Inhaltselemente einbauen, wo man Verlinkungen anlegen kann.

 

 

Auch hierzu noch ein paar Anmerkungen

2) Du kannst zwischen "interner Link" = Verlinkung zu einer bestehenden Seiten deiner Homepage, "Externer Link" = Verlinkung zu einer beliebigen anderen Webseite und "Mailadresse" = Verlinkung zu einer Email (öffnet ein Emailprogramm) wählen. Je nachdem, was du auswählst  stellt sich das Feld (3) zur Eingabe des Links anders da.

3) Bei einem internen Link hast du hier eine Auswahlliste, die es ermöglichst direkt eine Seite deiner Homepage auszuwählen. Ansonsten hast du ein Textfeld, wo du einen externen Link oder eine Email eintragen musst.

4) Normalerweise wird ein Link immer im gleichen Fenster geöffnet und der Besucher entscheidet durch eine Tastenkombination, ob er lieber ein neues Fenster möchte. Hier kannst du den Besucher quasi dazu zwingen, dass der Link immer in einem neuen Fenster erscheint indem du einfach" Neuer Tab/Neues Fenster" einstellst.

 

Mehrspaltige Sidebar

Ein Hinweis noch für alle Kaufkunden. Mit dem Update ist die Sidebar nicht nur ein Bereich geworden, in dem man nun ganz einfach alle Inhaltselemente anlegen kann. Zusätzlich kann die Sidebar nun auch Spalten benutzen. Wenn du in den Spaltenbearbeitungsmodus geht, kannst du jetzt Spalten auch in der Sidebar erzeugen. Das mag im ersten Moment angesicht der begrenzten Breite der Sidebar etwas überflüssig wirken. Es ist auch nur der erste Schritt. Wir wollen sobald es geht, Design-Strukturen anbieten, wo ein Sidebar-Bereich unter der Seite quais als Footer angelegt werden kann. Sobald das geht, machen Spalten Sinn. Denn dann kannst du viel leichter einen schönen Footer anlegen. Außerdem wird dann die Linkliste mehrere Spalten unterstützen und damit kann man dann selbst eine Seitennavigation im Footer anlegen und verwalten.

 

Wir haben noch eine Menge vor und freuen uns natürlich weiterhin über euer Feedback. Je mehr Anregungen, Wünsche, Lob und Kritik wir bekommen (gerne auch im Blog) um so besser können wr page4 für euch machen.

 

Gruß Manfred F. Schreyer und das Team von page4

Update 2016 Teil 1

Tags: Updatepage4News | Kommentare: 0 | Views: 2285

Freitag 8.April 2016

 

Liebe page4 User und Freunde

 

endlich ist es soweit. Das angekündigte Update für 2016 geht online. Ab sofort ist es für alle kostenlosen Seiten verfügbar. Für alle Kaufversion geht das Update Anfang nächster Woche online. Dieses Update war notwendig, um die vielen Ideen, die wir von Euch erhalten haben, jetzt nach und nach umsetzen zu können. Wir haben dafür einen großen Teil der Basis von page4 erweitert und umgebaut. Nachfolgend ein kurzer Überblick über die Veränderungen in der Bedienung und die neuen Möglichkeiten. Ausführliche Infos kommen ab der nächsten Woche hier im Blog.

 

Zusammenlegung aller sogenannter Inhaltselemente

 

 

Ab sofort gibt es keine Trennung mehr zwischen Inhalte für die Webseite und Inhalte für die Sidebar. Daher haben wir die Palette für Sidebar-Elemente entfernt und die Palette für Inhalte (1) erweitert. Da viele Inhaltselemente für Sidebar und normale Seiten identisch waren, gibt es jetzt drei neue Elemente in der Palette. Den Kalender (4), den Counter (2) und die Linkliste (3). Das Sidebar Element "Notiz" haben wir ersatzlos entfernt, da es ohne Aufwand möglich ist, diese Inhalte auch mit dem normalen Text-Editor zu erstellen. Alle vorhandenen Notizen in einer Sidebar werden durch das Update automatisch zu einem Text-Element konvertiert. Alle anderen Sidebar-Elemente wie Bild, HTML, Linie, Text und Galerie werden jetzt durch die normalen Inhaltselemente ersetzt.

Du kannst ab sofort jeden Inhalt sowohl in der Sidebar als auch auf der Seite platzieren. Durch diese Umstellung wird es nun viel leichter für dich als User als auch für uns als Entwickler. Alle neuen Inhalte, die in Arbeit sind, können überall verwendet werden. Wir brauchen Inhaltstypen nur noch einmal entwickeln und du hast nur noch eine Palette und überall die identische Bedienung.

Im Zuge dieser Umstellung mussten wir die Inhaltselemente aus der Sidebar, die es bisher nicht für die Seite gibt, überarbeiten. Beim Kalender haben wir aus Zeitgründen keine Veränderungen vorgenommen. Das kommt später. Den Counter und die Linkliste haben wir komplett neu programmiert und dort alle Ideen eingebaut, die wir in den letzten Monaten erhalten haben und die sinnvoll sind.

 

Der neue Counter

Ab sofort kannst du beliebig viele Zähler auf deiner Seite platzieren und natürlich nicht nur in der Sidebar sondern auch auf einer Seite. Wir haben den Zähler komplett neu gebaut. Du kannst weiterhin die alten Counter nutzen oder einen neuen Counter verwenden, der viel mehr Optionen bietet. Eine umfangreiche Erklärung wird es bald online geben. Nachfolgend schon mal ein Bild, wie der neue Counter aussieht. Auch wenn es sehr viele Einstellmöglichkeiten gibt, wirst du sehr schnell damit klar kommen. In einer Vorschau siehst du genau, wie der Counter aussieht. 28 Vorlagen stehen zur Verfügung, die du dann noch indivduell anpassen kannst.

 

 Hier eine kurze Liste alle Möglichkeiten:

1) Zähler. Wie bisher stellt man hier ein, was der Zähler anzeigen soll. Dazu gibt es vier Möglichkeiten (2). Du kannst einen Startwert festlegen, ab dem der Zähler anfangen soll zu zählen.

3) Hier sind 28 Einstellungen. Klickst du auf einen Button, wird diese Einstellung geladen und in der Vorschau angezeigt. Du kannst dann alle Werte noch anpassen. Die erste Reihe sind eher große Zähler, die zweite Reihe passen eher in die Sidebar.

4) Die Vorschau

5) Hier wählst du aus, ob du die neue Variante (Text) oder den alten Zähler willst. Wenn du den alten Zähler verwendest, dann werden alle Optionen ausgeblendet, die nicht benutzt werden können.

6) Hier legst du fest, was der Zähler anzeigen soll

7) Die Ausrichtung des Zählers innerhalb der Spalte

8) Die Schrift für den Zähler

9) Hier stellst du ein, wie weit die einzelnen Ziffern auseinanderstehen sollen

A) Einstellungen für einen Rahmen inkl. abgerundete Ecken

B) Hintergrundfarbe und Innenabstand. Mit dem Innenabstand kannst du den Hintergrund erweitern. Natürlich nur, wenn du auch eine Hintergrundfarbe angibst. Sonst siehst du diesen Effekt nicht.

C) Du kannst aus einer Vielzahl an Animationen wählen und Bewegung in den Zähler bringen.

D) Wenn du die Verzögerung für die einzelnen Ziffern ausschaltest (Keine) dann werden alle Ziffern zusammen animiert. Ansonsten wird die Animation nacheinander auf die einzelnen Ziffern angewendet.

Viel Spaß bei Ausprobieren.

 

Die Linkliste stellen wir nächste Woche vor zusammen mit weiteren Informationen zum Update.

 

Manfred F. Schreyer

page4 Ltd.

 

Blogarchiv