Deutschsprachiges NOF - Forum

Support und Tutorials rund um das Thema NetObjects Fusion

collapse

* Alles hat ein Ende...

Eine Weisheit der Dakota-Indianer sagt:
"Wenn Du entdeckst, dass Du ein totes Pferd reitest, steig ab!"

Vor fast fünf Jahren habe ich die NOF-Community gegründet und nachdem just zu diesem Zeitpunkt das „alte NOF-Forum“ quasi über Nacht vom Betreiber geschlossen wurde, war mein Forum für viele Nutzer von NetObjects Fusion eine willkommene Alternative.

Inzwischen sind weit über 5000 NetObjects-Nutzer in der NOF-Community registriert und täglich kommen weitere hinzu. An interessierten Mitgliedern fehlt es also nicht. Was aber fehlt, sind Mitglieder, die Lust haben, anderen Nutzern bei der Lösung ihrer vielfältigen Probleme in der Anwendung von NetObjects Fusion zu helfen. Vielleicht, weil viele von ihnen - ebenso wie ich - das Interesse an NOF verloren haben und zwischenzeitlich mit anderen Programmen arbeiten.

Aktuell ist es so, dass der Support wie die Kosten für den Betrieb der NOF-Community fast ausschließlich von mir übernommen werden. Dies, und die Tatsache, dass ich die Arbeit mit NetObjects Fusion nicht mehr für zeitgemäß halte, veranlasst mich, den aktiven Forenbetrieb zu beenden. Die Beiträge, Tipps und Anleitungen aus den letzten Jahren stehen ab heute nur noch als Nachschlagewerk zur Verfügung.

Ich bedanke mich an dieser Stelle ganz herzlich bei allen, die mich und die NOF-Community in den vergangenen Jahren unterstützt haben.

Beste Grüße nettesekel

Die letzten Beiträge

Autor Thema: jQuery Easy Accordion für NetObjects Fusion  (Gelesen 2679 mal)

0 Mitglieder und 1 Gast betrachten dieses Thema.

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
jQuery Easy Accordion für NetObjects Fusion
« am: 10. März 2013, 10:14:05 »
Kürzlich haben wir den Slider "jQuery Easy Accordion" ausgegraben und für gut befunden. In besagten Thread habe ich neulich nur eine ganz kurze Anleitung dazu gegeben, wie man den Slider in NOF einbauen kann. Nun möchte ich das Ganze nochmal für unser Tutorial-Board zusammenfassen.

Quelle: http://www.madeincima.it/en/articles/resources-and-tools/easy-accordion-plugin/

Wie der Slider ursprünglich aussieht und dass er auch in NOF funktioniert und integrierbar ist, ist hier zu sehen.

Nun habe ich mich mal ein wenig mit dem Aufbau des Sliders befasst und mein Grafikprogram parallel angeschmissen und habe festgestellt, dass man aus diesem Accordion-Slider eine ganze Menge machen kann. Natürlich waren neben der Erstellung der Grafiken auch einige Änderungen an Scripts und Code notwendig... so dass man für verschiedene Slider auch unterschiedliche Codes benötigt. Aus diesem Grund habe ich die verschiedenen Slider mal auf einer separaten Seite zusammengefasst und biete dort auch übersichtlich die jeweiligen Codes und Dateien zum Download an.

http://www.nof-academy.de/jQuery%20Easy%20Accordion%20fuer%20NetObjects%20Fusion/index.html
« Letzte Änderung: 01. April 2013, 22:13:25 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
jQuery Easy Accordion verschieden Styles für NetObjects Fusion
« Antwort #1 am: 10. März 2013, 18:51:38 »
Und so müsst ihr vorgehen...

Zuerst sucht ihr euch auf der Übersichts-Seite einen Slider-Style aus, der euch zusagt und ruft dann über den dazu gehörenden Button "Demo + Downloads" die Seite mit den Details auf.

Hier findet ihr nun funktional verschiedene Versionen des ausgewählten Sliders, zwischen denen ihr wiederum wählen müsst.
Wenn ihr euch hier nun für eine Version entschieden habt, dann ladet ihr euch zuerst die dazugehörigen Scripts und Grafiken herunter.

Nach dem Download habt ihr zwei zip-Datein welche ihr entpacken müsst. Dabei kommen die Ordner "images" und "scripts" zum Vorschein.
Die Grafiken aus dem zip-Ordner "images" müsst ihr nun in den Ordner "images" eurer lokalen Publizierung (zum offline testen) und in den gleichnamigen Ordner auf eurem Server kopieren. Der Ziel-Ordner "images" befindet sich im Ordner "assets".

Den Ordner Scripts, welcher zwei js-Dateien beinhaltet, müsst ihr ebenfalls im Ordner lokale Publizierung (zum offline testen) platzieren und natürlich auch auf eurem Server im Rootverzeichnis. (dort wo auch die Ordner "assets" und "html" sowie die "index.html" zu finden sind.

Damit wäre die Vorarbeit erledigt.
« Letzte Änderung: 12. März 2013, 13:23:52 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
jQuery Easy Accordion für NetObjects Fusion - Code platzieren
« Antwort #2 am: 10. März 2013, 22:24:20 »
Im nächsten Schritt platziert ihr den Code für euren Slider in eurem NOF-Projekt.
Zu jedem Slider findet ihr zwei Code-Boxen. Die erste Box beinhaltet den Code für das Seiten-html.
Kopiert diesen Code in eure Zwischenablage und fügt ihn dann in html der Seite ein, in welcher der Slider erscheinen soll. Soll der Slider nur auf einer Seite laufen, empfiehlt es sich, den Code ins Layout-html einzufügen, soll er auf vielen/allen Seiten laufen, ist es empfehlenswert ihn im Masterrahmen-html zu platzieren.
Die Layout-Eigenschaften ruft ihr mit der Taste F9 und die Masterrahmen-Eigenschaften mit der Taste F10 auf. In beiden Fällen wird im Anschluss der "html"- Button auf der Eigenschaftenpalette angeklickt.
Es öffnet sich ein Fenster in welchem nun zwischen die Head-Tags der kopierte Code eingefügt wird.

HINWEIS: Die relativen Pfade im Code sind darauf ausgerichtet, dass der Slider auf einer Unterseite läuft. Solltet ihr den Slider auf der Startseite laufen lassen wollen, so müssen alle im Code vorhandenen relativen Pfade um den ersten Punkt gekürzt werden.
BEISPIEL:  ../assets/images/bild.png  wird zu   ./assets/images/bild.png 
« Letzte Änderung: 12. März 2013, 13:24:19 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
Nun kopiert ihr euch den Code aus der zweiten Code-Box eures Sliders in die Zwischenablage und fügt ihn ins html eines Textfeldes ein.
Wie man Code in ein Textfeld einfügt, könnt ihr hier nachlesen: http://www.nof-community.de/index.php/topic,47.0.html

Das Textfeld platziert ihr an der Stelle, an welcher euer Slider erscheinen soll. Wenn ihr alles richtig gemacht habt, sollte nach Publizierung der Seite euer Slider zu sehen sein.
« Letzte Änderung: 12. März 2013, 13:24:55 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
An dieser Stelle möchte ich nun noch erklären, wie ihr eure eigenen Inhalte in den Slider bekommt, bzw. an welcher Stelle im Code hierzu Änderungen nötig sind.
Und auch für einige kleine optische Änderungen werde ich noch die passende Stelle im Code "verraten".

Für die Erklärung werde ich mit Codebeispielen arbeiten, in welchen ich von Sternchen umgebene Kommentare einfüge. Ausserdem werde ich mit Farbcodes arbeiten. Also eine rot gekennzeichnete Erklärung bezieht sich auf einen rot gekennzeichneten Codeabschnitt.

Eigene Überschriften, Text-Inhalte und Bilder im Code platzieren
--------------------------------------------------------------------------------------------------




Optische Anpassungen des Sliders durch Änderungen im CSS-Code
--------------------------------------------------------------------------------------------------


« Letzte Änderung: 12. März 2013, 19:57:33 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
    • Schatznasen- Der Katzenblog
  • NOF-Version: NOF 11
  • System: Windows Vista
  • System-Typ: 32bit
Re: jQuery Easy Accordion für NetObjects Fusion
« Antwort #5 am: 12. März 2013, 20:16:09 »
Viel Spaß!  (happy)

« Letzte Änderung: 20. Februar 2014, 20:37:15 von nettesekel »
Der neue Katzenblog mit vielen Tipps und Ideen für Katzenhalter.

Fragen - die inhaltlich ins Forum gehören - sind im Forum zu stellen und werden nur dort beantwortet. Anfragen dieser Art per PN bleiben unbeantwortet!


Avatar: fotolia.com  rat © Oleg Kozlov

Deutschsprachiges NOF - Forum

Support und Tutorials rund um das Thema NetObjects Fusion

 


Wenn dir dieser Artikel gefallen hat, dann empfehle ihn doch weiter... ;)