TEMPLATE: Bootstrap - freies responsive Template

[olli0578]

Mensch Karl, das ging aber fix. Hab die beiden Korrekturen gerade in meinen Testshop übernommen.
Sieht soweit ganz gut aus. Jedoch werden immer noch nur die ersten fünf Topkategorien im Dropdownmenü ausgegeben. In der Box rechts werden alle Topkategorien ausgegeben.
Ist das so beabsichtigt, oder schlummert da doch noch irgendo ein Fehler?

Auf die Gefahr hin, mich bei Dir unbeliebt zu machen. Ich hab da noch ein paar Kleinigkeiten gefunden:

• Sonderzeichen werden bei mir teilweise nicht richtig angezeigt. Beispiel: Privatsph�re und Datenschutz in der Box unten links und im Seitentitel
• Wenn ich den Warenkorb über das Handy anzeige, ist das Design verschoben.
• Die Thickbox "Versandkosten wird nicht richtig angezeigt. Es öffnet sich nur eine leere Thickbox mit dem Titel "Informationen"

Das sollte es für den Moment gewesen sein.
Ich muß nochmal betonen, das Du mit dem Template echt eine klasse Arbeit abgeliefert hast.
Danke fürs Teilen.

In diesem Sinne

Einen schönen Abend noch.

Gruß Olli

[olli0578]

Kurzer Nachtrag zum Superfish Menü:
Wenn eine Kategorie leer ist und in der Datei
\templates\bootstrap\source\inc\xtc_show_category_superfish.inc.php
"Hide Empty" auf true eingestellt ist, können die Kategorien auch nicht angezeigt werden.
  
Also mein Fehler. Das Menü funktioniert jetzt einwandfrei.

[Karl1]

Hallo Olli,
du bist mir zuvorgekommen. Leere Kategorien anzeigen macht doch auch keinen Sinn. Außerdem zeigt mein Screenshot im Beitrag 1 sechs Topkategorien.

Zu den Sonderzeichen:
Hast du in der .htaccess auf UTF-8 umgestellt? Zeile 4 # entfernen, Zeile 5 # einfügen. Musste ich bisher nach jeder Neuinstallation machen.

Zum Warenkorb:
Du hast völlig Recht, das muss ich mir nochmal anschauen. Ich bin mir aber noch im Unklaren wie man das am besten darstellen könnte. Soll ausschauen wie eine Tabelle, oben Überschrift, unten viele Artikel - auf dem Handy wäre eine sollche Tabelle aber winzig klein. Steht auf meiner ToDo-Liste.

Zur Thickbox:
Ich bin froh, dass du so genau schaust. Ich werkle ja schon lange an dieser Baustelle und hab total vergessen anzugeben, dass im Adminbereich die "Erweiterte Konfiguration - Popup Fenster Optionen" zu ändern sind.
[ Für Gäste sind keine Dateianhänge sichtbar ]
Musste leider sein, da Bootstrap mir Schwierigkeiten machte Bilder bzw. Text in der Modalbox anzuzeigen.

Gruß Karl

[Sick]

Hallo Karl1.
Vielen Dank für dein Template. Ein Responsive-Template fehlt modified zur Zeit wirklich.
Damit geht man auf jeden Fall einen riesen Schritt voran.

Ich werde es morgen mal auf meinem Testshop installieren.

Klasse, und vielen Dank für Deine Arbeit.

Gruß 

[olli0578]

Hallo Karl,

Sonderzeichen:
Die .htaccess hatte ich bislang noch nicht auf UTF-8 umgestellt. Das habe ich dann gerade mal nachgeholt. Jedoch leider ohne sichtbaren Erfolg. Auch ein leeren der Caches brachten keine Änderung. Die Umlaute werden immer noch nicht richtig dargestellt.

Warenkorb:
Da hab ich im Moment auch keine Idee zu. Werd mir aber bei Gelegenheit mal ein paar Shops auf dem Handy ansehen.

Thickbox:
Die Einstellungen habe ich vorgenommen. Dieses Problem ist also gelöst. Solltest Du auf jeden Fall in die Anleitung übernehmen.

[cyanx]

