Strona główna i podstrony jak wygodnie tworzyć kolejne?

Witam

Mam stronę która jest podzielona na stronę główną oraz kilka podstron i będę potrzebował kilku kolejnych podstron na których będzie różnił się content.

Chciałbym jakoś zrobić by tworzenie kolejnych podstron z zachowaniem całego szablonu strony, nawigacji itd. było prostsze bo teraz po prostu tworzę kolejną podstronę .html i tam wklejam kod i edytuje.

W sumie nawet nie wiem jak to opisać ale tak jak mamy w Wordpress dodaje stronę przez panel zarządzania , wpisuje content a reszta jest tworzona z automatu. Jak trudne jest stworzenie czegoś takiego w przypadku strony którą piszemy od zera?

najprościej tworzysz header.php wrzucasz tam navi, potem tylko w plikach php dodajesz

<?php
include './header.php';
?>

i tak dalej z footer
ew. jakiś cms, lub sam robisz bloga z logowaniem admina i dodawaniem postów

Hmmm jeszcze nie wiem jak to ogarnąć, właśnie nie chcę używać gotowych CMS bo chcę się nauczyć.

Czyli w pliku index.html dodaje

<?php
include './header.php';
?>

A w pliku header.php znajduje się navi?

w plikach html zmienisz rozszerzenie na php, tu masz mniej więcej:
http://adrianbienias.pl/30-dniowy-kurs-php-dzien-13-includerequire/

<?php
include './header.php';
?>

To nie wywołanie CMS, tylko funkcja języka php.
Właściwie pytanie w czym to chcesz pisać? Jakich technologii używasz?

Andrzej Guziec napisał(a):

<?php
include './header.php';
?>

To nie wywołanie CMS, tylko funkcja języka php.
Właściwie pytanie w czym to chcesz pisać? Jakich technologii używasz?

HTML, CSS ale jeżeli bez PHP się nie obejdzie to mogę gdzieś dodać.

No... raczej się nie obędzie. Chyba, że użyjesz JSa i AJAXem będziesz ładował menu :P Ogólnie do czego ta strona - do nauki czy jakaś mająca działać na necie? Bo jak to pierwsze - to nauka PHP, jak drugie to już lepiej użyć prostego CMSa via Wordpress co IMHO będzie i tak wymagało pewnie nauki PHP jeżeli będziesz chciał jakoś bardzo personalizować stronę.

hapertown napisał(a):

No... raczej się nie obędzie. Chyba, że użyjesz JSa i AJAXem będziesz ładował menu :P Ogólnie do czego ta strona - do nauki czy jakaś mająca działać na necie? Bo jak to pierwsze - to nauka PHP, jak drugie to już lepiej użyć prostego CMSa via Wordpress co IMHO będzie i tak wymagało pewnie nauki PHP jeżeli będziesz chciał jakoś bardzo personalizować stronę.

Strona do nauki. Chcę coraz bardziej ją rozbudowywać. Chciałbym coś zrobić na zasadzie mini CMS ;) Dodaj podstronę itd.

Możesz też zrobić single page stosując <section> w html. Chyba, że zależy Ci na tym, aby za każdym razem ładowało osobno podstronę, to jak wyżej.

kiteboarder napisał(a):

Możesz też zrobić single page stosując <section> w html. Chyba, że zależy Ci na tym, aby za każdym razem ładowało osobno podstronę, to jak wyżej.

Czyli jak chcę żeby za każdym razem ładowało osobno to JS i AJAX ?

Gdzie mogę znaleźć więcej informacji jak to mogę zrobić?

Czyli mogę wykonać to poprzez PHP, JS i AJAX albo single page?

Jak chcesz robić stronę do nauki i ogólnie zacząć z tego robić jakiś CMS to w sumie trzeba byłoby się odwołać do jakiegoś frameworka (Kohana, Symfony etc.) - ale to już jest w tym momencie poza Twoim zasięgiem. Proponuję więc zacząć od czystego PHP i najprostszych rzeczy, następnie obiektowe (klasy etc.) + MySQL (bazy danych). Dopiero dalej możesz cokolwiek z tym ruszać i pomału konstruować swój kod. Innej drogi nie widzę.

Ogólnie w Twoim temacie,Twoja strona powinna wyglądać mniej więcej w ten sposób:

