Für Nerds: Onepage + jQuery + Bootstrap

Ein CMSimple Support Forum für deutsch sprechende Nutzer und Entwickler
lck
Posts: 1322
Joined: Wed Mar 23, 2011 11:43 am
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by lck » Wed Nov 16, 2016 9:00 pm

graf_ikea wrote:aber die 2 pfeile unten gehören nicht zum slider ... da muss noch was sein ... und bei mouse over sind die pfeile auch komisch ...
EDIT:
Ursache in der stylesheet.css

Code: Select all

main ul li:before, footer ul li:before {
    content: "\f054";
    color: inherit;
    font: 0.75em/normal FontAwesome;
    color: #666;
    padding: 0 .5em 0 0;
    margin: 0 0 0 -1em;
} 
Um den Flexslider auf die ganze Fensterbreite zu bringen, kannst du folgendes versuchen:
Füge am Ende deiner Template stylesheet.css hinzu:

Code: Select all

.flexslider {
    width: 146%; /* !important (wenn nötig) */
    left: -23%; /* !important (wenn nötig) */
}
Last edited by lck on Wed Nov 16, 2016 9:10 pm, edited 2 times in total.
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“   👉 Ludwig's XH-Templates for MultiPage & OnePage

frase
Posts: 2159
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by frase » Wed Nov 16, 2016 9:02 pm

Versuche mal die 2. CSS wegzubekommen.
In template.htm Zeile 56 auskommentieren, so:

Code: Select all

<!--<link rel="stylesheet" href="<?php echo $pth['folder']['template']?>css/flexslider.css">-->
Danach schauen, ob sich irgendwo etwas verbessert oder verschlechtert(!) hat.

frase
Posts: 2159
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by frase » Wed Nov 16, 2016 9:36 pm

So.
Ich habe es jetzt mal auf deiner Seite direkt gemacht.
template.htm geändert
stylesheet.css geändert

Wenn du weiter daran arbeitest, lade bitte zuerst diese beiden Dateien runter.
Wie bekommt man nun noch die Texte unter den Pfeilen weg?

frase
Posts: 2159
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by frase » Wed Nov 16, 2016 9:43 pm

Falls du oben dein Logo noch etwas weiter oben haben willst:
In stylesheet.css Zeile 311:

Code: Select all

#header .logo {
    float: left;
    margin-top: -15px;
}
Das habe ich nicht direkt gemacht, weil ich nicht weiß, ob du das willst.

graf_ikea
Posts: 117
Joined: Tue May 07, 2013 11:16 am

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by graf_ikea » Thu Nov 17, 2016 8:52 am

cool ... vielen dank für deine Hilfe ... :D

das logo kann so bleiben ... lockert bisschen auf ... den rest teste ich noch ... mit der breite ...

Danke ...

frase
Posts: 2159
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by frase » Thu Nov 17, 2016 8:55 am

Zu den Texten unter den Pfeilen:
Mich wundert etwas. In meiner Testinstallation mit Flexslider sieht der Link für das vorherige Bild so aus:

Code: Select all

<li class="flex-nav-prev">
<a class="flex-prev" href="#"></a>
</li>
Bei dir sieht er aber so aus:

Code: Select all

<li class="flex-nav-prev">
<a class="flex-prev" href="#">Previous</a>
</li>
Hast du da irgendetwas geändert?
Woher kommen die Link-Texte?

frase
Posts: 2159
Joined: Thu Apr 21, 2016 6:32 am
Location: Saxony
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by frase » Thu Nov 17, 2016 9:06 am

graf_ikea wrote:den rest teste ich noch ... mit der breite ...
Das wird ziemlich schwierig.
Der Inhalt einer Seite (Was, Wie, ...) befindet sich in einem <article> und einem <div class="container">.
Der container hat wiederum eine von Bootstrap berechnete Breite.
Alles darunter <h2> ... passt sich daran an.
Bei Home und Galerie habe ich per jQuery <div class="container"> ausgetauscht mit <div class="container-fluid no-padding">, damit die gesamte Breite genutzt wird (Bootstrap).
Wenn du den Flexslider über die volle Breite haben willst, musst du den auf eine Extra-Seite stellen und per jQuery ebenso behandeln.

graf_ikea
Posts: 117
Joined: Tue May 07, 2013 11:16 am

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by graf_ikea » Thu Nov 17, 2016 9:14 am

das muss ja nicht sein ... das ist so bestimmt besser ... eine L-page mit 100% und slider im content mit der breite des contents ... so ist es ein gutes layout ...

an dem text "Previous" habe ich nichts gemacht ... kenne aber den flexslider XH auch nur ohne den text ... holt der sich diesen text vom anderen slider ? ansonsten ist das ja nicht so schlimm ...

lck
Posts: 1322
Joined: Wed Mar 23, 2011 11:43 am
Contact:

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by lck » Thu Nov 17, 2016 12:34 pm

frase wrote:Zu den Texten unter den Pfeilen:
Mich wundert etwas. In meiner Testinstallation mit Flexslider sieht der Link für das vorherige Bild so aus:

Code: Select all

<li class="flex-nav-prev">
<a class="flex-prev" href="#"></a>
</li>
Bei dir sieht er aber so aus:

Code: Select all

<li class="flex-nav-prev">
<a class="flex-prev" href="#">Previous</a>
</li>
Hast du da irgendetwas geändert?
Woher kommen die Link-Texte?
Durch die Installation von Flexslider_XH gibt es nun 2 jquery.flexslider-min.js -Dateien und das verträgt sich anscheinend nicht. Also am besten nur einen Slider verwenden.
Einmal in ./templates/fhs-op2/js/jquery.flexslider-min.js und in ./plugins/flexslider/js/jquery.flexslider-min.js

Darin sind die Texte zu finden:
jquery.flexslider-min.js
(...prevText:"Previous",nextText:"Next",...)
„Bevor du den Pfeil der Wahrheit abschießt, tauche die Spitze in Honig!“   👉 Ludwig's XH-Templates for MultiPage & OnePage

graf_ikea
Posts: 117
Joined: Tue May 07, 2013 11:16 am

Re: Für Nerds: Onepage + jQuery + Bootstrap

Post by graf_ikea » Thu Nov 17, 2016 12:43 pm

Darin sind die Texte zu finden:
jquery.flexslider-min.js
(...prevText:"Previous",nextText:"Next",...)
Hab die einfach gelöscht - jetzt sind se weg :-)

Danke ...

Post Reply