Roman Harcke
WordPress, Fotografie und natürlich Themen meines Studiums
RSS

wp-remix-breite-aendernDieses Premium WordPress Theme “WP-Remix 3.0″ war für meine Ansprüche einfach viel zu schmal. Ich hatte unzureichend Platz um meine Beiträge und größere Bilder zu veröffentlichen.

Falls es euch auch so geht, einfach weiter lesen.

Durch einige einfache CSS Regeln wird jedes Theme im Layout definiert.
Falls ihr also etwas an eurem Layout ändern möchtet, einfach diese Regeln finden und nach Herzenslust umschreiben.

Meine Arbeit wurde vom FireFox AddOn “FireBug” SEHR erleichtert.

Ist dieses erstmal installiert, könnt ihr jeder beliebige Webseite online editieren. Die Einstellungen bleiben solange, bis ihr die Seite neuladet.
Dauerhaft kann eine Webseite natürlich nur vom Webmaster verändert werden.

 

 

Breite ändern in “style.css”

 

Um die Breite in WP-Remix zu verändern, muss man einige CSS Regeln editieren.
Die CSS Regeln werden dann über ihre ID im HTML aufgerufen.

  1. div id=”wrapper”
  2. div id=”nav”
  3. div id=”footer”

Diese 3 CSS Regeln bestimmen die Breite des WP-Remix Themes.
All diese Regeln sind im style.css gespeichert.

Die style.css findet ihr im Root Ordner eures WP-Remix Themes.

Ich habe in meinem Theme jetzt eine Breite von 1000px.
Also werde ich in allen drei CSS Regeln ebenfalls diese Breite einstellen.
Bitte darauf achten, dass ihr immer die selbe Breite benutzt! Sonst verzerrt sich das ganze Theme.

Speichert eure style.css lokal auf eurem Rechner und öffnet sie mit einem geeigneten Editor.

 

1. div id=”wrapper”

Sucht die style.css nach diesem Eintrag ab: “#wrapper”

Der CSS Code wird an der Stelle “width: ***px” durch eure gewünschte Breite editiert.

 

2. div id=”nav”

Auch hier sucht ihr nach dem entsprechenden CSS Eintrag. Finden tut er sich unter “#nav”.

Hier ebenfalls die Stelle “width: ***px” mit euren Werten ersetzen.

 

3. div id=”footer”

Die Breite des Footers ist unter “#footer” definiert.

Hier ebenfalls die Stelle “width: ***px” mit euren Werten ersetzen.

 

 

Blog Content und Sidebar ändern in “blog.css”

 

Falls ihr alle Schritte bis hierhin erfolgreich absolviert und euer Theme schon neugierig aktualisiert habt, werdet ihr feststellen, dass die Anordnung der Sidebar und der Artikel gar nicht glücklich ist.

Doch das werden wir jetzt ändern.

In WP-Remix müssen wir noch die blog.css ändern.
Diese findet sich im Theme Ordner unter “css/blog.css”

Da die Blogspalte und die Sidebar getrennt und von der Gesamtbreit unabhängig definiert werden, müssen wir hier etwas nachhelfen.

Die Artikel des Blogs werden in div id=”blog_content” aufgelistet und die Sidebar in div id=”blog_sidebar”.

 

 

1. Breite der Blogspalte – #blog_content

Gleich ganz oben in der blog.css findet ihr den Eintag “#blog_content”.

Ich habe als Gesamtbreite 1000px, daher definierte ich eine Breite von 700px für die Blogspalte.
Um das selbe zu tun, verändert die Breite in “width: 700px”.

 

2. Breite der Sidebar – #blog_sidebar

Die Breite der Sidebar findet ihr unter “#blog_sidebar”.

Jetzt aber aufpassen, rechnet nicht:

#blog_content (700px) + #blog_sidebar (300px) = Gesamtbreite (1000px)

Sondern lieber so:

#blog_content (700px) + #blog_sidebar (280px) + Abstand (20px) = Gesamtbreite (1000px)

Denn sonst wäre zwischen der Blogspalte und der Sidebar kein Platz mehr und die Beiträge würden direkt an die Abgrenzung der Sidebar reichen.

Lasst also in eurer Rechnung einen gesunden Abstand von 20 Pixeln übrig.

Die Breite der Sidebar also auf “width: 280px” abändern.

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...
Kategorie : WordPress | Blog

