...auf dem Weg nach bootstrap city

Discuss phpwcms here, please do not post support requests, bug reports, or feature requests! Non-phpwcms questions, discussion goes in General Chat!
User avatar
Oliver Georgi
Site Admin
Posts: 9442
Joined: Fri 3. Oct 2003, 22:22
Location: Dessau
Contact:

Re: ...auf dem Weg nach bootstrap city

Post by Oliver Georgi » Wed 27. Aug 2014, 19:44

Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Kleintierpraxis am Georgengarten

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Sat 30. Aug 2014, 12:05

Und wie bekomme ich dann (damit) den Link hinter dem dropdown-toggle weg? Bin gerade etwas verwirrt ;)
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Sun 12. Oct 2014, 12:57

Ok, den Hinweis gebe ich weiter: Bei der Weiterleitung ein # einfügen reicht... ;)
Hätte ich auch selber drauf kommen können! :oops:
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

User avatar
Uwe367
Posts: 883
Joined: Sat 15. Sep 2007, 07:19
Location: Koblenz

Re: ...auf dem Weg nach bootstrap city

Post by Uwe367 » Mon 13. Oct 2014, 08:20

Manchmal sieht ml den Wald vor Bäumen nicht :wink:

User avatar
Jensensen
Posts: 2986
Joined: Tue 17. Oct 2006, 21:11
Location: auf der mlauer

Re: ...auf dem Weg nach bootstrap city

Post by Jensensen » Thu 20. Nov 2014, 04:25

Durch diese Änderung vom 18. November 2014 https://github.com/slackero/phpwcms/com ... 936b01803a ist die Integration von bootstrap vermutlich noch einmal entscheidend verbessert worden. Das betrifft die Bildgröße bei einem responsive web design.
Wenn ich das richtig verstehe, können Bilder nun in einer Größe, größer als eine fixe Spaltenbreite angelegt werden. Denn je nach Endgerät variiert die Bildgröße und wird durch das CSS framework definiert. Bootstrap kann nun auf eine ausreichend große Bilddatei zugreifen, die auch nach einer Skalierung auf dem jeweiligen Endgerät immer noch optimal dargestellt wird.

Beispiel: Drückt man die F11-Taste, erscheint die Webseite im Web Browser im Vollbildmodus. Hierdurch erweitern sich in der Regel die Spaltenbreiten. Diese Darstellung wird von bootstrap erkannt und alle Inhalte werden angepasst, neu gerendert. Für Textinhalte ist das unproblematisch. Bilder müssten aber nun größer, vor allem breiter sein. Im Backend von phpwcms ist die maximale Größe jedoch einmalig definiert. Für die gerforderte Darstellung im Endgerät ist das Bild nun eventuell zu klein. In der Folge entsteht, bezogen auf die Bildposition bzw. auf die Spaltenbreite, eine Lücke um das Bild herum. Das Bild (klassisch) wurde ursprünglich mit der Breite der durch das Layout bestimmten Spalte hochgeladen und zudem durch die Maximalwerte fixiert.

Nach der oben genannten Änderung kann das Bild von vorn hinein deutlich größer hochgeladen und im System bereit gestellt werden. Eine letztliche Skalierung (viewport) erfolgt im Browser, mit bootstrap durch CSS. Bootstrap kann hierbei jetzt aber auf physikalisch größere Bilddaten zugreifen. Dadurch entstehen nun keine Lücken und die Bildqualität ist, beziehungsweise bleibt, optimal.
{so_much} | Knick-Knack. | GitHub
Umlaute im URL sind meistens immer Kacke.

User avatar
Oliver Georgi
Site Admin
Posts: 9442
Joined: Fri 3. Oct 2003, 22:22
Location: Dessau
Contact:

Re: ...auf dem Weg nach bootstrap city

Post by Oliver Georgi » Thu 20. Nov 2014, 07:50

genau :) wird in Kürze noch erweitert, sodass jeder CP nach Bedarf mit Gridinfo versehen werden kann und der Option eines definierten Wrappers, um beim Beispiel Bootstrap zu bleiben — Panel oder Well etc.
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Kleintierpraxis am Georgengarten

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Thu 20. Nov 2014, 08:00

Heißt das, dass dann auch jeweils physikalisch unterschiedlich große Bilder geladen werden (können)? In so ein Schmaatfon ein riesiges Desktopbild zu laden ist ja nicht zielführend (na gut, ich könnte das ja jetzt schon mit "if mobile"-Anweisungen im CP-Template eventuell teilweise abfangen, aber ...).
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

nameless1
Posts: 847
Joined: Sun 27. Apr 2008, 23:22

Re: ...auf dem Weg nach bootstrap city

Post by nameless1 » Thu 20. Nov 2014, 09:24

claus wrote:Heißt das, dass dann auch jeweils physikalisch unterschiedlich große Bilder geladen werden (können)? In so ein Schmaatfon ein riesiges Desktopbild zu laden ist ja nicht zielführend (na gut, ich könnte das ja jetzt schon mit "if mobile"-Anweisungen im CP-Template eventuell teilweise abfangen, aber ...).
dafür hat doch og hier und dir vor kurzem n js gepostet mit dem du basierend auf die bildschirmweite die bilde auslieferst.

