Speisekarte & Co

[tab]

Ich erstelle hier gerade eine Website für ein Restaurant und sinniere hier gerade darüber, wie man Anspruch und Wirklichkeit zur Deckung bringen könnte. Das Problem ist, die Speisekarte liegt bestenfalls als PDF (eigentlich sogar als Word-Datei) vor, soll aber angezeigt werden und nicht nur herunterladbar sein. Die Restaurantbetreiber haben eher wenig Ahnung, wie man z.B. eine PDF-Datei in ein Bild umwandelt, das dann angezeigt werden könnte und der gewünschte Workflow wäre eigentlich, einfach die PDF-Datei auf dem Server auszutauschen oder bestenfalls noch eine neue auszuwählen. Gibt es eine Erweiterung, die PDFs anzeigen kann?

Mein Plan B1 wäre, ihnen eine Schritt für Schritt Anleitung an die Hand zu geben, wie sie das bewerkstelligen können, Plan B2 wäre ein Angebot meinerseits, das einmal pro Monat zu übernehmen - gegen Bezahlung natürlich.

Ich fürchte allerdings, spätestens auf dem Smartphone wird man eh wieder beim PDF-Download landen, weil eine Bildanzeige wahrscheinlich nicht die notwendige Auflösung haben wird, um die Karte lesen zu können. Wie würdet ihr sowas lösen? Es werden ja bestimmt schon einige vor dem selben Problem gestanden haben. "Früher" war das ja relativ einfach. Man hat eine Seite mit fester Größe und zeigt das Bild an, der Smartphone-User darf dann eben zoomen. Heute ist alles responsiv .... Vielleicht wäre ja gerade das Zoomen ins Bild die Lösung. Ansonsten wäre selbst ein hochauflösendes Bild auf einem Retina-Display wohl eher eine Lösung für Kurzsichtige.

[planepix]

Hallo tab,

spontan: PDF in SVG umwandeln via Online-Konverter? Geben tut es die, ob sie taugen und ob der Kunde…

[tab]

Müsste ich mich mal schlau machen, wie würde die SVG-Datei dann gelesen werden? Auch durch Zoomen ins Bild?

[stefan-at-work]

schon mal einen Blätterkatalog ins Auge gefasst? Sollte auch für den Kunden einfach zu handhaben sein. z.B. http://www.mypdf.me/blaetterbare-pdf...aetterkatalog/

[planepix]

Einfach mal aus Neugier gesurft:
http://www.cityinthesky.co.uk/opensource/pdf2svg

https://www.idrsolutions.com/online-...svg-converter/

[planepix]

Müsste ich mich mal schlau machen, wie würde die SVG-Datei dann gelesen werden? Auch durch Zoomen ins Bild?

Ja sicher durch Zoomen, aber eben scharf beim Zoomen.
Und es hängt sicher noch davon ab, welche Steuerzeichen im pDF da unsichtbar das Ergebnis verderben…

[tab]

Hast natürlich recht. Eine Lösung ohne auf die eine oder andre Art zu zoomen kann es ja eigentlich kaum geben, wenn man es sich recht überlegt. Habe mir das Blätterkatalog-Beispiel gerade mal angesehen. Funktioniert auf meinem Smartphone, aber die Scrollerei ist natürlich übel. Geht aber wohl eh nicht anders. Ob mit Blätterkatalog oder SVG. Die Datei in "irgendwas" umzuwandeln, was Word nicht direkt ausspuckt, dürfte da auch keine höhere Hürde sein, als die Datei in ein "normales" Bild umzuwandeln. Führt wohl kein Weg dran vorbei, solange es nicht serverseitig automatisch gelöst werden kann. Da glaube ich aber nicht dran, das Hosting ist eher schmal und das Budget klein, wie so oft.

[derRenner]

Hallo,

ich stand erst vor Kurzem vor selbigen Problem und hab das über <object> gelöst

	
<div class="menue-container">
		<object data="files/layout/menue/Weinkarte.pdf#zoom=70" type="application/pdf" width="100%" height="100%">
			<p>
				Es scheint als würde das PDF-Plugin Ihres Browsers nicht aktiv sein.<br>
				Sie können die Speisekarte aber hier downloaden: <a href="files/layout/menue/Weinkarte.pdf">Download</a>
			</p>
		</object>
</div>

Das Ergebnis findest du hier.

Am Smartphone wird die Karte nicht sogleich angezeigt, sondern erst über den "Download"-link im pdf-viewer geöffnet » dort aber ist's responsive ...

Im Schlimmsten Fall musst du dann hier deinem Kunden nur klar machen, dass die pdf-Datei immer gleich heisst und immer im gleichen Verzeichnis hochgeladen werden muss ...

[tab]