WordPress wird häufig als eine Blogging-Plattform bezeichnet. Aber WordPress kann viel mehr. Sogar die WordPress Dokumentation enthält einen ganzen Abschnitt, um WordPress als ein Content-Management-System (CMS) zu benutzen. Weil WordPress solch eine benutzerfreundliche Plattform ist, sollte man sinnvollerweise überlegen, wie man verschiedene Arten von Webseiten, auch Portfolio Seiten, mit WordPress realisieren kann.

Ob ihr ein Photograph, Graphiker, Internet-Designer oder irgendein anderer visueller Künstler seid, macht WordPress einen ausgezeichneten Ausgangspunkt für das Entwickeln eures Online-Portfolios. Und mit der Fülle von Plugins und allerlei Themen könnt ihr eine perfekt präsentable Website erstellen und mit dieser innerhalb einiger Stunden online gehen.

In diesem Artikel wird eine saubere Installation von WordPress vorausgesetzt. Für Installationshilfen schaut ihr am Besten in der offiziellen Dokumentation nach.

Hier sind zusätzliche Links, die nützlich sein können um eurer Portfolio zu entwerfen.

Als erstes werden ihr beschließen müssen, ob ihr ein vorgefertigtes Theme für euer Portfolio benutzt, oder ob ihr eure eigenen Wünsche und Anforderungen selbst verwirklicht und euch ein eigenes erstellt. Da letzteres wohl eher für die Coder-Freaks unter euch geeignet ist, könnt ihr als Einsteiger trotzdem viel an den hier vorgestellten Themes verändern. Im Internet gibt es viele wunderschön ausführliche Webseiten, auf denen ganz genau beschrieben wird wie ihr was zu tun habt.

Um euch etwas den Weg zu eurem persönlichen Online-Portfolio zu erleichtern, habe ich hier einige Portfolio Themes aufgelistet. Einige sind kostenlos, andere wollen bezahlt werden, doch was ihr auf jeden Fall kostenlos bekommt, ist ein visueller Eindruck.

Also, viel Spaß beim Durchstöbern – vielleicht ist euer nächstes Portfolio-Theme nur noch einige Abschnitte entfernt ;)

 

1. Kostenlose WordPress Portfolio Themes

 

Ein vorgefertigtes Theme zu benutzen spart viel Zeit. Auch einige der kostenpflichtigen Themes sind für euch billiger als einen Designer zu bezahlen, oder eure eigene Zeit zu opfern.

1.1 Sharpfolio: WordPress Portfolio Theme | Demo | Download

 

sharpfolio

 

 

1.2 Viewport: WordPress Portfolio Theme | Demo | Download

- ist auf sehr minimalistische und saubere Darstellung optimiert. Dominiert durch seine schönen Animationen und gekonnte Implementation von Textboxen.

viewport-frontpage

 

 

1.3 Irresistible | Demo | Download

- ist ein visuell reichhaltiges Blog Theme, mit Video und Bilder Support. Integriert ist eine Flickr Live-Show, eingebauter RSS Feed, … . Insgesamt ein sehr schönes Multimedia Theme.

irresistible

 

 

1.4 Portfolio – WPESP Theme | Demo | Download

- ist ein erster Schritt der Online Portfolios um WordPress als CMS zu nutzen. Ein sehr schönes Portfolio mit animierten Bildübergängen, schönen Vorschaufunktionen und eine übersichtliche Integration des Textes. Es benutzt den WordPress Codex zum Programmieren und den Ajax – Coda Slider Effect für die Artikelübergänge. Sehr hübsch!

WPESP_theme

 

 

1.5 Fotofolio | Demo

 

fotofolio

 

 

1.6 Infinity| Demo | Download

 

infinity

 

 

1.7 Modfolio| Demo| Download

 

modfolio

 

 

1.8 Gallery | Demo | Download

 

galleri

 

 

1.9 Folio Elements | Demo | Download

 

folio-elements

 

 

1.10 Linquist | Download

 

Linquist

 

 

1.11 Snapshot | Demo | Download

 

Snapshot

 

 

2. Kostenpflichtige WordPress Portfolio Themes

2.1 eGallery | Demo | Preis: $19.95 pro Jahr (Mitgliedschaft)

 

egallerytheme

 

 

2.2 GrungeMag | Demo | Preis: $19.95 pro Jahr (Mitgliedschaft)

 