<?php
require_once 'header.php'; /* nagłówek strony, style CSS, nawigacja, import funkcji pomocniczych */
require_once 'slideshow.php'; /* przykładowy pliczek, w którym możesz sobie wygenerować np. pokaz slajdów i zaimportować tutaj */
/** 
	właściwy 
	kod 
	strony 
**/

require_once 'footer.php'; /* skrypt JS, zakończenie strony */
?>

Looknij tutaj jeszcze
Taki układ zapewnia Ci jedną zmianę w pliku mającą wpływ na wszystkie pozostałe strony. Jak już opanujesz klasy to tutaj masz przykładowy kod do którego ogólnie powinieneś zmierzać, tj. przykładowy model MVC.

hapertown napisał(a):

Jak chcesz robić stronę do nauki i ogólnie zacząć z tego robić jakiś CMS to w sumie trzeba byłoby się odwołać do jakiegoś frameworka (Kohana, Symfony etc.) - ale to już jest w tym momencie poza Twoim zasięgiem. Proponuję więc zacząć od czystego PHP i najprostszych rzeczy, następnie obiektowe (klasy etc.) + MySQL (bazy danych). Dopiero dalej możesz cokolwiek z tym ruszać i pomału konstruować swój kod. Innej drogi nie widzę.

Ogólnie w Twoim temacie,Twoja strona powinna wyglądać mniej więcej w ten sposób:

<?php
require_once 'header.php'; /* nagłówek strony, style CSS, nawigacja, import funkcji pomocniczych */
require_once 'slideshow.php'; /* przykładowy pliczek, w którym możesz sobie wygenerować np. pokaz slajdów i zaimportować tutaj */
/** 
	właściwy 
	kod 
	strony 
**/

require_once 'footer.php'; /* skrypt JS, zakończenie strony */
?>

Looknij tutaj jeszcze
Taki układ zapewnia Ci jedną zmianę w pliku mającą wpływ na wszystkie pozostałe strony. Jak już opanujesz klasy to tutaj masz przykładowy kod do którego ogólnie powinieneś zmierzać, tj. przykładowy model MVC.

A czy dodanie takiej funkcjonalności będzie działać na GitHub'ie? Tzn. chodzi mi też o bazy danych MySQL bo na GitHub jedno repozytorium mamy z domeną gdzie patrzymy jak strona działa.

A czy dodanie takiej funkcjonalności będzie działać na GitHub'ie? Tzn. chodzi mi też o bazy danych MySQL bo na GitHub jedno repozytorium mamy z domeną gdzie patrzymy jak strona działa.

Tzn to co teraz wrzuciłem jako kod, to tak - to są zwykłe pliki PHP, musisz tylko zmienić rozszerzenie docelowych plików na .php i ew. pobawić się htaccess'em, żeby obsłużyć przyjazne adresy. Jeśli chodzi o bazę danych potrzebny jest zewnętrzny serwer baz danych, w którym się buduje bazę i przechowuje dane. Zazwyczaj jest to oferowane od razu na hostingu, który się wykupuje, ew. jeżeli to lokalna kopia na komputerze, trzeba sobie taki serwer zainstalować. W razie modyfikacji struktury bazy, można ją ewentualnie wyeksportować i wrzucić na GITa jako najbardziej aktualny zrzut, który potem należało by zaimportować, ale może ktoś bardziej doświadczony udzieli lepszych rad w sprawie GITa i baz danych.

hapertown napisał(a):

A czy dodanie takiej funkcjonalności będzie działać na GitHub'ie? Tzn. chodzi mi też o bazy danych MySQL bo na GitHub jedno repozytorium mamy z domeną gdzie patrzymy jak strona działa.

Tzn to co teraz wrzuciłem jako kod, to tak - to są zwykłe pliki PHP, musisz tylko zmienić rozszerzenie docelowych plików na .php i ew. pobawić się htaccess'em, żeby obsłużyć przyjazne adresy. Jeśli chodzi o bazę danych potrzebny jest zewnętrzny serwer baz danych, w którym się buduje bazę i przechowuje dane. Zazwyczaj jest to oferowane od razu na hostingu, który się wykupuje, ew. jeżeli to lokalna kopia na komputerze, trzeba sobie taki serwer zainstalować. W razie modyfikacji struktury bazy, można ją ewentualnie wyeksportować i wrzucić na GITa jako najbardziej aktualny zrzut, który potem należało by zaimportować, ale może ktoś bardziej doświadczony udzieli lepszych rad w sprawie GITa i baz danych.

