Inhalt in CSS Homepages

Dieses Thema im Forum "Webentwicklung" wurde erstellt von Halloweenracer, 29. Oktober 2008 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 29. Oktober 2008
    Zuletzt von einem Moderator bearbeitet: 14. April 2017
    Hallo,

    ich habe mir so ne tolle Vorlage geladen. Habe die mal in den Anhang gepackt. Wie kann ich es denn anstellen, dass das Grundgerüst immer erhalten bleibt und NUR der Inhalt in der Mitte sich ändert, wenn ich links auf einen Link klicke?

    Kann mir da jmd nen Tipp dazu geben? Kenne mich damit nicht so aus und würde gerne mich reinarbeiten

    Mfg Halloweenracer

    No File | xup.in
     
  2. 29. Oktober 2008
    AW: Inhalt in CSS Homepages

    SELFHTML 8.1.2 (HTML-Dateien selbst erstellen)
     
  3. 29. Oktober 2008
    AW: Inhalt in CSS Homepages

    Ganz treu nach dem Motto: "Friss oder stirb"

    Trotzdem danke für den Link...

    Mfg Halloweenracer
     
  4. 29. Oktober 2008
    AW: Inhalt in CSS Homepages

    Ich bin auch gerade dabei mich da einzuarbeiten.
    Du hast ja den images ordner, eine html datei und eine style datei. Eben alles as was du nach dem slicen hast.

    Diese html datei kannst du nun in einem html editor (zb Dreamweaver) bearbeiten. Das layout ist mit div containern in sektions eingeteilt.
    Wenn du html kannst, dann kannst du dir das Design, die links etc. hier individuel anpassen.

    Vielleicht kann ja noch einer antworten, der ein bisschen mehr ahnung von der Materie hat. Bin auch interessiert an der beantwortung seiner Frage.

    EDIT: Ich denke, dass wenn man zb einen Button bearbeitet und ihm einen link auf einer unterseite zuweist. Diese Seite soll jedoch nur in einem bestimmten Bereich (Mitte) angezeigt werden. Dann muss man wohl mit frames arbeiten oder?
     
  5. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <!--
    Design by Free CSS Templates
    http://www.freecsstemplates.org
    Released for free under a Creative Commons Attribution 2.5 License
    
    Name : Economics
    Description: A two-column, fixed-width template suitable for business sites and blogs.
    Version : 1.0
    Released : 20080116
    
    -->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Economics by Free CSS Templates</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link href="style.css" rel="stylesheet" type="text/css" media="screen" />
    </head>
    <body>
    <div id="header">
     <div id="logo">
     <h1><a href="#">Economics</a></h1>
     <h2>Template Design By Free CSS Templates</h2>
     </div>
     <div id="splash"></div>
     <div id="menu">
     <ul>
     <li class="current_page_item"><a href="#" accesskey="1" title="">Home</a></li>
     <li><a href="#" accesskey="2" title="">Articles</a></li>
     <li><a href="#" accesskey="3" title="">Blogs</a></li>
     <li><a href="#" accesskey="4" title="">About Us</a></li>
     <li><a href="#" accesskey="5" title="">Contacts</a></li>
     <li><a href="#" accesskey="6" title="">RSS</a></li>
     </ul>
     </div>
    </div>
    <hr />
    <!-- start page -->
    <div id="wrapper">
    <div id="page">
     <!-- start content -->
     [color=red]<div id="content">
     <div class="post">
     <h2 class="title"><a href="#">Welcome to Economics</a></h2>
     <div class="entry">
     <p> This is <strong>Economics</strong>, a free, fully standards-compliant CSS template designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>. The photos in this design are from <a href="http://www.pdphoto.org/">PDPhoto.org</a>.</p>
     <p>This free template is released under a <a href="#">Creative Commons Attributions 2.5</a> license, so you’re pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it :) This design is also available as a <a href="http://www.freewpthemes.net/preview/Economics/">WordPress theme</a> at <a href="http://www.freewpthemes.net/">Free Wordpress Themes</a>.</p>
     </div>
     <p class="meta">Posted on November 5, 2007 by <a href="#">Someone</a> &nbsp;|&nbsp; <a href="#">32 comments</a></p>
     </div>
     <div class="post">
     <h2 class="title"><a href="#">Blandit volutpat consequat</a></h2>
     <div class="entry">
     <p>Proin nec magna. Proin nec massa sit amet purus congue molestie. Aliquam erat volutpat. Nulla pellentesque dolor non tellus. Duis vel elit sit amet ipsum vehicula varius. Vestibulum ante ipsum primis in <a href="#">faucibus orci luctus et ultrices</a> posuere cubilia Curae; Suspendisse rhoncus. Nunc est. Praesent interdum lectus quis neque. Aliquam eros. Nulla fermentum dolor eget mi. Cras diam sapien, auctor non, malesuada at, tristique id, dui. Aenean congue ante. </p>
     <h3>Prom nec magna tempus lorem ipsum dolor</h3>
     <p>Proin nec magna. Proin nec massa sit amet purus congue molestie. Aliquam erat volutpat. Nulla pellentesque dolor non tellus. Duis vel elit sit amet <a href="#">ipsum vehicula varius</a>. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae.</p>
     </div>
     <p class="meta">Posted on November 5, 2007 by <a href="#">Someone</a> &nbsp;|&nbsp; <a href="#">32 comments</a></p>
     </div>
     </div>[/color]
     <!-- end content -->
     <!-- start sidebar -->
     <div id="sidebar">
     <ul>
     <li>
     <h2>Categories</h2>
     <ul>
     <li><a href="#">Aliquam libero</a></li>
     <li><a href="#">Consectetuer elit</a></li>
     <li><a href="#">Metus pellentesque</a></li>
     <li><a href="#">Suspendisse mauris</a></li>
     <li><a href="#">Urnanet molestie semper</a></li>
     <li><a href="#">Proin orci porttitor</a></li>
     </ul>
     </li>
     <li>
     <h2>Archives</h2>
     <ul>
     <li><a href="#">September</a> (23)</li>
     <li><a href="#">August</a> (31)</li>
     <li><a href="#">July</a> (31)</li>
     <li><a href="#">June</a> (30)</li>
     <li><a href="#">May</a> (31)</li>
     </ul>
     </li>
     <li>
     <h2>Lorem ipsum dolor </h2>
     <ul>
     <li><a href="#">Aliquam libero</a></li>
     <li><a href="#">Consectetuer elit</a></li>
     <li><a href="#">Metus pellentesque</a></li>
     <li><a href="#">Suspendisse mauris</a></li>
     <li><a href="#">Urnanet molestie semper</a></li>
     <li><a href="#">Proin orci porttitor</a></li>
     </ul>
     </li>
     </ul>
     </div>
     <!-- end sidebar -->
     <div style="clear: both;">&nbsp;</div>
    </div>
    </div><!-- end page -->
    <div id="footer">
     <p class="legal">Copyright (c) 2007 Website Name. All rights reserved.</p>
     <p class="credit">Designed by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
    </div>
    </body>
    </html>
    

    Steht ja eigentlich da
    Also mit "start & end content"

    Der Bereich in rot ist der Bereich den du suchst!


    So, jetzt nimmst du einfach den Teil in der Div Box mit der id "content" und schreibst das rein was auf der Seite stehen soll...
    änderst den Namen der Datei dann von index.html auf zB home.html (je nach dem was im content eben stehen soll) und verlinkst in der navi den button "home" mit der datei "home.html"...un so

    Oder du löscht den Inhalt der Content Div Box komplett raus und includest mit einem einfachen php befehl die passende "content".html datei in diese content div box...

    Hoffe ich konnte dir helfen
     
  6. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Hey,

    danke euch. Also HTML kann ich ja. PHP sollte auch noch im Bereich des machbaren sein. Also wenn ich die Datei kopiere und dann per Links auf die neue Datei verlinke, dann läd sich ja immer die die ganze Menüstruktur wieder neu. Und da dachte ich, dass man das umgehen kann. Z.B. wenn man eben den "content div" als ne Art Frame benutzen kann, wo man dann per Linklick nur ne andere Datei angiebt, die für den Inhalt dort sorgt.

    Nur da weiß ich nicht, wie ich das umsetzen kann

    Mfg Halloweenracer
     
  7. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Du kannst z.B. nen iframe benutzen und den Inhalt immer nur da rein laden.
    Du könntest aber auch im content div ein switch (php) einbauen und die einzelnen Seiten immer mit IDs aufrufen ...
    Code:
    switch($id)
     {
     case "1":
     include("page1.php");
     break;
     case "2":
     include("page2.php");
     break;
     default:
     include("home.php");
     break;
     }
    Die Links würden dann so aussehen: index.php?id=2
    Aber da dürfte theoretisch auch alles neu geladen werden, nur kann es manchmal so wirken, als ob nur der Content neu geladen wird.
    Könntest aber auch nen CMS wie TYPO3 benutzen, das speichert die Seite im Cache.
     
  8. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Ich würd dir aber aufjedenfall von frames abraten...
    Das nervt uns User einfach nur!
    Angenommen du rufst nun über eine Domain eine Frame Seite auf...http://www.blaframe.de.
    So, dann wird die Seite geladen und der dazugehörige Contentframe. Klickst du jetzt auf zB news wird zwar der newscontent geladen, jedoch verändert sich die domain nicht und heißt immernoch http://www.blaframe.de anstatt bequemer zB http://www.blaframe.de/news oder /news.php oder http://www.blaframe.de/index.php?id=news...
    Zudem, wenn du es mit frames umsetzt wird es sehr schwer in der navi den derzeitigen Menüpunkt zu makieren, einfach um den User bissl zu verklickern wo er sich zur Zeit rumtreibt!
    Frames sind einfach nichtmehr zeitgerecht! Und das bisschen was jedesmal mitgeladen wird (Banner, navi,...) ist so gut wie nichts
     
  9. 30. Oktober 2008
    AW: Inhalt in CSS Homepages


    Und wie setzt man es dann um? Vielleicht nach dem Beispiel von Hapablap?
     
  10. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Mit einem Array!
    PHP:
    $id  = array(
         
    "news"  =>  "include 'news.html';" ,
         
    "home"  =>  "include 'home.html';" ,
         
    "blog"  =>  "include 'blog.html';" ,
         ...)
    if (isset(
    $_GET [ "id" ])) {
         echo 
    $id [( $_GET [ "id" ])];
    } else {
         echo 
    'Diese Seite existiert nicht!' ;
    }
    Dann einfach die Links in der Navi mit index.php?id=news (etc.) verlinken!
    Dann wird der "id-wert" in der URl überprüft und das passende ausgegeben
    Hoffe das ist verständlich...

    Edit: Was ich vergessen habe: In den jeweiligen Dateien (news.html, blog.html, home.html, etc) steht nur der "Content inhalt"!
     
  11. 30. Oktober 2008
    AW: Inhalt in CSS Homepages

    Hallo,

    ihr seid echt super. Nun werde ich mir das zusammenbasteln Echt toll

    Nur ich habe das Problem, dass dann in dem Teil der Seite nur folgendes steht:

    Also nicht der Inhalt in der news.php

    Hier mal der Code:


    Code:
    <li><a href="index.php?id=news">news</a></li>
     <li><a href="index.php?id=home">home</a></li>
    PHP:
    <?
    $id  = array(
           
    "news"  =>  "include 'news.php';" ,
           
    "home"  =>  "include 'home.php';" );
         
    if (isset(
    $_GET [ "id" ])) {
     echo 
    $id [( $_GET [ "id" ])];
    } else {
       echo 
    'Diese Seite existiert nicht!' ;
      }
    ?>
     
  12. 31. Oktober 2008
    AW: Inhalt in CSS Homepages

    Das ganze eben noch als php befehl:

    PHP:
    <?
    $id  = array(
           
    "news"  =>  "<?php include 'news.php'; ?>" ,
           
    "home"  =>  "<?php include 'home.php'; ?>" );
         
    if (isset(
    $_GET [ "id" ])) {
    echo 
    $id [( $_GET [ "id" ])];
    } else {
       echo 
    'Diese Seite existiert nicht!' ;
      }
    ?>
     
  13. 31. Oktober 2008
    AW: Inhalt in CSS Homepages

    huhu,

    auf die idee bin ich bereits gekommen... nur leider wird dann nichts dargestellt... auch wenn ich da noch nen echo $inhalt; mit einfüge kommt nichts...

    Mfg Halloweenracer
     
  14. 31. Oktober 2008
    AW: Inhalt in CSS Homepages

    joa sehr sinnvoll innerhalb eines php-scripts php-code auszugeben.

    PHP:
    <? php
        $id 
    = array(
            
    'news'  =>  'news.php' ,
            
    'home'  =>  'home.php'
        
    );

        if(!empty(
    $_GET [ 'id' ]) && isset( $id [ $_GET [ 'id' ]])) {
            include 
    $id [ $_GET [ 'id' ]];
        } else {
            echo 
    'Diese Seite existiert nicht!' ;
        }
    ?>
    ... muss ich was dazu sagen?
     
  15. 31. Oktober 2008
    AW: Inhalt in CSS Homepages

    Hallo,

    ich danke euch allen. Nun funktioniert es Schön, dass man sich auf die Leute hier verlassen kann

    Bewertung habt ihr alle!

    Mfg Halloweenracer
     
  16. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.