Hallo
Ich hab es jetzt auch mal in meinen Testshop eingebaut.
Ich habe auch das Umlaut problem trotz .htaccess anpassung.
Warenkorb auf meinem Samsung Note 1 ist OK ( Ich weis das ist eigentlich kein Handy )
Dann habe ich mich noch über den Ordner slideshow - Kopie und slideshow gewundert.
Aber der gesamteindruck ist echt super. Ich teste mal noch ein wenig.
VG
Stefan

[Karl1]

Hallo Stefan,
danke erstmal für dein Lob.
Ich bin gerade dabei, die Templatedateien noch zu verbessern und bin deshalb dankbar für alle Hinweise.

Der Ordner slideshow-Kopie ist schon vorgesehen für meinem zukünftigen Shop, hab übersehen den Ordner zu löschen.
Hatte bisher einen Shop mit Joomla 1.5 und Virtuemart und möchte umstellen auf Modified. Wichtig war und ist das Zusammenspiel mit der Warenwirtschaft CAO Faktura. Das klappt schon ganz gut.

Mein Ziel ist es, ein Template zu basteln, das auch für die Zukunft (Handy, Tablets) tauglich ist und möglichst wenig Core-Änderungen erforderlich macht.
Ich freue mich immer über OpenSource-Programme und möchte deshalb auch das Template offen für alle machen.

Zu den Umlauten: Ich installiere immer grundsätzlich UTF-8, also Datenbank und Shop. Auch im Head-Bereich des Templates wird charset = utf-8 angegeben. Hast die du Anleitung für Modified ab Seite 74 beachtet?

Gruß Karl

[olli0578]

Die Umlaute hab ich dann scheinbar in den Griff bekommen, dank des Tips mit dem Handbuch.
Der Warenkorb sieht jetzt auch erheblich aufgeräumter aus auf dem Handy (Iphone 4).
Lediglich die Inputbox mit der Artikelanzahl würde ich noch etwas schmaler machen. (40px)

Gestern habe ich mal versucht, den Imageslider gegen diesen
http://www.modified-shop.org/forum/index.php?topic=4183.0
auszutauschen, weil bei diesem Slider die Bilder und Texte nicht über den Quelltext,
sondern über den Adminbereich verwaltet werden können.
Ich bekomme aber die Sache mit der automatischen Größenanpassung nicht hin.
Vielleicht hat ja jemand Lust, dieses Modul mal für das responsive Template anzupassen.

@Karl: Der Slider muß ja nicht Standardmäßig ins Template eingebunden werden, sondern als Zusatzmodul speziell für dieses Template.
So bleibt das Template dann auch Updatesicher. Ich finde, dieses Modul würde das ohnehin schon sehr gute Template auf jeden Fall noch aufwerten.

[Pixelmetz]

Hey Karl,
Super Arbeit, die du da geleistet hast!

Ich habe glaube ich einen Fehler gefunden.

Wenn ich in den Artikeldetails auf "zzgl. Versandkosten" klicke, bleibt das Popup Fenster leer.

Im Original Theme wird der hinterlegte Content angezeigt. Hast du eine idee?

LG Patrick

[Karl1]

Hi Pixelmetz,
schau mal zur Antwort #32.

Ich bin derzeit mit olli0578 dran, das Template zu verbessern (Danke Olli für die Anregungen).

In absehbarer Zeit werde ich dann das Komplettpaket ins Forum stellen.
Gruß
Karl

[Pixelmetz]

Danke für deine schnelle Antwort! Habe das irgendwie übersehen, obwohl ich alles gelesen habe. hab gestern alles durchgelesen und heute hab ich es bemerkt (kurzzeitgedächtnis lässt grüßen) 

Was mir auch noch aufgefallen ist: Im theme ist ein Inline-style für den Body.

Code: CSS  [Auswählen]

body {
    padding-top: 90px;
}

Das ist im Quelltext zwischen den definitionen von den Bootstrap Css-Dateien. Ist es richtig, dass die bootstrap.css und bootstrap-min.css eingebunden werden?

Die bootstrap-min.css hat bei mir verhindert, dass das Theme bei mir zu 100% responsive ist.

LG Patrick

[olli0578]