Dzięki za odpowiedzi. A wracając do samego kodu jak obecnie w repozytorium mam pliki w *.html i *.css to muszę zmienić ich rozszerzenia na *.php i tworzę plik jak header.php i wrzucam kod html zawierający wszystko co mam obecnie w nagłówku index.html i następnie umieszczam odwołanie do tego pliku w index.php ?

Właściwie tak, wszystkie html zmieniasz na PHP i robisz jak napisałeś. Zresztą tam w tym linku jest

hapertown napisał(a):

Właściwie tak, wszystkie html zmieniasz na PHP i robisz jak napisałeś. Zresztą tam w tym linku jest

Dzięki za odpowiedzi. Bardzo przydatne.

Jeszcze tylko mam ostatnie pytanie czemu JS został dany w stopce? To tylko dla przykładu czy powinna być taka zasada dodawania?

require_once 'footer.php'; /* skrypt JS, zakończenie strony */

Jeżeli to tylko możliwe skrypty powinny być umieszczane na końcu strony, za właściwą treścią (tą przeglądaną przez roboty googla itp.) Ma to wpływ na pozycjonowanie stron.

Andrzej Guziec napisał(a):

Jeżeli to tylko możliwe skrypty powinny być umieszczane na końcu strony, za właściwą treścią (tą przeglądaną przez roboty googla itp.) Ma to wpływ na pozycjonowanie stron.

że co?
skrypty są za contentem aby najpierw ładowały się elementy strony, a potem działania na nich, analogicznie najpierw biblioteki, a potem skrypty które z nich korzystają...

Treści strony umieszcza się przed skryptami, żeby jak najszybciej strona mogła się wczytać i wyrenderować. Ma to duży wpływ na prędkość wczytania strony i pozycjonowanie.
Zresztą można sprawdzić np. https://developers.google.com/speed/pagespeed/insights/?hl=pl&url=https%3A%2F%2F4programmers.net%2F&tab=desktop
Co do działań na contentcie i tak wolę się upewnić, że już można, wywołując to w np.:
$( document ).ready()
Oczywiście najpierw ładujemy biblioteki np.: jquery, a dopiero potem go używamy.

Andrzej Guziec napisał(a):

Treści strony umieszcza się przed skryptami, żeby jak najszybciej strona mogła się wczytać i wyrenderować. Ma to duży wpływ na prędkość wczytania strony i pozycjonowanie.
Zresztą można sprawdzić np. https://developers.google.com/speed/pagespeed/insights/?hl=pl&url=https%3A%2F%2F4programmers.net%2F&tab=desktop
Co do działań na contentcie i tak wolę się upewnić, że już można, wywołując to w np.:
$( document ).ready()
Oczywiście najpierw ładujemy biblioteki np.: jquery, a dopiero potem go używamy.

Czyli biblioteke dodajemy w head a sam skrypt na dole poza body?

Nie biblioteka jest też na dole, ale przed naszym skryptem.

Andrzej Guziec napisał(a):

Nie biblioteka jest też na dole, ale przed naszym skryptem.

To często nawet w popularnych sklepach widzę ze biblioteka jQuery jest w head :) być może dlatego że na dole wczytuje zdjęcia i masz możliwość np. powiększenia zdjęcia po najechaniu myszki i to jest niezbędne chociaż już sam nie wiem? Co nie oznacza że to jest poprawnie tylko zauważyłem wielokrotnie gdzieś takie zastosowanie.

Często podstawowe biblioteki daje się w nagłówku, żeby były dostępne dla różnych części strony.
np. w przykładzie:

<?php
require_once 'header.php'; /* nagłówek strony, style CSS, nawigacja, import funkcji pomocniczych */
require_once 'slideshow.php'; /* przykładowy pliczek, w którym możesz sobie wygenerować np. pokaz slajdów i zaimportować tutaj */
/** 
    właściwy 
    kod 
    strony 
**/
 
require_once 'footer.php'; /* skrypt JS, zakończenie strony */
?>

Jeżeli w slideshow.php użyjemy skryptu $(function(){}) z jquery to musi być on już załadowany wcześniej w header.php

