Forum Debian Users Gang

tajwan · 2013-03-08 14:59:35

Mam prosta strone www i kilka pozycji w menu jak robić żeby nie robić do każdego elementu menu podstrone ?

azhag · 2013-03-08 15:11:44

1. Prosta stronka w PHP czy czymś.
2. Jednak osobne podstrony składane naprędce z header.html, treść_podstrony.html i footer.html.
3. Zgrabne manewrowanie CSS-em i JS-em* — ukrywanie oraz pokazywanie wybranych elementów strony.

Osobiście wybrałbym 2 opcję.

__
*) na pewno konieczny? nowsze standardy CSS nie będą miały czegoś co JS zastąpi?

HAL9000 · 2013-03-08 17:11:47

Ostatnio się troche pobawilem technologiami webowymi i taki przyklad moge zaproponowac:
index.php

Kod:

<?php
require_once('doctype.inc.php');
require_once('session.inc.php');
require_once('head.inc.php');
?>
<body>
<div id="siteContain">
    <?php
        require_once('siteheader.inc.php');
    ?>
    <div id="content">
    <div id="leftMenu">
        <?php
        require_once('leftmenu.inc.php');
        ?>
    </div>
    <div id="mainContent">
        <?php
        require_once('index.inc.php');
        ?>
    </div>
    <div class="spacer"></div>
    
    </div>
    <div id="footer"><?php require_once('footer.inc.php'); ?></div>
</div>
</body>
</html>

siteheader.inc.php

Kod:

    <div id="siteHeader">
        <div id="primaryNavigation">
            <ul>
                <li><a href="index.php">Index</a></li>
                <li><a href="contact.php">Kontakt</a></li>
                <li><a href="manifest.php">O stronie</a></li>
                <li><a href="rules.php">Regulamin</a></li>
                <li>
                    <?php
                    include_once('functions/users.php');
                    echo ((amilogedin())?("<a href=\"logout.php\" title=\"Wyloguj " . $_SESSION['uname'] . "\">Wyloguj</a>"):("<a href=\"login.php\">Zaloguj</a>"));
                    ?>
                </li>
            </ul>
        </div>
        <a href="index.php" id="pageLogo"><img src="./images/logo.jpg" title="Index" alt="Index" /></a>
    </div>

tajwan · 2013-03-08 18:49:57

HAL9000 jak jak bys napisał jak to obsłużyć? w którym miejscu umieścić kod słabo sie na tym znam

HAL9000 · 2013-03-08 19:44:26

Nim zaczne sie silic na jakiekolwiek wyjasnienia pytanie, masz na serwerze obsluge php, asp lub czego co dziala po stronie zdalnego komputera?
Przeczytaj paragraf Client Side Includes na wiki jezeli nie, jezeli tak to jest to relatywnie proste i wowczas moge opisac co i jak.
http://en.wikipedia.org/wiki/Server_Side_Includes

tajwan · 2013-03-08 22:05:59

mam taki serwer z obsługą php

HAL9000 · 2013-03-09 08:33:24

Jeżeli dopiero zaczynacz to proponuje nastepujaca technike. Tworzysz pojedyncza strone jak ponizej i zapisujesz jako index.php
#1

Kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- <link rel="stylesheet" type="text/css" href="layout.css" /> -->
    <title>Tytuł</title>
</head>
<body>
    <div id="strona">
        <div id="naglowek">
            <ul>
                <li><a href="#">Jeden</a></li>
                <li><a href="#">Dwa</a></li>
                <li><a href="#">Trzy</a></li>
            </ul>
        </div>
        <div id="zawartosc">Zawartosc</div>
        <div id="stopka">Stopka</div>
    </div>
</body>
</html>

nastepnie zmieniasz to do takiej postaci jak ponizej, czyli wycinasz poszczegolne fragmenty i przenosisz do osobnych plikow
#2
index.php

Kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- <link rel="stylesheet" type="text/css" href="layout.css" /> -->
    <title>Tytuł</title>
</head>
<body>
    <div id="strona">
        <div id="naglowek">
            <?php
            include_once('naglowek.inc.php');
            ?>
        </div>
        <div id="zawartosc">Zawartosc</div>
        <div id="stopka">Stopka</div>
    </div>
</body>
</html>

naglowek.inc.php:

Kod:

<ul>
    <li><a href="#">Jeden</a></li>
    <li><a href="#">Dwa</a></li>
    <li><a href="#">Trzy</a></li>
</ul>