Hallo Pixelmetz
Der Inline-Style ist der Fix für mein Problem aus Beitrag 21.
Die Anweisung müsste noch aus der general.css.php in die stylesheet.css oder bootstramp.css verfrachtet werden.

Ich habe gerade mal die bootstramp-min.css auskomentiert und festgestellt,
das sie durchaus ihre Daseinsberechtigung hat.
Ohne diese Datei verändern sich die Boxen nicht dynamisch, wenn sich die Fenstergröße ändert.
Vielleicht könntest Du mal ein bisschen genauer analysieren,
warum genau das Theme bei Dir nicht 100% responsive ist.
Gruß Olli

[Pixelmetz]

Hi Olli,
danke für deine Antwort. Bin noch recht neu im modified-shopping, daher macht mir die Dateistruktur noch etwas zu schaffen. Kannst du mir sagen, in welcher Datei (und evtl den dazugehörigen Pfad) ich den definierten Inline-style finde? Für meine Bedürfnisse brauche ich den nicht

Die daseinsberechtigung der Bootsrap-min.css kann ich nach etwas weitergehenden Tests bestätigen. Ich hab auch grad gesehen, dass es gar kein Fehler ist, höchstens eine Verbesserungsvorschlag.

Auf meinem Laptop mit der Auflösung 1388x768 wird die Klasse Container mit einer Breite von 1170px angezeigt.

Das ist auch die Breite, die für die min-width 1200px definiert ist. Das sieht bei der Auflösung sehr bescheiden aus.

Wenn die bootstrap-min.css nicht geladen wird, erhält die Klasse Container eine Breite von 940px. Das sieht wesentlich freundlicher und übersichtlicher aus.

Bisher dachte ich immer, dass die Bootstrap-min.css eine minified-Version der Bootsrap.css ist.

LG Patrick

[Karl1]

Hallo Pixelmetz,

Code: CSS  [Auswählen]

body {
    padding-top: 90px;
}

Das ist im Quelltext zwischen den definitionen von den Bootstrap Css-Dateien.

Der "padding-top" wird gebraucht, damit das Kategoriemenü unterhalb des schwaren Headerbereichs angezeigt wird (mach den Eintrag mal weg im Firebug und du wirst sehen, die Navigation rutscht hinter den Header).
Verkleinert man die Bildschirmbreite wird der feste Headerbereich aber beweglich. Jetzt kann ich diesen padding-top nicht mehr brauchen, deshalb wird dieser Abstand durch die bootstrap-responsive.min.css überschrieben - darum muss der Eintrag auch zwischen den beiden CSS-Dateien sein. Ich hoffe ich habs einigermaßen verständlich erklärt.

Ist es richtig, dass die bootstrap.css und bootstrap-min.css eingebunden werden?

Nein.
Es sollten bootstrap.css und bootstrap-responsive.min.css eingebunden werden.
Hast du was verändert?
Schau dir den Quelltext dieses Beispiels http://getbootstrap.com/2.3.2/examples/fluid.html an.

Die bootstrap-min.css hat bei mir verhindert, dass das Theme bei mir zu 100% responsive ist.

Responsive wird das Temlate nur wenn du die bootstrap-responsive.min.css einbindest. Ich habe absichtlich nicht die volle Bildschirmbreite genutzt wie im Beispiel oben. Wenn du das Template verändern möchtest, dann empfehle ich dir die Anleitung http://getbootstrap.com/2.3.2/index.html zu lesen.

Gruß Karl

[kandidel-food]

Hallo zusammen,

erstmal vielen Dank Karl für deine Arbeit und das du sie mit uns teilst.

Ich habe das Template nach Anleitung in die 1.06 eingebaut und habe nun das Problem, das der Inhalt der Kategorien nicht angezeigt wird. "Neue Artikel" und "Angebote" wiederum werden ausgegeben. Nur wenn ich auf eine Kategorie klicke, werden die Artikel (vorhanden) nicht aufgelistet.
Der Dw markiert mir fehlerhafte Einträge z.B. in der index.html und categorie_listing.html (siehe Bild-Anhänge).
Wo kann ich ansetzen?

Gruss, Stefan