Dlatego też zazwyczaj strony powstają w oparciu o gotowe rozwiązania via Frameworki czy CMSy, które wspomagają programistę w optymalizacji strony. Docelowo biorąc pod uwagę takie ranki jak Page Speed i ogólną optymalizację, JSy ładuje się na dole strony, aby cała jej treść mogła zostać wyrenderowana bez czekania na zasoby na górze (w sekcji head). Stąd też wszystkie większe funkcje ładuje się zazwyczaj w kilka plików JS, które potem są łączone przez system strony i ładowane na samym końcu. Dowolny kod inline'owy załącza się wtedy w dedykowanej funkcji która go dokleja po załadowaniu wszystkich JSów. Dzięki temu strona ładuje się szybciej a zewnętrzne JSowe biblioteki dołączane są już po jej wyrenderowaniu, co dla Page Speed może mieć kolosalne znaczenie.
Tego typu systemy pomagają też optymalizować stronę pod kątem obrazków, kompresji kodu etc., dlatego też wcześniej pisałem o frameworkach, na których dopiero stawia się taki system jak Ty chcesz, ale wiadomo, że od jakiś podstaw trzeba zacząć :)

Zawsze można użyć czegoś w stylu https://webpack.github.io/ spakować wszystko to jednego js / css no i zmniejszyć wielkość.

hapertown napisał(a):

Jak chcesz robić stronę do nauki i ogólnie zacząć z tego robić jakiś CMS to w sumie trzeba byłoby się odwołać do jakiegoś frameworka (Kohana, Symfony etc.) - ale to już jest w tym momencie poza Twoim zasięgiem. Proponuję więc zacząć od czystego PHP i najprostszych rzeczy, następnie obiektowe (klasy etc.) + MySQL (bazy danych). Dopiero dalej możesz cokolwiek z tym ruszać i pomału konstruować swój kod. Innej drogi nie widzę.

Ogólnie w Twoim temacie,Twoja strona powinna wyglądać mniej więcej w ten sposób:

<?php
require_once 'header.php'; /* nagłówek strony, style CSS, nawigacja, import funkcji pomocniczych */
require_once 'slideshow.php'; /* przykładowy pliczek, w którym możesz sobie wygenerować np. pokaz slajdów i zaimportować tutaj */
/** 
	właściwy 
	kod 
	strony 
**/

require_once 'footer.php'; /* skrypt JS, zakończenie strony */
?>

Looknij tutaj jeszcze
Taki układ zapewnia Ci jedną zmianę w pliku mającą wpływ na wszystkie pozostałe strony. Jak już opanujesz klasy to tutaj masz przykładowy kod do którego ogólnie powinieneś zmierzać, tj. przykładowy model MVC.

Mam jeszcze pytanie odnośnie kodu

<body>

<?php include("includes/header.html");?>
<?php include("includes/navigation.html");?>

This is the content of the page

<?php include("includes/footer.html");?>

</body>
</html>

Czemu tutaj w przykładzie http://www.apaddedcell.com/how-automatically-include-your-header-navigation-and-footer-every-page include jest plików .html nie powinno być .php?

No bo ktoś sobie tak to wymyślił :) Ogólnie include'em możesz sobie pociągnąć zawartość różnych plików, ale najlepiej ciągnąć pliki PHP, bo w nich można wykonać coś sensownego. Jak pociągniesz include'em plik HTML to właściwie ładujesz jego zawartość, a jak ciągniesz plik PHP to możesz w nim coś wykonać i wyniki będą wyrenderowane na stronie.
Tak właściwie to dobrze, żebyś ładował plik poprzez require_once - dlaczego, wyjaśnienie masz tutaj

hapertown napisał(a):

No bo ktoś sobie tak to wymyślił :) Ogólnie include'em możesz sobie pociągnąć zawartość różnych plików, ale najlepiej ciągnąć pliki PHP, bo w nich można wykonać coś sensownego. Jak pociągniesz include'em plik HTML to właściwie ładujesz jego zawartość, a jak ciągniesz plik PHP to możesz w nim coś wykonać i wyniki będą wyrenderowane na stronie.
Tak właściwie to dobrze, żebyś ładował plik poprzez require_once - dlaczego, wyjaśnienie masz tutaj

Czyli suma sumarum require_once nie będzie ładował dwa razy tej samej zawrartości w przypadku odświeżania strony?

Nie pozwoli Ci na załadowanie tego samego pliku 2x, bo wykryje że został już załadowany wcześniej. Zwykłym requirem możesz ładować do oporu :P