jak widac przenieslismy czesc zawartosci strony (to pomiedzy <ul></ul>) z #1 do osobnego pliku o nazwie naglowek.inc.php i uzywamy funkcji php include_once('naglowek.inc.php'); aby dolaczyc jej zawartosc do glownego pliku index.php. Ot i cala filozofia. Stosuja ta technike mozemy dalej rozbierac nasza strone glowna na czynniki pierwsze np:
plik index.php zmieniamy z
<div id="zawartosc">Zawartosc</div>
na
<div id="zawartosc"><?php include_once('index.inc.php'); ?></div>
i tworzymy index.inc.php z tekstem jaki chcemy.
http://www.youtube.com/watch?v=yz8dZsmLHQo tutaj jest materal jak zrobic z ul poziome menu.

pink · 2013-03-09 09:06:46

wgooglaj sobie single page layout

zamiast linkow div-y plus sakis fajny efekt przewijania tudziez przechodzenia

http://pinkflood.uphero.com/single_page/test_fx.html#about_me

tajwan · 2013-03-09 14:39:02

tylo że ja juz mam strone zrobion ą ty chce to jakoś tam wmontować

pink · 2013-03-10 18:09:18

to zamias linkow.html musisz podlinkowac konkretne kontenery div, gdzie ta strona mozna ja obejrzec.

tajwan · 2013-03-11 23:19:54

kucharz-zory.pl

pink · 2013-03-12 11:14:46

strona wyglada zgrabnie, dobre grafiki itd ale podejscie z tabelami jest przedpotopowe,

postaw to na div-ach i potem pomyslimy.

tu masz o co chodzi w responsywnym.

przy tego typu interesie musisz celowac w klase srednia i wyzej tacy ludzie maja smartfony wiec .....

http://www.thismanslife.co.uk/projects/lab/responsi … ames/#desktop

http://csslayoutgenerator.com/

Ostatnio edytowany przez pink (2013-03-12 13:15:06)

tajwan · 2013-03-12 13:19:25

Chyba jednak musze zostać przy tym co mam nie wiem co co divy nie zam się na www

pink · 2013-03-12 13:58:28

div-y sa proste

[---------------------------------------------------------]
[ div id = "header" ]
[---------------------------------------------------------]
[ ] ]
[div id = "left" ] div id = "right" ]
[ ] ]
[ ] ]
[ ] ]
[ ] ]
[ ] ]
[ ] ]
[ ] ]
[--------------------------------------------------------]
[ div id = "footer" ]
[--------------------------------------------------------]

mniej wiecej o to chodzi:
taki bylby twoj uklad i wtedy zamiast linkow.html moglbys w lewym menu dac div #right #right1 #right2 itd

Ostatnio edytowany przez pink (2013-03-12 14:05:36)

stepien86 · 2013-03-12 16:36:43

tajwan - generalnie div-y nie są takie trudne i polecam przejscie z tabelek właśnie na divy - łatwiej je stylować w CSS! . Zainteresuj się dodatkiem firebug dla firefoxa - dzięki niemu zrozumiesz te div-y. Generalnie teraz w xhtml5 struktury stron tworzy się w <section_id> i dopiero w sekcji dany div. Mimo mojej rady dzięki za temat, koledzy udzieli mi fanych kilku rad. Tworzyłem strony w Joomla - ale wolałbym wlasnego CMSa - byłby mniej zasobożerny niż kombajn joomla.

Ostatnio edytowany przez stepien86 (2013-03-12 16:51:49)

mer · 2013-03-12 18:17:56

Szybko i elegancko w pehapie?

www.slimframework.com + Twig bardzo, bardzo łatwe i eleganckie. Jakiś przykład żeby się wzorować? meetphp.pl i kod tej strony na githubie ;)

tajwan · 2013-03-12 21:03:55

O jezu wymagacie odemnie rzeczy niemożliwe :) ledwie podstawy html-a z przd 10 lat znam no ale zobacze co zakumam z tych div-ów

dominbik · 2013-03-12 21:28:55

ehhhh te tabelki. ciekawe jak to jest że każdy od nich zaczyna. a przejście na DIVy jest praktycznie bezbolesne i są 100 razy fajniejsze. tabelki przy DIV to męczarnia

pink · 2013-03-12 21:34:40

jak chcesz gotowca to mow odrazu. (zreszta pelno ich w sieci)
ale ja sie tutaj nauczylem osobiscie paru ciekawych rzeczy, wlasnie dla tego ze wspolforumowicze zamiast dawac gotowe rozwiazania raczej podsowaja pomysly prowokuja do myslenia.

tak czy siak strone trzeba przepisac w bardziej nowoczesny sposob, grafiki sa gotowe wiec problemu nie bedzie,

jezeli to twoj interes??? zreszta calkiem ciekawy (sam lubie gotowac) to by mi zalezalo aby to zrobic dobrze

jezeli znasz angielski to sie zapoznaj z:

