The Template Markup has been updated. Please check Github to get the newest version of Photosheet

Welcome



Hallo und herzlich Willkommen auf der Demopage von Photosheet. Ein Template, dass auf die grundsätzlichen aller Funktionen reduziert ist und vor allem eines zum Ziel hat. Eine blanke Tafel zu sein, für die Bilder, die es enthält.

Hier findet ihr nicht nur eine Vorschau, wie das Template aussieht, sondern auch alle möglichen Tutorials, die die Installation und Einfindung ins Template erleichtern sollen.

Hello and Welcome to the demopage of Photosheet. A template reduced just to the basic functionalities with only one goal. Put Focus on the images it contains, just like a blank table.

On this page you'll find all kinds of tutorials and an example of what static magazine looks like.

Features

Photosheet ist mit SASS geschrieben worden. Das Stylesheet wird auf GitHub gehostet, was bedeutet, dass Änderungen an der CSS automatisch aktualisiert werden. Ich habe auch die Funktionalität eingebunden, eine Art "Update-Nachricht" zu platzieren. Solange der Code im Template nicht entfernt wird, werde ich die aktuell ausgeblendete Nachricht anzeigen und darauf hinweisen, dass ein Markup-Update gemacht wurde. Dieses ist dann auf der Demopage dokumentiert und auf GitHub nachvollziehbar.

Photosheet is written in SASS. The Stylesheet is hosted on GitHub, which means changes in the CSS will be updated automatically. I also was able to include a notification when the template's markup is updated. As long as it is not deleted, the currently invisible message will be shown when a markup update is available. This will then be documented on the demopage and GitHub.



Durch die Nutzung von SASS habe ich eine neue Möglichkeit gefunden, wie sich das Template schnell und einfach personalisieren lässt. Durch die Möglichkeit Variabeln zu ändern und in einem overwrite zu platzieren, öffnen sich viele neue Möglichkeiten.

By using SASS I found a new possibilty to customize the template fast and easy. Giving you the possibilty to change Variables and compiling a personalised overwrite opens up a lot of new possibilities.

Installing



Das Template ist ganz einfach zu installieren. Ihr findet es auf GitHub. Kopiert den Code einfach in euer Template.
Im folgenden eine Illustration davon

The Template is very simple to install. You can find it on GitHub. Just paste the code into your template.
Following you'll find an illustration of the process.














Navigation



Das Template ist sehr simpel. Ich habe auf Widgetsections grundsätzlich verzichtet, doch ein Menu gehört dennoch zu den Grundfunktionen. Deshalb habe ich eine Sektion für das Seiten-Gadget reserviert.

The template is very easy. I did not include widgetsections because I don't feel them necessary, but a menu seems to be basic functionality, so I wrote one section for the blogger page widget.




Customize



Papersheet is in SASS geschrieben. Ich habe mir zur Personalisierung einen CSS-Overwrite überlegt. Dazu ladet ihr euch einen der beiden scss-Files und passt die Variabeln an. Dieses SASS müsst ihr dann compilieren. Das könnt ihr einerseits auf eurem Computer machen, oder auch mit einem Online-Tool, wie z.B. SASS Meister (wie das mit dem online-tool funktioniert, könnt ihr hier sehen). Wichtig ist, dass ihr beim Ändern der Schriftarten sicherstellt, dass ihr diese verlinkt oder eine Schrift verwendet, die Blogger anbietet.

Ladet Overwrite, passt die Variabeln an, generiert eure CSS und kopiert sie dann in euer Template.

Papersheet is written in SASS. I created a css-overwrite to personalize it. To do that, just load one of the two scss-files and change the variables how you like them. Then you need to compile this SASS. Do this either on your computer or in an online-tool like SASS Meister(how the online tool works can be seen here). It is important to note, that you need to link the Webfont you want to use in your head, or make sure you use a font Blogger has included.

Load Overwrite, adjusst the variables and generate your personalized CSS, which you then paste into your template.












Example

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.



Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc,