News - Bleiben Sie auf dem Laufenden!
SaJe Design, Grafik & Illustration

Neu im Shop: Happy Birthday

Veröffentlicht: 10. April 2012 | | Kategorie: Querstil, Shop | Tags: |

Happy Birthday GrußkarteDie Ostertage sind vorüber, doch es geht feierlich weiter! Denn ab heute gibt es im Shop von Querstil eine musikalische Geburtstagsgrußkarte für entfernte Ständchen-Sänger mit Telefonphobie.
Wer schon immer mal ein stilles Geburtstagständchen verschicken wollte, hat nun die Gelegenheit dies zu tun.

Eine vollständige Ansicht und Details zu der Karte gibt es natürlich im Shop.

{lang: 'de'}

Tutorial: DropDown Menü im Imbalance Theme

Veröffentlicht: 30. März 2012 | | Kategorie: Allgemein, Web-Design | Tags: , , |

Um mal etwas völlig anderes zu tun, gibt es ein kleines Tutorial und das gleich zweisprachig!

This is a tutorial for using the animated dropdown menu in WordPress Imbalance Theme (by WPShower) on static pages. In order to get this working, you have to make several adjustments to your theme files.

Vor ein paar Tagen erst wurde ein neues Projekt fertig, die Website von Chrononauts Photography. Wie in dem entsprechenden Artikel bereits erwähnt, wurde hier eine WordPress Seite erstellt, die das Theme Imbalance von WPShower verwendet. Um den Bedürfnissen der Kundin gerecht zu werden, musste das Theme einige Anpassungen über sich ergehen lassen. Hier sei nun vor allem die Anpassung des animierten DropDown Menüs interessant. Denn was für die Blog-Bereiche wie dem Blog selbst, Kategorien und Archiv ganz wunderbar funktioniert, lässt sich für normale, statische Seiten nicht zu einem DropDown Menü bewegen. Bei der Suche nach einer Aktivierung dieser Funktion zeigte sich, dass zahlreiche Benutzer auf der Suche nach ebenjener Antwort waren, aber eine Lösung scheint es bisher nicht zu geben. Um dies für alle Suchenden zu ändern, hier nun eine Anleitung wie man das DropDown Menü auch für statische Seiten einsetzen kann:

  1. Für den ersten Schritt ist es notwendig einen Editor und einen ftp-Zugang zu besitzen, da die Änderungen nicht von WordPress  aus gemacht werden können.
 Wir beginnen mit einer Änderung in der Datei collapse.js, welche in dem Theme Ordner zu finden ist:
    Imbalance →js→collapse.js
    Hier sieht man von Haus aus drei Zeilen mit den Inhalten „categories“, „archives“ und „search“. Wir kopieren eine dieser Zeilen (z.B. die mit dem Inhalt „categories“) und fügen sie an neuer Stelle ein. In der kopierten Zeile ändern wir das Wort „categories“ in einen Menüpunkt unserer Wahl, ich habe hier portfolio gewählt. Für alle weiteren Schritte muss das selbe Wort verwenden werden (Schreibweise beachten).
    Nun wird die Datei gespeichert und geschlossen.

    You have to use a texteditor + ftp access for this, as you can’t edit these files from the wordpress admin panel. Open your collapse.js file. You will find it in your theme folder:
    Imbalance →js→collapse.js
    