Auch eine Idee. Das hat natürlich den Charme, dass da nichts umgewandelt werden muss. Auf Smartphones muss es auch nicht unbedingt direkt angezeigt werden. Der Kunde sieht das jedenfalls so, dass ihm da die Darstellung relativ egal ist, solange letztlich alle Informationen zur Verfügung gestellt werden.

[3dr]

Warum den Kunden die Speisekarte nicht innerhalb von Contao schreiben und aktualisieren lassen. Das lässt sich einfach responsive machen und kann mit einer passenden print.css auch für einen Ausdruck gestylt werden.

[µaTh]

sehe ich auch so: am besten die Speisekarte in Contao strukturiert erstellen und dann für die Webseite bereit stellen und als PDF-Download anbieten.

Alternative (falls du die notwendigen Rechte/Ressourcen auf dem Webspace hast): Per Ghostscript zu jpg konvertieren.

[planepix]

In Contao fände ich auch sinnvoll. Nur: Die meisten Restaurants, die ich kenne, ergänzen oder erneuern ihre Speisekarte zu Teil wöchentlich / monatlich.
Und wenn man dann nicht flott im BE unterwegs ist, wird am Ende einfach eine PDF zum Download drangehängt. Einfach weil der Aufwand zu hoch ist.

[3dr]

...hm, sehe ich anders, wenn das gut vorbereitet ist, dann hat ein Redakteur das schneller online aktualisiert und als PDF zum Ausdrucken heruntergeladen als lokal geschrieben, formatiert, in ein Pdf konvertiert, hochgeladen und im FE eingebunden.

Nachtrag:
Ich würde sogar eine eigene Benutzergruppe vom Typ Speisekartenredakteure erstellen, Mitglieder dieser Gruppe können nur die Inhalte der Speiseplanseiten bearbeiten sonst nix, das kapiert jede/r, da das BE von Contao bekanntermaßen ja sehr gut strukturiert und extrem einfach zu bedienen ist.

[planepix]

ok .

[3dr]

Komme gerade richtig in Fahrt
Auch könnte man mit einem Layoutprogramm eine CI-konforme Vorlage gestalten und in entsprechender Auflage herstellen lassen. Auf die druckt dann der Kunde die über die print.css gestaltete Speisekarte/n. Damit bleibt die print.css relativ simpel.

[tab]

Das erscheint mir aber zunächst mal aufwändig in der Implementierung zu sein. Ich arbeite eh schon das Wochenende durch, es gibt da noch andere Baustellen, die dringlicher sind bis die Seite nächste Woche online geht. Ich habe auch festgestellt, dass die momentan verwendeten JPG's, die in der Mediabox angezeigt werden, sich - zumindest auf meinem Android Handy - zoomen lassen. Zumindest ich kann die Speisekarte auf dem Handy lesen. Zugegeben, schön ist das nicht. Naja, habe gerade mal die Seiten der lokalen Konkurrenz auf dem Handy angeschaut. Eine gar nicht responsiv und bei der anderen bekomme ich auf dem Handy die Speisekarte nicht zu sehen, wenn ich den entsprechenden Link anklicke. Da sind wir ja jetzt schon ganz gut unterwegs.

Edit: Das schwierigste Teilprojekt wird wohl der gerade eingegangene Änderungswunsch. Ich soll einen Button in das Fenster (neuer Tab) einbauen, in dem ein PDF angezeigt wird. Damit man wieder auf die Website zurückkommt.

[Pinkman]

Ich bin gerade dabei für einen Kunden (kleines Restaurant) ein kleines Modul zu entwickeln in dem die entsprechenden Gerichte mit Name, Beschreibung, Inhaltsstoffen und Preis hinterlegt werden können. Zudem können Kategorien (können ebenfalls im Modul gepflegt werden) gewählt werden sodass man auf verschiedenen Unterseiten nur Speisen einer Kategorie anzeigen lassen kann. Weiß jetzt nicht wie der Zeitplan bei dir, ist das Modul dürfte spätestens Mittwoch fertig sein denke ich.

[tab]

Naja, ich schätze mal, die Seite wird im Lauf des Montags online gehen. Ich mache morgen noch ein paar Feinarbeiten am CSS und ein wenig SEO. Trotzdem interessiert es mich, bzw bestimmt den Kunden, wenn der sich dadurch Arbeit spart. Man kann das ja ggf später immer noch einbauen. Ich werde mich da eh noch in aller Ruhe nach einer passenden jQuery-Lightbox umschauen, die sich nicht mit dk_caroufredsel beisst wie anscheinend die Colorbox, wirklich endgültig fertig ist das also eh nicht, wenn es online geht. Andererseits hat der Kunde seine verschiedenen Karten sowieso als Word-Dokumente, die er dann auch ausdruckt. Damit erstellt er dann natürlich schneller ein PDF als er die Daten im Backend in ein Modul übertragen kann. Aber anschauen werde ich mir das Modul in jedem Fall und es ihm ggf vorschlagen. Muss er dann natürlich selbst entscheiden.

[tab]

Die Seite ist jetzt mittlerweile fast eine Woche online. Das Problem hier habe ich aber noch nicht gelöst. Irgendwelche Lösungen über Eingaben im Backend kommen für den Kunden nicht in Frage. Er möchte seine Karten auch vom Design her jederzeit selbst ändern können wie bisher, was ja bei Office/Word per PDF problemlos geht. Irgendwelche Installationen auf dem Server zur Konvertierung in JPEG gehen auch nicht, ist ein eher kleines Shared Hosting (Hetzner Level 4), was für alles andere auch völlig ausreichend ist. Datei(en) austauschen ist der gewünschte und hier auch aus meiner Sicht sinnvollste Weg zur Aktualisierung der diversen Karten.

Zumindest auf einer Seite soll das PDF in einer Lightbox dargestellt werden...
Gibt es denn eine jQuery Lightbox, die das kann. Oder noch besser, die eine Contao-Seite in der Lightbox anzeigen kann. Darin würde ich dann grob nach dem Vorschlag von Bernhard (derRenner) per <object> das PDF einbinden bzw im Fehlerfall einen Downloadlink anbieten. Im Idealfall würde sie auch noch mit dk_caroufredsel so zusammenarbeiten, dass es mir nicht das Layout zerschiesst wie leider mit der Colorbox . Die Colorbox scheint das aber eh nicht zu können . Tosrus habe ich auch angetestet und bekomme es jedenfalls im Template nicht eingestellt für die Anzeige einer Contao-Seite. Verlinkt wird per ce_hyperlink. Entsprechende Beispiele fehlern leider auf der Tosrus-Website. Die Mediabox kann beides problemlos und funktioniert auch mit der dk_corufredsel-Galerie, ist aber MooTools. Da müsste ich beide Bibliotheken einbinden, jQuery und Mootools. Geht zwar, ist dann aber ziemlich viel Javascript runterzuladen. Die Kröte würde ich aber mittlerweile notfalls fast schon schlucken.

Wünschenswert wäre dann aber noch, dass auf dem Smartphone, wo die Anzeige von PDF im Browser meist nicht funktioniert, wenigstens die Lightbox automatisch geschlossen würde, wenn der alternative Link zum PDF geklickt wird bzw das PDF mit einer App angezeigt wird. Das liesse sich aber wohl auch noch irgendwie lösen.

[korlbeu]

vlt hilft das?
http://www.jqueryrain.com/?rb4amMEf

[tab]

So, ich bin der Lösung hetzt doch einigermassen nahe gekommen. Mit der Implementierung auf dem Live-System muss ich aber noch etwas warten. Ich nutze jetzt wieder die ColorBox, brauche dann also kein MooTools mehr zusätzlich zu laden. Die Unverträglichkeiten mit dk_caroufredsel konnte ich abstellen, indem ich im j_colorbox.html5-Template returnFocus auf false gesetzt habe. Zudem habe ich herausgefunden (lesen bildet ), dass die ColorBox sehr wohl PDF-Dateien anzeigen kann, allerdings muss dazu im Template iframe auf true gesetzt werden. Zudem komme ich da mit meinen normalen Defaulteinstellungen maxWidth und maxHeight nicht weit, es muss wohl zwingen width und height bzw. innerWidth und innerHeight verwendet werden.

Da ich das aber bei den Fotos des Karussells keinesfalls so eingestellt haben will, weder iframe noch eine feste Größe, muss ich also die ColorBox mit jeweils unterschiedlichen Einstellungen verwenden können. Zuerst dachte ich daran, den entsprechenden Seiten jeweils eigene Seitenlayouts zu geben, in denen dann das jeweils passende j_colorbox_xyz.html5-Template eingebunden wird. Dann bin ich aber über einen Ansatz von Andreas Isaak gestolpert. Damit kann ich jetzt sowohl "iframe" als auch die festen Größenangaben steuern über Klassen, die ich dem ce_hyperlink mitgebe. Das reicht dann für meine Belange, ich habe also nicht alles so wie beschrieben umgesetzt.

Bleibt also lediglich das Problem, die leere Lightbox auf dem Smartphone automatisch zu schliessen, wenn die Lightbox das PDF nicht darstellen kann, wenn also kein entsprechendes Plugin installiert ist. Aber das wird sich wohl auch noch finden. Und wenn nicht, dann wird es eben fürs Erste einmal dem Smartphone-User überlassen, die Box zu schliessen. Schliesslich ist der selbst schuld, wenn er keinen Desktop-PC mit sich rumträgt.

[tab]

Ich habe da jetzt eine ganz pragmatische Lösung eingeplant. Unterhalb von 800 Pixel Viewportbreite werden die PDFs nicht mehr in der Lightbox dargestellt, sondern als ganz normale Links ausgegeben. Was nicht geöffnet wird, muss auch nicht geschlossen werden .