fluid grids, media queries, flexible images and responsive web design.

na zachodzie w tej chwili jest trend aby strona najpierw dobrze dzialala na smartfonach/tabletach a do piero pozniej na desktopach.

Ostatnio edytowany przez pink (2013-03-12 21:46:26)

dominbik · 2013-03-12 21:43:55

pink napisał(-a):
na zachodzie w tej chwili jest trend aby strona najpierw dobrze dzialala na smartfonach/tabletach a do piero pozniej na desktopach.

i tak powinno być. z tego co wiem facebook obecnie działa nawet na IE6 a dug.net.pl dzięki lekkiej szacie bez problemu np. na starszym symbianie. I za to lubię takie stronki a nienawidzę efekciarskich przeładowanych flashem. w ogóle fajnie byłoby jakby wszystkie strony były takie lekkie , coś jak kernel.org. nie musiałbym wtedy zmieniać komputera

pink · 2013-03-12 21:48:35

wlasnie takie sa obecne tredy - html5 i css (jquery dla super efektow), flash is dead.

jutro podesle linki na rapida, pare tutkow z netmag-a i innych magazynow, mam kumpli w bookshopie to mam za friko.

na poczatek:
http://rapidshare.com/files/1127945271/resp-231.zip
http://rapidshare.com/files/2329778310/Media_Queries.zip

Ostatnio edytowany przez pink (2013-03-12 22:17:56)

tajwan · 2013-03-13 00:10:55

tak to jest moje

pink · 2013-03-13 18:00:31

http://rapidshare.com/files/4159335587/7.The_3_Ways … _CSS_Code.mov
http://rapidshare.com/files/26886422/1.Introduction … %20Basics.mov
http://rapidshare.com/files/1542149097/27.Elastic_Images_and_Text.zip

pink · 2013-03-14 11:07:23

tajwan - specially for you, z partyjnym pozdrowieniem.
http://learnlayout.com/

Ostatnio edytowany przez pink (2013-03-14 11:16:36)

tajwan · 2013-03-14 17:20:58

poszujuje tego szblonu http://www.google.pl/imgres?imgurl=http://www.allbl … Q&dur=463

SZBLON FREE WIĘC NIE PIRACE :)

Ostatnio edytowany przez tajwan (2013-03-14 21:02:49)

Forum Debian Users Gang

Ogłoszenie

#1 2013-03-08 14:59:35

tajwan - mega boss

Podstrony na www

#2 2013-03-08 15:11:44

azhag - Admin łajza

Re: Podstrony na www

#3 2013-03-08 17:11:47

HAL9000 - Użytkownik

Re: Podstrony na www

Kod:

Kod:

#4 2013-03-08 18:49:57

tajwan - mega boss

Re: Podstrony na www

#5 2013-03-08 19:44:26

HAL9000 - Użytkownik

Re: Podstrony na www

#6 2013-03-08 22:05:59

tajwan - mega boss

Re: Podstrony na www

#7 2013-03-09 08:33:24

HAL9000 - Użytkownik

Re: Podstrony na www

Kod:

Kod:

Kod:

#8 2013-03-09 09:06:46

pink - Użytkownik

Re: Podstrony na www

#9 2013-03-09 14:39:02

tajwan - mega boss

Re: Podstrony na www

#10 2013-03-10 18:09:18

pink - Użytkownik

Re: Podstrony na www

#11 2013-03-11 23:19:54

tajwan - mega boss

Re: Podstrony na www

#12 2013-03-12 11:14:46

pink - Użytkownik

Re: Podstrony na www

#13 2013-03-12 13:19:25

tajwan - mega boss

Re: Podstrony na www

#14 2013-03-12 13:58:28

pink - Użytkownik

Re: Podstrony na www

#15 2013-03-12 16:36:43

stepien86 - Członek DUG

Re: Podstrony na www

#16 2013-03-12 18:17:56

mer - Członek DUG

Re: Podstrony na www

#17 2013-03-12 21:03:55

tajwan - mega boss

Re: Podstrony na www

#18 2013-03-12 21:28:55

dominbik - Członek DUG

Re: Podstrony na www

#19 2013-03-12 21:34:40

pink - Użytkownik

Re: Podstrony na www

#20 2013-03-12 21:43:55

dominbik - Członek DUG

Re: Podstrony na www

pink napisał(-a):

#21 2013-03-12 21:48:35

pink - Użytkownik

Re: Podstrony na www

#22 2013-03-13 00:10:55

tajwan - mega boss

Re: Podstrony na www

#23 2013-03-13 18:00:31

pink - Użytkownik

Re: Podstrony na www

#24 2013-03-14 11:07:23

pink - Użytkownik

Re: Podstrony na www