You will see three lines here, conatining „categories“, „archives“ and „search“. Duplicate the line which contains “categories” and change “categories” to something else of your choice, but use it consistently from this point on. I used the keyword portfolio as this is the links name in the menu.

    Dropdown Imbalance: Tutorial 1

  2.  

  3. Geht zurück in den Admin Bereich von WordPress und wechselt über den Design Editor in die style.css. Wir suchen hier nach dem Schlüsselwort „categories“ und ergänzen jeweils „portfolio“ in der selben Schreibweise wie bei „categories“ verwendet.
    Ein Beispiel:

    Go back to your WordPress CMS and to your style.css file. Search for “categories”, add your keyword here, in the same way that “categories” is written.
    For example:

    Imbalance DropDown: Tutorial 2

  4.  

  5. Nun geht es in die Datei header.php, wo wir wieder eine Zeile duplizieren und den gewählten Menüpunkt eintragen:

    Now go to your header.php where you need to duplicate a line for „portfolio“:



    Imbalance DropDown: Tutorial 3

  6.  

  7. Ebenfalls in der header.phpfügen wir nun noch einen neuen div-Container für das eigentliche Menü ein:

    Now add a whole new div for the actual menu:

    Imbalance Dropdown: Tutorial 4

     

    <div id="Portfolio">
    <ul class="mcol2">
    < ?php
    $data = wp_list_pages('echo=0&title_li=&depth=1&hide_empty =0&orderby=ID');
    $data = preg_replace('/\<\/a\> \((.*)\)/',' <span>$2</span>',$data);
    echo $data;
    ?>
    </ul>
    </div>
  8. Auf der Hauptseite findet sich im Menü nun ein neuer Reiter „Portfolio“ der sich beim Klick darauf öffnet. Hier werden jetzt noch alle statischen Seiten angezeigt, die bisher erstellt wurden und noch werden. Das ändern wir im nächsten Schritt.

    Go to your site, you will now see a new menu item „Portfolio“. When you open „Portfolio“ you will find all static pages you created or will create soon. We will change this in step 5.

    Imbalance DropDown: Tutorial 5

     
    Falls ihr übrigens eine extra Seite „Portfolio“ für das Menü erstellt hattet, könnt ihr diese löschen, da Sie für das Menü nicht benötigt wird.

    If you created a page „Portfolio“ before to use as menu item, you can delete this page, as it won’t be needed for your menu.

  9. Um nun alle unerwünschten Seiten aus unserem Menüpunkt zu entfernen, wechseln wir wieder in die header.php und zu dem div-Container, den wir eben erst eingefügt haben. Hier schließen wir nun mit Hilfe des exclude-Befehls alle Seiten aus die unter Portfolio nicht angezeigt werden sollen. Dafür benötigen wir die entsprechenden Seiten-IDs. Ich habe gleich mehrere Seiten ausgeschlossen, was bei mir nun so aussieht:

    To remove all unwanted pages from the menu item, use the exclude advice. Back in your header.php go to your div you added for Portfolio an add the page ID you want to exclude. I added several pages here which looks like that:

    Imbalance DropDown: Tutorial 6

     

    &exclude=your-page-ID

    Das war’s! Das Menü sollte nun ungefähr so aussehen:

    That’ s it! Your menu should now appear like that:

    Imbalance DropDown: Tutorial 7

  10.  

{lang: 'de'}

Chrononauts Photography: Die neue Website

Veröffentlicht: 27. März 2012 | | Kategorie: Corporate Design, Web-Design | Tags: |

Chrononauts Photography: Die neue WebsiteBereits gestern ist eine neue Website für die in Dresden ansässige Fotografin Juliana Socher online gegangen, für die SaJe Design vor einiger Zeit schon ein außergewöhnliches Logo erstellen durfte.
Die auf einem WordPress-CMS basierende Seite bietet nun moderne Fotogalerien und ein minimalistisches Design, welches den Bildern erlaubt ihre Wirkung ungestört zu entfalten. Der vorhandene Blog ermöglicht der Kundin außerdem schnell und einfach neue Inhalte zu präsentieren und mit Ihren Kunden und Fans in direkten Kontakt zu treten.
Schauen Sie sich doch einmal auf der neuen Website von Chrononauts Photography um und machen Sie sich selbst ein Bild davon.

Einen Eintrag in den Referenzen gibt es natürlich auch.

{lang: 'de'}

Gestatten: Tatra, Mobile App

Veröffentlicht: 21. März 2012 | | Kategorie: Illustration | Tags: , |

Tatra, Hintergrund Screen-DesignZum Jahresende 2011 hin wurde gestalterisches Neuland betreten. Nachdem der Auftraggeber, appcube, nun seine Firmengründung und die damit einhergehenden bürokratischen Hürden gemeistert hat, präsentiert sich der Task-Tracker, kurz Tatra, mit farbenfrohen Vektor-Illustrationen im Comicstil den Nutzern von Android Smartphones.

Mehr Infos und Bilder zu diesem Projekt finden Sie in den Referenzen.
Wer außerdem noch eine nützliche App sucht mit der Termine und Aufgaben organisiert werden können, für den geht es hier zur App im Shop von Google Play.

{lang: 'de'}

Neu im Shop: Sherlock Holmes

Veröffentlicht: 14. März 2012 | | Kategorie: Querstil, Shop | Tags: , , |

Nostalgie Lesezeichen "Sherlock Holmes"Nach den kürzlich vorgestellten Nostalgie Lesezeichen im Shop von Querstil, wurde der Ruf nach einem etwas weniger verspielten Pendant laut. Der Wunsch war mir Befehl und so entstand das Lesezeichen “Sherlock Holmes”.

Hier geht es zum Shop-Artikel mit noch mehr Fotos!

{lang: 'de'}