User avatar
Oliver Georgi
Site Admin
Posts: 9442
Joined: Fri 3. Oct 2003, 22:22
Location: Dessau
Contact:

Re: ...auf dem Weg nach bootstrap city

Post by Oliver Georgi » Thu 20. Nov 2014, 09:27

das geht nur zuverlässig mit JavaScript und z.B. Lazyload. Serverseitig ist das alles ziemlich gurkig, da es keinen zuverlässig definierten Zustand gibt. Es gäbe sicher Möglichkeiten entsprechend Regeln einzuführen und einen Cookie mitzuschleifen oder Sessionvariable nach erstmaligen Seitenaufruf mit den über JavaScript gewonnenen Clientinfos. Aber das alles ist natürlich irre aufwendig — sprich das letzte Problem, dass mich gerade umtreibt.

Wie gesagt, meine erste Wahl dafür ist Lazyload-Technik, sprich es werden nur die Bilder geladen, die im Viewport sichtbar sind. Das lässt sich gut handhaben und ohne Anpassungen am CMS.

Ansonsten lässt sich vieles bereits über angepasste Templates regeln und das zukunftssichere <picture> Element

Muster als Idee?

Code: Select all

<picture>
  <source 
    media="(min-width: 650px)"
    srcset="img/cmsimage.php/650x0/{IMAGE_HASH}.{IMAGE_EXT},
            img/cmsimage.php/975x0/{IMAGE_HASH}.{IMAGE_EXT} 1.5x,  
            img/cmsimage.php/1300x0/{IMAGE_HASH}.{IMAGE_EXT} 2x"
  >
  <source 
    media="(min-width: 465px)" 
    srcset="img/cmsimage.php/465x0/{IMAGE_HASH}.{IMAGE_EXT},
            img/cmsimage.php/498x0/{IMAGE_HASH}.{IMAGE_EXT} 1.5x,  
            img/cmsimage.php/930x0/{IMAGE_HASH}.{IMAGE_EXT} 2x"
  >
  <img 
    src="img/cmsimage.php/650x0/{IMAGE_HASH}.{IMAGE_EXT}" 
    srcset="img/cmsimage.php/975x0/{IMAGE_HASH}.{IMAGE_EXT} 1.5x,  
            img/cmsimage.php/1300x0/{IMAGE_HASH}.{IMAGE_EXT} 2x"
    alt="Just a sample"
  >
</picture>
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Kleintierpraxis am Georgengarten

nameless1
Posts: 847
Joined: Sun 27. Apr 2008, 23:22

Re: ...auf dem Weg nach bootstrap city

Post by nameless1 » Thu 20. Nov 2014, 09:36

Jensensen wrote:Durch diese Änderung vom 18. November 2014 https://github.com/slackero/phpwcms/com ... 936b01803a ist die Integration von bootstrap vermutlich noch einmal entscheidend verbessert worden. Das betrifft die Bildgröße bei einem responsive web design.
ABER wenn man bis dato die bilder eh dynamisch via js und phpwcms Link-Methode (img/cmsimage.php/1006x400/2697831ffade9e98b37f865811a3938b.jpg) generieren lässt ändert sich nichts, richtig?

User avatar
Oliver Georgi
Site Admin
Posts: 9442
Joined: Fri 3. Oct 2003, 22:22
Location: Dessau
Contact:

Re: ...auf dem Weg nach bootstrap city

Post by Oliver Georgi » Thu 20. Nov 2014, 09:41

genau, dafür ändert sich nichts. Das war schon immer frei von den Beschränkungen in Bezug auf die Contentbreite.
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Kleintierpraxis am Georgengarten

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Thu 20. Nov 2014, 19:32

Feine Sache, das mit dem <picture> Element. Hoffen wir mal, dass der Browsersupport da schleunigst nachzieht...
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

nameless1
Posts: 847
Joined: Sun 27. Apr 2008, 23:22

Re: ...auf dem Weg nach bootstrap city

Post by nameless1 » Fri 21. Nov 2014, 09:42

feinere sache das mit dem bootstrap-row. gestern noch intern diskutiert wie zu lösen, aber so genial hat keiner gedacht.

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Fri 21. Nov 2014, 11:11

nameless1 wrote:feinere sache das mit dem bootstrap-row
Wie meinst Du das genau?
Edit: Ok, hab ein update verpasst :lol:
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

User avatar
update
Moderator
Posts: 6367
Joined: Mon 10. Jan 2005, 17:29
Location: germany / outdoor

Re: ...auf dem Weg nach bootstrap city

Post by update » Tue 10. Feb 2015, 22:01

Nach einem Thread hier: http://forum.phpwcms.org/viewtopic.php? ... 5&start=15

übertrage ich die weitere (bootstrap)Diskussion mal nach hier und poste das letzte Beispiel von Oliver

Code: Select all

[LEFT]
    <div class="col-md-3">
        {LEFT}
    </div>
[/LEFT ]
    <div class="col-md-[LEFT]9[/LEFT][LEFT_ELSE]12[/LEFT_ELSE]">
        {CONTENT}
    </div>
3-9 Spalten, wenn {LEFT} befüllt ist, ansonsten 12
It's mostly all about webdesign, logo design, new and old pages refresh, print BUT slowly switching to be supporter for the band Mykket Morton. Visit Mykket Morton on FB. Listen Mykket Morton and live videos on youtube.

Post Reply