grungemagtheme

 

 

2.3 Foliotastic: Ein Premium WordPress Portfolio Theme | Demo | Preis: $30

 

- ist ein mit Funktionen vollgestopftes Portfolio/Blog Theme, das im Dashboard ein Admin Panel hinzufügt. Über dieses zusätzliche Menü können alle Funktionen und Änderungen vorgenommen werden.

foliotastic

 

 

2.4 Photopro | Demo | Preis: $29+

 

pro2

 

 

3. Design dein Portfolio

Ihr werdet wahrscheinlich zwei Hauptarten von Seiten auf eurem Online-Portfolio benutzen: eine Homepage oder Haupt-Portfolioseite und individuelle Projektseiten. Eure Hauptseite wird wahrscheinlich aus einer Reihe von Vorschaubildern bestehen, die eure Arbeit visuell zusammenfassen. Weiterführende individuelle Projektseiten bieten mehr detaillierte Informationen über eure Arbeit an.

 

 

Eure Haupt-Seite Entwerfen

Etwas haben alle Portfolio Themes gemeinsam, sie konzentrieren Bilder auf der Homepage. Normale Blog Themes haben ihren Brennpunkt nicht auf Bilder, sondern auf den Text. Euer Portfolio Theme sollte es euch folglich einfach machen, Bilder in den Vordergrund zu stellen. Jedoch auch den Text nicht ganz aus den Augen verlieren. Ob ihr eure Bilder im Tabellenformat, in chronologischer Ordnung, oder in einer Slideshow präsentieren wollt, ist eure Entscheidung. Jedoch solltet ihr drauf achten, dass die Bilder in der Vorschau groß genug sind, damit der Besucher einen groben Überblick vom Bild bekommt.

Vielleicht wollt ihr mit den Bildern eures Portfolios einige Einleitungsinformation anzeigen. Eine Weise, dies zu verwirklichen, ist ein “Sticky Post” einzuschließen. Mindestens 2 Plugins sind dafür geeignet: Simple Sticky Posts und WP-Sticky.

Die Art und Weise wie ihr eure Bilder auf der Webseite vorstellt, ist euch überlassen. Kleine Helfer gibt es allerdings viele.

 

 

Plug-Ins zur Darstellung eurer Bilder

Eure Bilder sind die Herzstücke der Fotoseite oder des Portfolios. Ein besonderes Augenmerk sollte also auf der professionellen Präsentation der Bilder liegen. Um euch die mühsame Arbeit des Codens zu erleichtern, stelle ich euch hier noch einige WordPress Plugins für Bilder vor.

Vorschaubild in Zusammenfassung integrieren

Dieses nützliche kleine Plug-In, wird das erste Bild in eurem Artikel als Vorschaubild integrieren. Das Vorschaubild erscheint dann im Archiv, in der Zusammenfassung auf dem Blog, in den Suchergebnissen, oder in der Kategorieübersicht.

screenshot-1

 

 

Slide Press

Ebenfalls ein sehr professionelles Plug-In. Es integriert eine Slideshow von SlideShowPro in euren WordPRess Blog.

slideshow

 

 

Featured Content Gallery

Dieses wunderbare Plugin erstellt eine automatisch rotierende Gallerie eurer Bilder, die ihr überall integrieren könnt.

featuredcontentgallery

 

 

Ebenfalls gibt es eine Reihe von Plugins, die eure Bilder beim Klicken hervorheben und vor einen dunklen Hintergrund stellen. Ein Beispiel hierfür ist die NextGEN Gallery.

nextgengallery

 

 

Was sollte ein Portfolio noch beinhalten?

Logisch – es sollte nur eure besten Bilder enthalten. Lieber etwas weniger als viele mittelmäßige Bilder. Sonst entsteht ein falsches Bild. Ihr solltet auf jeden Fall eine “Über mich” Seite und ein Impressum erstellen. Letzteres ist in Deutschland mittlerweile Pflicht. In der “Über-Mich” Seite schreibt ihr über eure Qualifikationen und eure Hobbies. Mit was ihr euch im Moment beschäftigt und wo ihr gerade dran arbeitet. Ebenfalls könnt ihr hier auf eure weiterführenden Arbeiten hinweisen.

