RapidWeaver Theme selber machen!

brinki

brinki

Aktives Mitglied
Thread Starter
Dabei seit
27.05.2005
Beiträge
621
Reaktionspunkte
1
Hallo liebe MacUser-Gemeinde!

Ich bin heute mal auf das Programm RapidWeaver gestoßen und ich muss sagen ich bin begeistert. Was mich jedoch ein bissel stört ist, das man ja nur die vorgefertigten Themes hat. Natürlich will man seine eigene Page ja auch ein wenig individuell gestallten.
Deshalb habe ich mir mal das Theme SDK von der Zeit geladen, wo man jedoch direkt enttäuscht wird, da man ja dem CSS mächtig sein muss. Aber wenn ich solche Programmierersprachen könnte bräucht ich ja RW net.
Also nun meine Frage an euch:
Gibt es ein Programm oder irgendwas anderes, das es mir möglich macht, im Photoshop erstellte Designs so umzuändern, dass ich sie direkt als Theme benutzen kann?

Vielen Dank für eure Hilfe!
 
Ich kenn keins.

Aber der Einstieg in CSS ist echt nicht die Welt. Wenn du mit Photoshop kannst, fällt dir CSS garantiert nicht schwer. Glaub mir, es lohnt sich. :)
 
Schliesse mich der Frage an. Das Programm scheint ganz nett zu sein, aber nachdem ich bei den vorgefertigten Themes nichts wirklich passendes gefunden habe, habe ich es wieder gelassen...
 
Saugkraft schrieb:
Ich kenn keins.

Aber der Einstieg in CSS ist echt nicht die Welt. Wenn du mit Photoshop kannst, fällt dir CSS garantiert nicht schwer. Glaub mir, es lohnt sich. :)
Zum Vergrößern anklicken....

Wo soll man denn da anfangen? Ich schätze, dass ist doch wieder so ne Wissenschaft für sich.
Ich mein HTML versteht man ja noch aber da weiss man gar nicht was, was ist.
 
Du kannst unter RW ein Theme anklicken und dir den Paketinhalt anzeigen lassen. Die Bilder und Graphiken kannst Du alle austauschen mit Deinen eigenen. Somit kannst Du dir zuvor Deine eigenes Theme auf Basis der vorhandenen Themes basteln und dann nur noch auffüllen mit Inhalt. So habe ich es mit einer Seite einer Freundin gemacht. Habe nur das Header Bild ausgetauscht und Voilà, sieht recht gut aus:

http://www.suntjefreier.de
 
Zuletzt bearbeitet von einem Moderator:
In der Theme-Vorschau in RW kannst du mit der rechten Mouse-Taste den Inhalt öffnen. Im sich öffnenden Finder-Fenster siehst du dann die Files für deine Seite und das entsprechende Theme, d.h. die html- und css-Files samt Ordner (png oder jpg) der Bilder. Hier fängt's schon an: du kannst z.B. einfach die Bilder (immer mit gleicher Größe) auswechseln (z.B. den Header) oder den Header in der style.css-Datei erweitern, indem du z.B. die Breite änderst (... und z.B. ein neues eigenes Bild einsetzt.

Ergo: Themes ändern ist ganz einfach, du brauchst nicht wirklich viel Ahnung von HTML oder CSS. Du solltest aber immer eine Sicherung des zu ändernden Theme anlegen ("duplizieren). Ich habe jedenfalls keine Ahnung und alles mögliche geändert.

Für RW gibt es auch ein Shareware-Programm, mit dem du per Drag'ndrop die themes ändern kannst. Einfach mal im Support-Forum (im deutschen Teil) nachsuchen.

Viel Erfolg!

PS: in der index.html sind die Grundzuweisungen geregelt; in der style.css die Farben, Größen und Abstände etc.. Ergo: du musst in der .css Änderungen vornehmen.
 
Das habe ich auch schon herraus gefunden! Nur leider weiss ich nicht was was ist in der CSS Datei
 
Ein eigenes Theme mit Rw zu entwickeln ist kein Problem, man sollte sich nur gut mit HTML und CSS auskennen....sonst kann man es lassen...
 
schau Dich mal direkt bei realmacsoftware um, da gibt es link zu 3rd party tools wie zB rwthememiner, mit denen auch der Laie 'eigene' themes erstellen kann ...
 
brinki schrieb:
Wo soll man denn da anfangen? Ich schätze, dass ist doch wieder so ne Wissenschaft für sich.
Ich mein HTML versteht man ja noch aber da weiss man gar nicht was, was ist.
Zum Vergrößern anklicken....
Wenn du HTML verstehst, seh ich bei CSS kein Problem.

Ein Beispiel:

<p></p> kennst du. Wenn du nun einen Absatz in rot schreiben willst, kannst du das so erledigen: <p style="color: #ff0000;"></p>

Der "Style" des Paragraphen ist: color (das ist die Textfarbe) in hexadezimal ff(rot)00(grün)00(blau). So funktioniert CSS. :D

Damit man nicht jeden HTML-Tag einzeln benennen muss, erledigt man das in der CSS Datei, die im Header eingebunden wird.

z.B:
Code: 
p { color: #ff0000; }
b { color: #00000; font-weight: bold; }
Heißt soviel wie: <p></p> in rot, <b></b> in schwarz und fett.

That's it.

Ok.. Eins ist noch wichtig, aber auch nicht schwer. CSS heißt Cascading Style Sheets. Das bedeutet, wenn eine Seite folgendermaßen aufgebaut ist:
Code: 
<div id="test">
<p>Blah, <b>HIER STEHT FETTSCHRIFT</b> und hier wieder nicht</p>
</div>
Dann stehen die Elemente folgendermaßen ineinander:
<div id="test"><p><b></b></p></div>

Das heißt also im div ein p und im p ein b. Das bedeutet: wenn du nur für das div ein Stylesheet verwendest, erbt das p die Eigenschaften vom div (weil es "außenrum" steht). Das b dann vom p und damit vom div.

Wenn du also ein Element hast, dass in einem anderen steht und dieselben Eigenschaften haben soll, musst du in CSS nix deklarieren. Wenn es andere Eigenschaften haben soll, musst du nur die definieren, die sich unterscheiden. Der Rest wird einfach vererbt.

Das ist das, was CSS für Anfänger ggf. etwas unübersichtlich macht. Im Grunde ist es aber ganz simpel.

Soviel zur Kurzeinführung. Es gibt da noch einiges, was man wissen muss.. Was ist eine Klasse, etc. Bei der Kaskadierung gibt es noch ein paar Feinheiten, manchmal muss man bei der Notation aufpassen, Browser interpretieren Angaben unterschiedlich, usw. Aber das sind Dinge, die man im Laufe der Zeit lernt.

Ein guter Einstieg ist CSS4You
Das find ich auch ganz gut. Und natürlich Selfhtml.

Wenn du testest, empfehle ich die WebDeveloper Leiste für Firefox. Damit kannst du dir allerlei Informationen über die Seite anzeigen lassen.

Tja und nun.. Viel Erfolg. :)
 
oh mann....vielen dank für deine kurzeinleitung! ich sehe schon, dass geht nicht so einfach wie ich mir das erhofft hab. ich finde so css nur wahnsinnig unübersichtlich!
bei html is alles klar strukturiert. Was ich noch nicht ganz noch vollziehen kann ist diese Container-Ding. Wie soll man da also seine in Photoshop zerschnittene Grafik einfügen?
 
Ich hab im März mit Rapidweaver eine Homepage gebastelt. Da hatte ich genau das gleiche Problem.
Durch ändern des PageHeader Bildes und editieren der Farben im styles.css hab ich das dann doch einigermaßen individuell hinbekommen.

Meine zweite Homepage hab ich aber komplett "freihand" gemacht. Und inkl. CSS hat das echt geil geklappt. Man muss nur anfangen.

Das mit den Containern ist eigentlich easy. Wie Kartons im Karton. Also wenn du drei kleine Kartons in einem großen hast, dann brauchts du nur den großen zu verschieben und die kleinen rutschen mit.
Das ist das ganze Prinzip.

Zum editieren benutze ich Smultron.
 
Zurück
Oben Unten