Deutschsprachiges NOF - Forum

Support und Tutorials rund um das Thema NetObjects Fusion

collapse

* Wichtige Mitglieder-Information

Da immer noch Mails verwunderter "Mitglieder" bei mir ankommen, weil Login und Registrierung nicht funktionieren... das Forum ist seit geraumer Zeit geschlossen und steht ausschließlich als Nachschlagewerk zur Verfügung. Einerseits bin ich froh, diesen Schritt gewagt zu haben... auf der anderen Seite... wenn ich hier manchmal so lese... es war doch "'ne geile Zeit" mit euch! Macht's gut!

Beste Grüße nettesekel

* Friendship

DER Katzenblog – mit tollen Tipps und Ideen für deine Katze(n) <3

Die letzten Beiträge

Autor Thema: Durchgehender Footer aus Fusion 2013  (Gelesen 2856 mal)

0 Mitglieder und 1 Gast betrachten dieses Thema.

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Durchgehender Footer aus Fusion 2013
« am: 31. Mai 2013, 12:09:03 »
In vielen der neuen Vorlagen für NOF2013 ist ein durchgehender Footer zu sehen. Wie dieser realisiert wurde möchte ich in folgendem kleinen Tutorial kurz erläutern, damit jeder in der Lage ist, diese Lösung auch für eigene Projekte zu nutzen.

« Letzte Änderung: 09. Juni 2013, 09:32:21 von nettesekel »

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Re: Durchgehender Footer aus Fusion 2013
« Antwort #1 am: 08. Juni 2013, 20:02:03 »
Im ersten Schritt kopiert ihr euch folgenden Code...

Code: HTML5
  1. #footer {
  2. float:left;
  3. position:absolute;
  4. left:0;
  5. width:100%;
  6. height:198px;   /* Höhe bitte anpassen */
  7. }
  8.  
  9.  
  10. #footerContent {
  11. position:absolute;
  12. left:50%;
  13. width:990px;   /* Breite des Layouts */
  14. margin-left:-495px; /* Hälfte der Layoutbreite */
  15. }

...und fügt ihn im Design unter dem Reiter CSS ein. Die ggf. nötigen Änderungen entnehmt ihr bitte den /*Kommentaren*/  im CSS-Code.




« Letzte Änderung: 09. Juni 2013, 09:40:39 von nettesekel »

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Re: Durchgehender Footer aus Fusion 2013
« Antwort #2 am: 09. Juni 2013, 09:38:00 »
In der Seitenansicht zieht ihr nun (am besten im unteren Masterrahmen) einen neuen Layoutbereich auf. Klickt dazu auf das markierte Icon in der Symboleiste und zieht im Anschluss den Layoutbereich an der gewünschten Stelle in eurem Layout auf. Gebt ihm in etwa die selbe Breite, wie dem Rest eurer Inhalte.


« Letzte Änderung: 09. Juni 2013, 09:44:20 von nettesekel »

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Re: Durchgehender Footer aus Fusion 2013
« Antwort #3 am: 09. Juni 2013, 09:43:08 »
Markiert den Layoutbereich mit einem einfachen Klick und ruft den zweiten Reiter der entsprechenden Eigenschaftenpalette auf.
Hier könnt ihr festlegen, welche Farbe euer Footer haben soll und ob ggf. ein Hintergrundbild verwendet werden soll.



Im Anschluss markiert ihr Reiter 3 der Eigenschaftenpalette und gebt dem Layoutbereich dort die ID "footer".  Die Schreibweise muss identisch mit der im CSS-Code sein, welchen wir anfangs im Design platziert haben.


« Letzte Änderung: 09. Juni 2013, 09:46:56 von nettesekel »

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Re: Durchgehender Footer aus Fusion 2013
« Antwort #4 am: 09. Juni 2013, 09:50:00 »
Nun zieht ihr einen weiten Layoutbereich auf und platziert diesen auf dem zuerst eingefügten Layoutbereich. Auf diesem Layoutbereich bringt ihr die Inhalte untre, die in eurem Footer erscheinen sollen.

Markiert auch diesen Layoutbereich mit einem einfachen Klick, aktiviert wieder Reiter 3 der EP und vergebt für diesen Layoutbereich die ID "footerContent".
Achtet auch hier wieder auf die Schreibweise.


« Letzte Änderung: 09. Juni 2013, 10:25:30 von nettesekel »

Offline nettesekel

  • Administrator
  • *****
  • Beiträge: 8181
Re: Durchgehender Footer aus Fusion 2013
« Antwort #5 am: 09. Juni 2013, 09:53:47 »
Das war auch schon die ganze Kunst. Viel Spaß und Erfolg bei der Umsetzung.  :)

-----------------------------------------------------------------------------------------------------

Eine weitere Lösung für den durchgehenden Footer findet ihr hier... www.nof-community.de/index.php/topic,440.0.html  Vorteil dieser Lösung ist, dass der Footer immer am unteren Bildschirrand fixiert ist, selbst bei Seiten die keinen oder wenig Inhalt haben. Nachteil ist, dass Inhalte nur durch Einfügungen im Code eingebunden werden können und nicht einfach in der Arbeitsansicht.

« Letzte Änderung: 20. Juli 2014, 19:26:07 von nettesekel »

Deutschsprachiges NOF - Forum

Support und Tutorials rund um das Thema NetObjects Fusion