Ihr solltet vielleicht ebenfalls ein Bewertungssystem für eure Bilder integrieren. Damit die Benutzer sich etwas mehr mit den Bildern beschäftigen und sie auf sich wirken lassen. Keine Angst, kein Besucher wird eure Bilder schlecht bewerten. Allerdings hilft es euch um ein wenig Feedback über die Qualität zu bekommen. Weiterhin überwindet ihr den Punkt, eure Bilder von anderen, euch unbekannten Personen kritisch betrachten zu lassen. Veröffentlicht ebenfalls einige der Bilder auf Flickr, dort gibt es eine sehr nette und hilfreiche Foto-Community.

Die Kommentarfunktion von WordPress solltest du nicht abschalten. Feedback ist gut, und der Besucher möchte vielleicht mit die Kontakt aufnehmen, oder dir Tipps geben, oder dir ähnliche Bilder zeigen. Feedback und Kommentare sind wichtig.

 

 

Andere Vorschläge und Tipps

Halte das Design des Portfolios simpel. Nicht das Design des Portfolios ist das Hauptthema, sondern deine Bilder. Klar ist die Art der Präsentation wichtig, aber lieber die Funktionalität, anstatt des Homepagedesigns, dominieren lassen.

Wenn du dein Theme personalisieren willst, lade alle möglichen Darstellungen die die gefallen auf den Webspace, oder deine lokale Installation und kopiere den php Code der dir gefällt in dein Theme. Auf diese Art kannst du ganz einfach gewünschte Funktionen oder Darstellungen in einem Theme vereinen. Wenn du die zu modifizierenden Seiten als html Datei abspeicherst, kannst du ganz einfach in deinem Editor das CSS und weiteren Code anpassen, bis alles so passt wie man sich das wünscht.

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...
Kategorie : WordPress | Blog

Um im aktuellen Wordpress Theme Remix 3.0 die Archivseiten der jeweiligen Kategorien im Menü anzeigen zu können, müsst ihr die header.php Datei modifizieren.

Welche header.php Datei benutze ich?

Um in WP Remix 3.0 zu sehen welche header.php Datei ihr benutzt, schaut einfach im Dashboard unter “Seiten” und “Bearbeiten” im Editor die einzelnen Seiten an. Dort steht unter “Remix – Add Template File” der aktuell verwendete header für diese Seite.
Es gibt vier verschiedene Header zur Auswahl ( “header”, “header1″, “header2″, “header3″ ).
Merkt euch also die genaue Bezeichnung, um den entsprechenden im nächsten Schritt wiederzufinden.

Runterladen der header.php

Leider kann man in WP Remix 3.0 nicht unter “Darstellung” >> “Editor” auf die header.php zugreifen, also muss sie lokal auf dem Computer gespeichert werden.
Die geschieht einfach über euer FTP-Programm. Die verschiedenen header.php Dateien befinden sich in folgendem Verzeichnis:

/wp-content/themes/wpremix3/includes/header

Speichert die entsprechende Datei also auf dem Desktop.

Modifizieren der header.php um statt der Seiten, die Kategorien im Menü anzuzeigen

Öffnet die header.php Datei mit einem Programm wie Adobe Dreamweaver (Testversion hier downloaden), vermeidet die Benutzung vom Windows “Editor” oder sonstigem, da dieser beim Speichern die Formatierung der Datei beschädigen könnte.

Scrollt in der header.php nach ganz unten, dort findet sich folgender Eintrag:

<div id="nav">
  <ul id="navmenu-h">
    <?php
        wp_list_pages('sort_column=menu_order&title_li=');
        ?>
  </ul>
  <div class="rss"><a href="<?php bloginfo('rss2_url'); ?>">RSS FEED</a></div>
</div>

Die für uns wichtige Zeile ist:

wp_list_pages('sort_column=menu_order&title_li=');

Diese wird durch folgende ersetzt:

wp_list_categories('title_li=');

Die Datei kann nun gespeichert und wieder in “/wp-content/themes/wpremix3/includes/header” hochgeladen werden. Die alte Datei vielleicht vorher sichern, bevor ihr sie überschreibt.

Nun sortiert die header.php nicht mehr die Seiten eures Wordpress Blogs, sondern zeigt eure Kategorien im Menü an.

1 Star2 Stars3 Stars4 Stars5 Stars (1 votes, average: 5.00 out of 5)
Loading ... Loading ...
Kategorie : WordPress | Blog
Powered by WP VideoTube