Haha, Gewohnheit inzwischen. Ich arbeite noch in nem Supportbereich, da ist alles bissel förmlicher :D
alles klar, danke.
Eine Frage hab ich jetzt allerdings noch. Wenn in meinem Layout unten so eine "Hoch- / Runter-Navigation" sein soll: Anhang 12353
Kann ich das auch mit diesem mooScroller lösen?
(Ich weiß nicht genau nach welchem Begriff ich suchen soll für so ne Navigation.)
wollte eigentlich nicht jeweils ganz nach oben, sondern immer nur auf die vorherige oder nächste Seite, aber dein Post hat mir trotzdem geholfen, denn der links für diese Navi:
Home
Team
Kochkurse
Gutscheine
Termine
Kontakt
wäre dann um beispielsweise von der "Team" Seite auf "Home" zu kommen
<a href="#home">[nbsp]</a>
und für den Link zur nächsten Seite nach "Team" ists dann:
<a href="#kochkurse">[nbsp]</a>
--> Zumindest scheint das bei mir zu funktionieren : )
EDIT: Mir fällt grad auf, dass das so bei mir nicht funktionieret, weil ich im entsprechenden Layout ja garkeinen Footer habe :(
Gäbe es auch eine #XY ansprache für vorherige Seite und nächste Seite?
Versuchs mal mit Inssertags:
http://de.contaowiki.org/Insert-Tags...ene_Inserttags
Page Inserttags sind der Weg zu entfernten Seiten, auf der gleichen Seite immer mit:
<a href="{{env::request}}#home">Ab zu Home</a>
<a href="{{env::request}}#Team">Ab zu Team</a>
(je nach dem wie die Anker im Quellcode heissen)
Hallo,
hab mal eine Frage: Wie kann man das mit der Weiterleitungsseite einen Kontaktformulars adäquat lösen. Die derzeitige Lösung ist sehr unschön weil er ja dann auf eine neue Seite springt.
Hat da jemand eine Idee ?
Hallo,
mir ist ein gravierender Fehler aufgefallen. Wenn man die Webseite das erste mal aufruft, springt beim Anklicken eines Navigationspunktes, die Seite ohne smooth scrolling an das Seitenende.
Hier die URL: projekt02.imedio.net/index.php
Danach funktioniert das Scrollen (inkl. smooth) zu den einzelen Seiten.
Naja, gravierend... da verstehe ich was anderes drunter. :D
Lass die Seite mal ohne das index.php erstellen, sieht nicht nur besser aus, funktioniert auch besser. Wenn das index.php drinbleiben soll, muss du im Navi-Template die Anker anpassen mit einem zusätzlichen {{env::request}} oder index.php.
Vielen Dank !!
Ich hatte eh in den Einstellungen index.php deaktiviert. Wenn ich die Seite nun ohne das index.php aufrufe funktioniert es bestens !!! (gravierend ist vlt. ein wenig übertrieben, hast Recht ;) )
Ich denke ich werde das Kontaktformular einfach in einen iFrame verfrachteten. Ich hätte nämlich gerne eine Bestätigung das eine eMail versendet wird.
Leider funktioniert das nicht so wie ich will mit dem iFrame, ist auch ne unsaubere Lösung. Hat jemand einen Tipp ?
Hallo,
ich habe das ganze nun anders gemacht. Ich habe das nicht mit Seiten sondern mit Artikeln gemacht, und jQuery statt mootools. Bei mir funktioniert gut und es ist ein wenig übersichtlicher.
Ja, ne POST Variable. Und dann ein Inhaltselement nur anzeigen, wenn diese gesetzt ist.
Einfach ein unsichtbares Feld 'meinVerstecktesFeld' in dein Formular mit dem Standardwert z.B. 1 :)
Dann legste Dir ein neues Text Inhaltselement zu deinem Formular an und gibst dem die Klasse invisible.
Dann kannst z.B. im getContentElement HOOK auf deine Post Variable reagieren:
if(\Input::post('meinVerstecktesFeld') >0)
und dann dem Element die Klasse entfernen invisible entfernen. Damit wird es sichtbar.
Also:
1.
ich habe nun im Kontaktform ein verstecktes Feld anglegt mit der Variable 1.
2.
Dann habe ich in dem Artikel, über dem eingebundenen Inhaltselement Formular -> Kontaktformular, ein Inhaltselement Text angelegt.
3.
In dieses Text-Inhaltselement habe ich einfach: Nachricht gesendet reingeschrieben und ihm die Klasse .cf_confirm gegeben.
4.
Per CSS blende ich nun das den Text aus mit display:none;
Aber wo kann ich die Klasse denn überschreiben, das verstehe ich nicht so ganz?
Mir fällt gerade sogar noch ne einfachere Variante ein mit der Erweiterung inputvar, die installieren.
Dein Aufbau passt. Wir nutzen das versteckte Feld aber jetzt als neue CSS Klasse ;)
Gib dem versteckten Feld mal den Standardwert: visible (das wird der Klassenname für das Inhaltselement)
- Dein Inhaltselement kann so bleiben. Als Klasse gibst du dem noch das Inserttag: {{post::meinVerstecktesFeld}}
- Mit css verstecken wir das jetzt mit diplay:none
Sobald die Post Variable existiert, wird der wert eingesetzt. Hier wäre das der Wert: visible
So haste plötzlich ne Klasse auf die du reagieren kannst und wenn das Element die Klasse hat, machste einfach display:block, wenn nicht display:none im css. Fertig :)
N’abend,
ich hab mal ’ne kurze Frage zum Events-Modul in Verbindung mit der OPW.
Muss man irgendwas besonderes beachten, damit die Events angezeigt werden?
Ich kriege es einfach nicht hin.
Danke euch!
Nein, es gibt nichts zu beachten.
Sent from my iPhone using Tapatalk
Hallo Tim,
leider hab ich mir irgendwas zerschossen im Hinblick auf die Bestätigung des Kontaktformulars. Könntest du noch mal beschreiben wie du es angelegt hast, damit nach dem Submit eine Bestätigung erscheint.
Danke
Dann würde ich doch nur wiederholen, was oben steht :)
Nutze inputvar für das Auslesen eines Verstecken Feldes mit einem Wert drin, der dir als CSS Klasse in einem Inhaltselement (Bestätigungstext) dient.
Das Inhaltselement ist standardmäßig per CSS versteckt, mit der Klasse (weil Formular gesendet), kannst Du es sichtbar schalten per CSS.
Hallo Tim,
MPstudent hatte das Thema in seinem Beitrag angesprochen und ich hatte in Beitrag #77 https://community.contao.org/de/show...l=1#post266201 auch schon danach gefragt.
Kannst Du evtl. ein Beispiel dafür geben, wie man die aktuelle Position beim Scrollen auslesen und den entsprechenden Menüpunkt als "active" setzen kann?
Muss das Ganze mit festen Höhen gelöst werden? Oder kann man einfach nur prüfen, ob ein bestimmtes Element noch im Fokus ist?
Super, vielen Dank! Hatte noch eine alte Version aus dem Contao ER.
Hallo,
ich habe eine neue Seite in der Zange, die mit [OnePageWebsite] umgesetzt wird.
Vorerst ist die Startseite noch eine Under Construction-Seite - deshalb ist sie in meiner Seitenstruktur auch die erste Unterseite Anhang 12686
Wenn ich jetzt auf MEINER STARTSEITE (wo ich im Hintergrund am werkeln bin) auf einen der onepage-nav-punkte klicke, wird jedoch nicht wie gewünscht zum Artikel-Bereich gesrollt, sondern auf die startseite gelinkt. In der URL ist allerdings am Ende die ID der Unterseite angezeigt (Beispiel: Klick auf Kontakt - leitet zu http://www.move-better.de/#kontakt)
Ich hab jetzt mal versucht die Under Construction-Seite in der Seitenstruktur auf "nicht veröffentlicht" zu stellen und dann funktioniert die onepage-nav auch so wie gewünscht.
Das Problem ist jetzt - wie erreiche ich denn jetzt meine Seite RICHTIG - ohne die Under Construction-Seite zu verlieren?
Danke
& LG
Warum machst du das nicht einfach nur mit Artikeln und jquery-smoothscroll?
im navi-modul steht die weiterleitungsseite auf "markus bremen" - welche die erste meiner seiten ist. in der hierarchie der one-page-referenz-seite.
ich hab aber auch alle möglichen anderen varianten ausprobiert u es funzt nich :(
hab ich gemacht, internen + browser-cache geleert, aber es geht leider immernoch nicht.
noch ne idee?
Sicher, dass es die Richtige Version ist? Nicht den github MASTER, den DEV Branch. Die Erweiterung wurde noch mal grundauf neugesetzt und auf Namespaces umgebaut. Die Version muss es sein.
Wenn alle Stränge reissen kann man auch das Navi Template umbauen, aber eigentlich nicht nötig, weil diese Situation ja eigentlich bekannt war.
Du hast recht - ich hab mir glaub ich den Master installiert.
Kannst du mir bitte mal den link für den dev branch geben? ich finde den nicht dort.
https://github.com/timgatzky/OnePageWebsite/tree/dev
Kannst du auch direkt auf der github Seite umstellen über dieses select wo master steht. Dort gibt es noch dev und contao2
ich hab mir das jetzt runter gezogen, auf den ftp gespielt und den cache geleert vom contao - jetzt komm ich nicht mehr in meine module rein - ich krieg nur noch ne weiße seit angezeigt :(
edit: ich hab die erweiterung nochmal deinstalliert und wieder installiert - jetzt sind die module wieder da. aber woran könnte es gelegen haben?
edit2: unabhängig davon hab ich noch ne frage: ist es möglich eine individuelle onepagewebsite-navigation zu erstellen?
Ja, seltsam.
Diese Version ist in einigen Punkten anders. Es gibt z.B. keine moo_ Templates für die Navi mehr. Das ist alles in das mod_ Navi Template gewandert. Der Grundaufbau ist auch etwas anders.
Die Navi wird durch das Referenz-Modul bestimmt. Die Seiten, die das Struktur-Modul umfasst, werden in die Navi geholt.Zitat:
individuelle onepagewebsite-navigation
Mit dem anderen Struktur Modul (Individuelle Struktur) kannst du die Seiten direkt auswählen, das wäre eine individuelle Auswahl.
Hallo,
Ich habe die Anleitungen in diesem Thread befolgt, bekomme aber leider nur eine weiße bzw. leere Seite als Ausgabe (http://5.45.106.134/area51/)
Gibts dazu irgendeine bekannte Lösungsmöglichkeit? Bin jetzt schon seit Stunden am rumklicken, bisher ohne jeglichen Erfolg.. wäre super wenn mir dabei jemand helfen könnte.
Beste Grüße
Diese Version nehmen, das ist die neueste:
https://github.com/timgatzky/OnePageWebsite/tree/dev
Funzt doch :)
Echt nicht? Ok.
Hier sah der Quellcode bereits richtig aus. http://5.45.106.134/area51/
Naja immerhin stimmt das schonmal :D Mein Problem ist jetzt nur, dass ich keine Navigation sehe.
Wenn du Zeit und Lust hast könnte ich dir auch Zugangsdaten zukommen lassen, dann kannst du dir das mal anschauen.. vielleicht hab ich ja irgendwas vollkommen falsch gemacht.
edit: ich hab's scheinbar hinbekommen.
Hallo Tim,
erstmal vielen Dank für die tolle Erweiterung!
Ich habe sie heute in Contao 2.11.6 aus dem ER installiert und es funktioniert prima! Wie in diesem Thread schon mehrmals von Benutzern angesprochen, würde ich ebenso gerne die Menüpunkte (active) beim Scrollen aktiviert bekommen. Wie du schreibst hat du die Funktion bereits in deine Erweiterung integriert.
Aber: Ist die von dir verlinke Version bei GitHub für Contao 2.11.X geeignet?
Falls nicht, welche Scripte (oder teile davon) müsste ich aktualisieren, damit beim manuellen Scrollen die Menüpunkte automatisch "active" angezeigt werden?
Danke und viele Grüße,
Andreas
Hallo,
ich kam jetzt gut zurecht mit allem - alles hat gepasst, dann dachte ich mir, dass ich doch mal die individuelle navigation von der onepagewebseite ausprobiere u seither stimmt irgendwas nicht..
ich hab alles jetzt 2 stunden lang mit einer anderen contao-seite die ich auch mit der gleichen erweiterung erstellt habe verglichen u konnte nichts feststellen, bis auf eine sache.
die "Anzeigen in" Anzeige meines Hauptartikels ist sehr ungewöhnlich..
Anhang 12862
Normal steht dahinter immer [Hauptartikel] - was auch korrekt wäre für den Ausgabeort des jeweiligen Artikels, aber hier steht bei "MARKUS BREMEN" dahinter [0]
WAS SAGT MIR DAS??? DAS HAB ICH NOCH NIE GESEHEN... :(
Das ist nen Contao bug, der in 3.2.4 behoben wurde.
also muss ich mir den core runterladen u drüber installieren?
aber dann ist doch meine bisher erstellte seite weg oder?
in 2 wochen ist der online termin... :eek:
ich hab die von dir besagte version 3.2.3 drauf..
hab den neuen core runtergezogen - mache n backup - u schmeiß den neuen krempel drüber.
ps: danke für die off-topischen infos! ohne dich wär ich jetzt echt verzweifelt - ich dachte schon meine datenbank wäre zerschossen! ; )
edit//
ich hab mich getraut u jetzt läuft alles wieder wie es soll: geilo!
Hallo,
habe im Topic für das mmenu gefragt, ob das zusammen mit der onepagewebsite-erweiterung laufen würde u hab die antwort bekommen, dass das auf keinen fall zusammen laufen kann! hat da jemand eine andere meinung u wenn ja, wie setze ichs um?
DANKE
Alles ist umsetzbar. Man muss ja für eine mobile Navi auch nicht auf eine Erw. zurückgreifen
Hast Du denn einen Tipp welches Mobile-Menü sich eignen würde - für eine die in Javascript nicht mal ihren eigenen namen schreiben kann? ;)
Aber die sind eigentlich alle gleich.. ne? habs schon mit dem ursprung der mmenü-erweiterung versucht - dem mmenu - leider erfolglos. da das meien erste mobilnavi wird, hab ich da noch garkein plan - u auf viele varianten stoße ich nicht beim googeln.
hello,
ich bin jetzt an der optimierung :)
ich soll das kleine css aus dem verzeichnis OnePageWebsite/assets/css/onepagewebsite.css als inline css einfügen.
wie mach ich das denn, ohne dass die erweiterung damit probleme bekommt und nix mehr lesen kann?
lg
gestern hab ich meine seite optimieren wollen und bei gtmetrix kam u.a. die errormeldung, dass vom stylesheet nicht auf diese css datei zugegriffen werden könnte.
ich hab das problem gegoogelt und das hier gefunden und den rat darunter befolgt.
irgendwas möchte also darauf zugreifen - einfach löschen würde mir da ja nix bringen oder? was mach ich denn jetzt?
edit//
ja, das sind nur 4 zeilen oder so in dieser css. das styling hab ich sonst ganz normal in meinem haupt-css-stylesheet gemacht.
Das scheint schon ne rechte alte Version zu sein, die Du da hast.
Das mit der htaccess stimmt, wenn Du die in dem html Ordner ergänzt, hat Contao wieder Rechte für die Datei.
Löschen bringt nichts, das stimmt. Die Datei wird hardcodiert eingebunden.
alt...? also weiter vorne im thread (14.01.) poste ich das 1. mal das ich mit der neuen seite die erweiterung verwende. also hab ich die erweiterung höchstens ein paar tage vorher installiert. wahrscheinlich direkt aus der erweiterungsliste im backend... das müsste doch dann die aktuellste sein oder nicht?
das letzte mal als ich versucht hab die neue version von dir runterzuladen und drüber zu installieren hatte ich nen weißen bildschirm - die seite muss damit morgen online gehen - da hab ich jetzt n bischen schiss mir was abzuschießen auf die letzten meter. was (irgendwas, was absolut safe is : ) soll ich n jetzt machen?
Die Version im ER ist schon recht alt, aber funktional. Die Erweiterung wurde inzwischen für Contao 3 optimiert.
Ich verstehe nicht genau wo das Problem ist. Maximal hat man eine Fehlermeldung bei Firebug das eine CSS Datei fehlt. Das sieht der Normalo-User eh nicht. :) Oder Du ergänzt einfach wie beschrieben die htaccess Datei.
Generell, deine eigenen Styles haben doch gar nichts mit der Erweiterung zu tun, solange diese korrekt funktioniert. Also einfach drauf los und stylen :)
Die jeweils neusten Versionen sind im GitHub. Die allerneusten dort in dev branch.
das inline css war nur ein teil des hauptproblems.. und das ist das ergebnis für "mobile" bei google page speed ..
das mit dem inline css ist wie du siehst nur einer von vier punkten , die er mir hier anmeckert.
hab versucht das mit dem yui compressor zu komprimieren, aber selbst bei der wiedereinbindung des css hab ich n bischen mehr als ne verschobene ansicht..Zitat:
Entfernen Sie JavaScript, das das Rendering blockiert:
http://ajax.googleapis.com/…ootools/...-compressed.js
http://www.move-better.de/assets/js/88622110d1e0.js
Optimieren Sie die CSS-Darstellung für die folgenden URLs:
http://www.move-better.de/…ageWebsit...agewebsite.css
http://www.move-better.de/assets/css/fce97ba40a7e.css
und wie ich diese javascripts entfernen sollen, die das rendering blockieren weiß ich auch nicht..
hast du evtl. nen tipp dafür? bzw. kann ICH da überhaupt was machen? ich kann doch eigentlich garnicht beeinflussen wann das script geladen wird?
Ab gesehen von der onepage css. Das andere sind Contao scripte, mootools etc, und contao css Sachen. Das kannst Du vergessen.
Nummer eins für eine Webseite sollte die Usability und die korrekte Darstellung sein, nicht google page speed. Feintuning ok, aber es darf die Entwicklung nicht bremsen.
Alles klar - danke Dir für Deinen Allround-Support ; )
Hi,
ich möchte diese Erweiterung auch für eine Webseite nutzen. Damit ich das Setzen der 'active'-Klasse in der Navi nutzen kann, habe ich mir den aktuellen dev-Branch gezogen und installiert. Die Erweiterung funktioniert super, inklusive Smooth-Scrolling und dem Setzen der Klasse.
Nun habe ich folgende Frage:
Ich würde gerne die einzelnen 'page' Elemente nicht in einer Liste, sondern in divs haben. Dafür habe ich das Template opw_default.html5 nach meinen Bedürfnissen geändert. Damit das Setzen der 'active'-Klasse erhalten bleibt, muss ich dann ja auch Template 'mod_onepagewebsitenavigation.html5' anpassen. Leider habe ich keine JS-Kenntnisse, so dass ich nicht weiß, ob ich da einfach im Code alle li durch div ersetzen kann...
Wie muss ich das Template denn anpassen?
Danke und Gruß
Mathias
Hi,
wenn du das Temple geändert hast auf divs, einfach die Aufrufe für li im Javascript auf div setzen. :)
Tim
Hi,
Danke für Deine Antwort.
Aber nicht alle, oder? Wenn ich alle li im Javascript durch div ersetze, dann geht es nicht. Ich nehme an, ich muss das nur an einigen Stellen im Script machen. Aber an welchen?
Gruß
Mathias
Eigentlich muss man an der Navi nichts ändern. Der Navi ist egal ob die OPW Struktur mit divs oder anders gebaut wird.
Das Script bezieht sich nur aus das Navigationselement und das reagiert auf den Anker in der URL. Solange die Navi aus einer unsorted list aufgebaut wird, sollte alles passen.
Hi,
ich glaube, ich stelle mich da etwas doof an. Wie gesagt, ich kann überhaupt kein Javascript... :o
An der Navigation selber habe ich nichts geändert.
Im Template 'mod_onepagewebsitenavigation.html5' finde ich das JS. Oder ist das Script woanders?Zitat:
wenn du das Temple geändert hast auf divs, einfach die Aufrufe für li im Javascript auf div setzen.
Wenn ich hier alle 'li' gegen 'div' tausche, dann funktioniert es nicht bei mir.Code:<script type="text/javascript">
/* <![CDATA[ */
/**
* Toggle active state for OnePageWebsite Navigation module
*/
window.addEvent('domready', function()
{
var objNavi = $('<?php echo $this->naviID; ?>');
// examine url params for hash params
var strHash = window.location.hash;
var arrHash = strHash.split("#");
var arrParamsIgnore = new Array('top');
var params = new Array();
for(var i=0; i<arrHash.length; ++i)
{
if(arrHash[i].length > 0)
{
var hash = arrHash[i].replace('#','');
if(!arrParamsIgnore.contains(hash))
{
params.push(arrHash[i]);
}
}
}
var last = null;
// circle through all navigation elements
// get all possible buttons
var objAnchors = objNavi.getElements('li > a');
// set state on load
objAnchors.each(function(anchor)
{
var href = '/'+anchor.get('href');
href = href.replace(location.pathname,'');
href = href.replace('#', '');
// anchor is set
if(params.contains(href))
{
anchor.addClass('active');
anchor.getParent('li').addClass('active');
last = anchor;
}
});
// set first button to active when on first page of website and no anchor is set
var strRequest = '<?php echo $this->replaceInsertTags('{{env::request}}') ?>';
if(location.hash.length == 0 && strRequest.length == 0)
{
objAnchors[0].addClass('active');
objAnchors[0].getParent('li').addClass('active');
last = objAnchors[0];
}
// add eventhandlers
objAnchors.addEvent('click',function()
{
if(last)
{
last.removeClass('active');
last.getParent('li').removeClass('active');
}
// get anchor
var href = this.get('href');
href = href.replace('#', '');
this.addClass('active');
this.getParent('li').addClass('active');
last = this;
});
});
/* ]]> */
</script>
<?php if($this->opw_scrolldetection): ?>
<script type="text/javascript">
/* <![CDATA[ */
/**
* Set navi active on scroll
*/
window.addEvent('scroll', function()
{
var objNavi = $('<?php echo $this->naviID; ?>');
var last = null;
var objNaviElements = objNavi.getElements('li'); //$$('.mod_onepagewebsitenavigation li');
var objPages = $$('.mod_onepagewebsiteregular li');
if(objPages.length < 1)
{
objPages = $$('.mod_onepagewebsitecustom li');
}
if(objNaviElements.length < 1 || objPages.length < 1)
{
return;
}
var objRelativeTo = document.window;
var objPosRelative = objRelativeTo.getPosition();
var objScroll = objRelativeTo.getScroll()
var objSizeWindow = new Object;
objSizeWindow.x = window.innerWidth;
objSizeWindow.y = window.innerHeight;
var intOffsetX = 0; // move the X break point further left or right
var intOffsetY = 0; // move the Y break point higher or lower
objPages.each(function(elem, index)
{
var pos = elem.getPosition();
var size = elem.getSize();
var breakPointX = (objPosRelative.x + intOffsetX);
var breakPointY = (objPosRelative.y + intOffsetY);
if(objRelativeTo != document.window || objRelativeTo != window)
{
pos = elem.getPosition(objRelativeTo);
}
var deltaX = (pos.x - objScroll.x);
var deltaY = (pos.y - objScroll.y);
// vertical scrolling
if(deltaY <= breakPointY)
{
objNaviElements.removeClass('active');
objNaviElements.getElement('a').removeClass('active');
if(objNaviElements[index])
{
objNaviElements[index].addClass('active');
objNaviElements[index].getElement('a').addClass('active');
last = objNaviElements[index];
}
else
{
last.addClass('active');
last.getElement('a').addClass('active');
}
}
// horizontal scrolling
if(deltaX <= breakPointX)
{
objNaviElements.removeClass('active');
objNaviElements.getElement('a').removeClass('active');
if(objNaviElements[index])
{
objNaviElements[index].addClass('active');
objNaviElements[index].getElement('a').addClass('active');
last = objNaviElements[index];
}
else
{
last.addClass('active');
last.getElement('a').addClass('active');
}
}
});
});
/* ]]> */
</script>
Sorry für den Aufwand.
Danke und Gruß
Mathias
Du musst an dem Script nichts ändern. Auch keine li in div ändern. Das Script bezieht sich auf die HTML Ausgabe des Navigations-Moduls. Solange du das navi template nicht in divs änderst, brauchst du an das JS nicht ran.
Aber wenn ich nichts ändere, dann geht es auch nicht... :eek:
Wie gesagt, mit den Original-Templates geht es. Ich möchte aber das 'opw_default.html5' ändern. Wenn ich das mache, dann wird die 'active'-Klasse in der Navi nicht mehr geändert...
Hier ist mal der Link zu der Seite
www.hamsta.eu
Gruß
Mathias