1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Mockup umsetzen mit Wordpress

Dieses Thema im Forum "Design" wurde erstellt von coas, 17. Februar 2012.

Schlagworte:
  1. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Hallo,

    da ich leider kein Theme finde was meinem Portfolio-Mockup (siehe Anhang) entspricht frage ich hier nach wie und ob man überhaupt in Wordpress sowas realiseren kann.:x

    Die Fotos sollen also immer horizontal nach rechts angeordnet sein und mit einem normalen scrollbalken anschaubar sein.

    Jedes Foto ist in seiner Höhe fest!
    Wichtig daran ist die variable Fenstergröße. Es darf also ruhig alles verschoben werden, nur die höhe der Fotos (und Breite) darf nicht beeinflusst werden.

    Eigentlich zu simple, aber ich hab keine Ahnung wo ich ansetzen könnte.

    Als i-Tüpfelchen würde ich gerne eine "Image-Caption" haben die mir die Bilder beschriftet (zum Beispiel links unten in einer kleinen grauen box) IM BILD. Also die Box im Bild wie ein Logo, nur das der Text von Wordpress etc. eingefügt wird und der Text auch kopierbar ist.
    Sowas in der Art halt ;)

    Kann mir jemand helfen?
    Ich danke schon mal im vorraus für eure Hilfe :)
     
    #1 coas, 17. Februar 2012
  2. Ammaletu

    Ammaletu Well-Known Member
    Ehrenmitglied

    Registriert seit:
    14. Juli 2007
    Beiträge:
    4.696
    Zustimmungen:
    0
    Natürlich geht das, da ist doch nichts bei, was man mit etwas HTML+CSS nicht umsetzen kann. Als Grundlage kannst Du ein ähnliches Theme nehmen oder besser vielleicht noch ein "leeres" Theme wie z.B.:
    http://speckyboy.com/2010/03/22/10-blanknaked-wordpress-themes-perfect-for-development/

    Die Frage ist für mich eher, wo in Deinem Mockup denn nun die üblichen WP-Elemente zu finden sind. Verlinkt jedes Foto auf einen Beitrag? Auf eine statische Seite?
     
    #2 Ammaletu, 17. Februar 2012
  3. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Danke Ammaletu. Auf die Idee nach Blank-Themes zu suchen bin ich gar nicht gekommen :) Da ist ja schon was brauchbares dabei, versuch ich heute mal.

    Von den üblichen WP-Elementen würde ich eigentlich nur den Beitrag benutzen - für jedes Foto einen. Das wäre Theoretisch schön einfach. Wiederum ist das sortieren der Fotos in einem einzigen Beitrag wieder einfacher.
    Da ich ja ca. 4 Menüpunkte mit je einer eigenen Seite habe, wäre es wohl einfacher einfach jeden Menüpunkt mit einer Seite zu verlinken und dann einfach die Seite zu aktualisieren, oder? Da es ja ein Portfolio werden soll ändere ich da ja recht selten was.

    Ich probier mal mein Mockup mit einem leeren Theme von oben umzusetzen. Mal schaun was bei rauskommt (ich frag bestimmt bei der variablen Breite des "Fotostreifens" wieder nach....)

    Danke aber schon mal
    Tom
     
    #3 coas, 18. Februar 2012
  4. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Also ich hab es jetzt soweit fast (von der Idee her):

    http://tomzylla.com/

    Die Menüpunkte sind jetzt immer Seiten, das funktioniert für den Zweck prima. Bilder werden mit NextGen auf der Seite angezeigt.

    Aber: Warum werden die Bilder nicht nebeneinander angezeigt? Die Bilder sollen ja von rechts "rauskommen". Derzeit muss ich nach unten scrollen. Ich will aber nach rechts scrollen?

    Leider ist das mit der variablen Größe natürlich auch ein grauen. Das wusste ich. Aber ich wollte eigentlich sowas wie zu alten Frame zeiten mit frames <frameset cols="50%,*"> machen. Denn jetzt wird beim Fenster kleiner machen auch die linke freie Seite sofort proportional zum kleiner werdenden Fenster in der Breite kleiner. Bei Prozenten sieht das besser aus, ist halt nicht proportional. Bekomm ich das in WP auch hin?
     
    #4 coas, 18. Februar 2012
  5. Ammaletu

    Ammaletu Well-Known Member
    Ehrenmitglied

    Registriert seit:
    14. Juli 2007
    Beiträge:
    4.696
    Zustimmungen:
    0
    Alles, was Dir jetzt noch fehlt, ist reines CSS, denke ich. Das sollte kein Problem sein.

    Dann musst Du das im CSS entsprechend konfigurieren, die Browser können ja nicht Gedanken lesen. ;)

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Das floatet alle Links nach links, besser wäre es vermutlich, es auf Links einer bestimmten Klasse zu beschränken. Kann NextGen da immer eine Klasse dranhängen?

    Dann müsste man noch schauen, dass das nicht umbricht. Hm... Vielleicht so?

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Naja, ich weiß nicht, ob das schon reicht. Da musst Du etwas experimentieren.


    Wenn ich das in Deiner ursprünglichen Skizze richtig sehe, sollen links immer 100px frei sein und dann der Inhaltsbereich so breit wie das Fenster? Sollte das nicht gehen, wenn Du #main einfach keine width aber dafür einen margin-left: 100px gibst? Als Block dehnt sich das dann ja automatisch auf die Fensterweite aus.
     
    #5 Ammaletu, 20. Februar 2012
    Zuletzt bearbeitet: 20. Februar 2012
  6. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Danke! Ich probier's aus und melde mich :)
     
    #6 coas, 20. Februar 2012
  7. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Mh, welche CSS nehm ich jetzt?
    Ich hab das Theme THEMATIC (ein blank theme von dem geposteten link)
    Da gibt's die Style CSS die nur ganz wenig enthält und auf verschiedene CSS verlinkt für default, images, reset etc. ...
     
    #7 coas, 20. Februar 2012
  8. Ammaletu

    Ammaletu Well-Known Member
    Ehrenmitglied

    Registriert seit:
    14. Juli 2007
    Beiträge:
    4.696
    Zustimmungen:
    0
    Es ist Dein Theme, Du musst selbst entscheiden, wie Du es organiseren möchtest. Da Thematic ab und an auch mal aktualisiert wird, wäre es eventuell auch eine Überlegung wert, ein Child-Theme anzulegen. Dann hast Du alle Deine Modifikationen schön gekapselt an einem Ort. Naja, kommt drauf an, wie viel Du an den Dateien änderst. Es lohnt nicht wenn Du jede einzelne Datei umschreibst.
     
    #8 Ammaletu, 20. Februar 2012
  9. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Ich hab von CSS Organisation keine Ahnung... ich arbeite quasi mit Firebug und FileZille nach Try and Error.... :D

    Vllt. isses doch einfacher das ganze mit Frames zu machen ohne CMS im Hintergrund :(
     
    #9 coas, 21. Februar 2012
  10. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    #10 coas, 21. Februar 2012
  11. Ammaletu

    Ammaletu Well-Known Member
    Ehrenmitglied

    Registriert seit:
    14. Juli 2007
    Beiträge:
    4.696
    Zustimmungen:
    0
    Du könntest ein iFrame nehmen, aber das ist wirklich nicht nötig, siehe ja auch den von Dir geposteten Code.

    Zur Organisation des CSS: Leg Dir doch einfach ein eigenes Stylesheet an, das alle Deine Änderungen am Theme enthält. Das bindest Du in der style.css einfach als letztes ein, nach allen anderen includierten CSS-Dateien. Dann kannst Du auch alle anderen Angaben bei Bedarf überschreiben.


    Das ist eigentlich selbsterklärend: CSS-Code ins Stylesheet, HTML in die Theme-Datei :).
     
    #11 Ammaletu, 22. Februar 2012
  12. coas

    coas Member

    Registriert seit:
    2. Januar 2010
    Beiträge:
    17
    Zustimmungen:
    0
    Also ich nutze jetzt Indexhibit. Bietet das nativ an. http://tomzylla.com
    Funktioniert für mein zweck super. Nicht genau nach Mockup, aber als alternative doch wirklich gut.
    Angeblich kann man das auch irgendwie Wordpress integrieren aber das wäre für meine Zwecke eh zu aufgeblasen.
    Vllt. werde ich mit nem iFrame meine alte Seite zippster.de in der neuen als Blog integrieren. Das ist glaube recht einfach zu realisieren.

    Danke trotzdem für deine Hilfe :)
     
    #12 coas, 23. Februar 2012
(Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können. )
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden