Beiträge

mein Mobiles Design ist nun wieder eingebunden und sollte auf den meisten Mobilen Geräten ganz gut aussehen (bis auf die Galerien, da muß ich mal schauen, ob ich da noch irgendeinen Weg finde die anders anzuordnen)

und dank dem Layout Plugin sollte das mobile Design ja automatisch aktiv sein, wenn man mit dem Smartphone/Tablet drauf geht.

nun dann noch nen paar kleine feinheiten fertig machen und dann auf dem alten webspace nen hinweis auf die neue Seite einbauen

danke fürs drüber schauen, es ist schwer das Design auf alles anzupassen
daher hab ich für Mobile Geräte ein extra Template, was ich wieder einbinde muß halt nur das Plugin wieder aktivieren, dann sind die Mobilen Geräte zumindest schonmal wieder bedient

hauptsächlich gehts mir ja immer darum, das man alles gut lesen kann, aber einfach Schwarz auf Weiß finde ich zu öde, soll ja nen bisschen nach was ausschauen nu muß ich den Inhalt auf den neusten Stand bringen


und ich hab das 's bei abg weggemacht, wenn man es ausspricht hat es auch keinen echten sinn ^^

ich mal wieder

bin gerade dabei mein "älteres" Projekt auf meinen neuen Webspace zu verschieben und das ganze mal etwas auf zu räumen ( waren fast 900mb nun sind es nur noch 250mb ) und dabei hab ich mir mal gedacht, das ich da auch mal wieder nen neues Template machen kann...

das ganze schaut nun so aus: http://droid-world.fufus-design.de/

und da wollt ich einfach mal kurz hier die Meinungen der Profis zum Template erfragen vielleicht fällt ja wieder jemanden was auf, was ich nicht sehe, z.b. ob es auf größeren Auflösungen gut zu lesen ist und alles an der richtigen stelle ist, da ich das ganze bei mir nur auf 1280x1024 testen kann, da passt es alles soweit gerade für Auflösungen unter 1280x768 ist das Template nicht gerade geeignet, da es eine feste Breite besitzt, aber wer surft heut zu Tage noch mit 1024x768 (oder kleiner) durchs Internet? 

naja, ich werd nun mal ne runde meine Augen ausruhe genug angepasst für heute ^^

es ist schwer das ganze für alle Layouts passend zu machen, Möglichkeit wäre ja noch, wenn man 2 css Dateien fertig macht, eine für helle und eine für dunkle Hintergründe, dann muß man die passende css nur selbst umbenennen
dazu nen kleiner Hinweis in der Doku des Plugins und fertig, für tiefgreifende Anpassungen muß man eben selbst sorgen, man kann es ja nicht allen recht machen

aber für die "Standard-Layouts" hätte die alte css ja gepasst soweit ^^

kein Problem
man muß eben nur wissen wonach man sucht, und wie Rainer sagte, können da diverse tools wie firebug bei Firefox sehr gut helfen

okay, die eingaben sollten "imput" oder "textarea" sein, in der plugin.css gibt es dazu folgende punkte:
input#qc_name, textarea#qc_text
input#qc_arithmetic
und
input#qc_submit

kopier dort mal bei allen zwischen die {} folgendes rein:
color: #ffffff!important;

dann sollte es weiß sein, du kannst die farbe auch anpassen.

ich hoffe das es diesesmal das richtige ist

Thorsten hat es mit der Linkfarbe schon gut erklärt
footer hat glaub ich nen eigenen farbbereich dafür gehabt, hab ja dein layout als vorlage genommen

und wegen der transparenz, da gibt es viele möglichkeiten, das bild könnte noch kleiner sein, selbst 1x1 px würd reichen, da es sich ja wiederholt und je nach dem, was für ein programm man nutzt ist das vorgehen verschieden aber notfalls hilft die google suche weiter und dann kann man an der transparenz rumspielen...


es ist alles eine sache des testens, so hab ich auch mal angefangen, und notfalls kann man sich per google auch html/css template vorlagen suchen, die man sich anpasst, ist oft der einfachste weg, wenn man selbst nicht genau weis, wie es geht, aber man findet selten was passendes und man muß immer noch selbst dran rumbasteln, aber so kann man oft verstehen, wie man was erreichen kann

in der plugin.css mal

Code Auswählen Erweitern

table#qc_table {
}
so abändern

Code Auswählen Erweitern

table#qc_table {
color: #ffffff;
}
eventuell die farbe anpassen oder auch schauen, das "color: #ffffff;" eventuell noch woanders einfügen muß, da muß man notfalls testen

ich bin eben ein noob
ich muß mich da ja reinfinden ^^ texte erstellen und co ist kein ding

ich wusste du findest was
hab das ja aus dem slimbox plugin übernommen, da mir sonst nicht eingefallen ist, wie ich es hinbekomme, das der header nur 1 mal ausgegeben wird

ich mach mich da nächste woche dran, übers we find ich leider keine zeit dafür aber es funktioniert auch so derzeit

unter "größe x y" gibt man die größe der Lightbox an, die geöffnet wird, soll das fenster z.b. eine Breite von 80% und höhe von 50% haben gibt man nur "80% 50%" an, um es an einem beispiel zu zeigen:

Code Auswählen Erweitern

{mediabox|extern,http://www.doman.tl,Externe Seite,80% 50%}

man kann bei größe entweder "%" Werte nutzen oder feste pixel werte, bei festen werten einfach nur die zahlen eingeben, ohne px oder sonst etwas dahinter, also für 800x600 px einfach "800 600" eingeben

alle angaben werden dur ein "," getrennt, bei beschreibung und größe sind leerzeichen erlaubt, bei der größe sogar erforderlich, wenn man die größe angibt, muß man höhe und breite angeben, sonst kann es zu problemen kommen.

ansonsten einfach mal ne runde testen, nach kurzer zeit sollten die möglichkeiten die man hat relativ leicht zu durchschauen sein

das ganze kann man mit div containern lösen, die man per css formatiert...

ist nicht unbedingt einfach... aber ich hab mal als beispiel wieder was für dich gebastelt in wie weit du es für dich anpassen kannst bleibt dir und deinem können überlassen...
aber das template sieht schon irgendwie zusammengewürfelt aus aber du kannst dir ja noch immer was anderes zusammen bauen, wenn es dir doch nicht mehr so gefällt ^^

das mit den abgerundeten Ecken geht auch noch anders, aber so ist es einfacher finde ich
einfach nen bisschen mit rumspielen.

in der style.css ist z.b.:
#main_content
für die halbtransparente box zuständig, dort kann man diverses dazu einstellen und auch das transparente bild austauschen.
mach aus dem text-align: center; mal text-align: left;, das ist rechts das Detailmenu auch wieder linksbündig, ansonsten testen, testen, testen

und durch den body tag

Code Auswählen Erweitern

background-repeat:no-repeat; background-position:center center;
background-attachment:fixed;
wird das hintergrundsbild (das weltall bild) zentriert gesetzt ohne wiederholung und das es nicht mitscrollt, das kannst natürlich auch anpassen..

aber spiel einfach etwas rum und pass es dir an, wie du es gern hättest, bei fragen einfach melden, dann schau ich, wie es umsetzbar ist oder ob mir was einfällt, farben bisschen anpassen und die positionen der elemente etwas ändern kann viel ausmachen.
und durch den halbtransparenten hintergrund ist alles besser zu lesen finde ich.


und als tip, änder die Textfarben mal in weiss oder ein helles grau für den content, ich denke, das es dann besser zu lesen ist

der hoster hat zwar nen paar Tage gebraucht, aber sie haben es für dich angepasst das macht einen guten hoster aus.
dann hoffe ich mal, das dem cms vergnügen nun nicht mehr im wege steht

[Bekannte Fehler]

hier mal die erste Testversion
und ja, der code ist recht unsauber, ich weis, ich weis... aber es funktioniert vorerst am code kann man am ende ja noch was machen...

aber nun mal zur funktionsweise, folgendes ist derzeit möglich:
bilder, youtube, iframe (interne, extere seiten), flash, swf, mp4, flv, quicktime, mp3, inline (versteckte div container)

wie man es einsetzt:

Code Auswählen Erweitern

{mediabox|typ,link,beschreibung,größe x y}
beschreibung und größe ist optional, doch will man die größe angeben aber keine beschreibung, muß man bei beschreibung einfach ein Leerzeichen eingeben, gibt man nichts von beidem an, werden im plugin definierte standard vorgaben verwendet, beim bild kann man keine größe angeben, die größe der vorschau wird in der im plugin enthaltenden css festgelegt.

hier beispiele zu allen formaten:

Code Auswählen Erweitern

bild per link
{mediabox|bild,http://www.meine-domain.tl/bild1.jpg,beschreibung}
oder per Datei aus dem cms
{mediabox|bild,[bild|Willkommen:mozilo.jpg],Testbild 1}

youtube
{mediabox|youtube,Pev9RU-Jybw}
es muss nur das was im link nach watch?v= steht angegeben werden

externe / interne seite (iframe)
{mediabox|extern,http://www.doman.tl,Testseite,800 400}
ohne http:// wird auf serverinterne inhalte zurück gegriffen

flash, mp4, swf, flv nutzen den selben typ
{mediabox|flash,http://www.meine-domain.tl/test.mp4,Test Video,512 302}
ohne http:// wird auf serverinterne sachen zurück gegriffen

quicktime inhalte
{mediabox|quicktime,http://www.domain.tl/test2.mov,Quicktime Test,240 110}
ohne http:// für intere inhalte, zur wiedergabe muß quicktime installiert sein auf dem PC

mp3 (wav sollte auch funktionieren)
{mediabox|audio,http://www.domain.tl/test.mp3,mp3 Test,70% 20}
ohne http für internen inhalt

inline / versteckter div container
{mediabox|inline,mb_inline1,Inline Content Test,85% 50%}
[html|<div id="mb_inline1" style="display: none;"> <span style="color: #999999; text-align: center;">This is an example of content that was hidden on the page, and opened in Mediabox using an anchor link.<br/><br/> <a href="" onclick="Mediabox.close();return false;">close onClick</a></span></div>]
der div container kann per html syntax erstellt werden, wie in diesem beispiel.
als id möglichst immer mb_blabla verwenden, so vermeidet man eventuelle konflikte.


das waren soweit die beispiele und notfalls einfach bisschen rumspielen.
ich hoffe es gefällt euch, falls fehler entdeckt werden, bitte bescheid geben. und bei größerem interesse an dem plugin werd ich dann weiter dran arbeiten

Bekannte Fehler
- es gibt webseiten, die sich nicht im iframe anzeigen lassen wollen, wie z.b. google, da muß man Testen, was geht
- es kann zu problemen kommen, wenn schon jquery scripte auf der seite laufen, ich hab mal irgendwo nen workaround gesehen, find dem im moment aber nicht