Jump to content
  • 0

Как разбить страницу на части?

alturgrey

Asked by alturgrey,

 Share

Question

alturgrey Explorer

alturgrey

Posted
Posted

Уважаемые, помогите разбить страничку на подгружаемые блоки (или на фреймы).

У меня есть страница шаблон. Нужно попилить ее на четрые блока:

1. Шапка

2. Боковое меню-реклама справа

3. Нижнее поле (банеры-реклама)

4. Собственно центральная часть, где будет меняться ОСНОВОЕ содержимое страницы.

Я не знаю, насколько актуальны нынче фреймы, но нужно нечто подобное.

На будущем сайте - страниц 200. Они все должны иметь Постоянную шапку, нижнее поле (типа шапки), и боковое поле с меню.

А центральная часть будет содержать Саму инфу, ради которой эти 200 страниц и живут.

Есть вариант, что бы Шапка, низ, и боковина, подгружались к каждой из листаемых страниц. Т.е сделав 201, или 208 новые страницы сайта, я впишу в заголовке "вызов шапки, и пр." ....

короче говоря, вот вам пример: http://3wforums.ru/?index ...

- сбоку листаешь меню, страницы меняются, верх , низ и бок - остаются ... или наоборот, у них центральная-текстово-информативная чать страницы, грузится из папки какой-то, не содержа при этом "вызова" чего либо, а ограничиваясь десятком вот таких строк:

<p class=mok2><center><b>newnewnew</b>

От чего отталкиваться ? Посоветуйте:

На каждой из 200 страниц в начале кода сделать вызов трех Основных блоков (шапку и прочие),

или наоборот, сделать страницу с каркасом из Этих блоков, с вызовом множества страниц контента в "рабочую" область страницы ....

вот код моей страницы:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="EN" lang="EN" dir="ltr">

<head profile="http://gmpg.org/xfn/11">

<title>News Magazine</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<meta http-equiv="imagetoolbar" content="no" />

<link rel="stylesheet" href="styles/layout.css" type="text/css" />

<script type="text/javascript" src="scripts/jquery-1.4.1.min.js"></script>

<script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script>

<script type="text/javascript" src="scripts/jquery.timers.1.2.js"></script>

<script type="text/javascript" src="scripts/jquery.galleryview.2.1.1.min.js"></script>

<script type="text/javascript" src="scripts/jquery.galleryview.setup.js"></script>

</head>

<body id="top">

<!-- НАчинается шапка -->

<div class="wrapper col0">

<div id="topline">

</div>

</div>

<div class="wrapper">

<div id="header">

<div class="fl_left">

<h1><a href="#"><strong>N</strong>ews <strong>M</strong>agazine</a></h1>

<p>111</p>

</div>

<br class="clear" />

</div>

</div>

<div class="wrapper col2">

<div id="topbar">

<div id="topnav">

<ul>

<li class="active"><a href="index.html">Home</a></li>

<li><a href="style-demo.html">Style Demo</a></li>

<li><a href="full-width.html">Full Width</a></li>

<li><a href="#">DropDown</a>

<ul>

<li><a href="#">Link 1</a></li>

<li><a href="#">Link 2</a></li>

<li><a href="#">Link 3</a></li>

</ul>

</li>

<li class="last"><a href="#">A Long Link Text</a></li>

</ul>

</div>

<br class="clear" />

</div>

</div>

<!-- Закончилась шапка -->

<div class="wrapper">

<div class="container">

<!-- Центральная секция -->

<div class="content">

<div class="footbox">

<h2>Lacus interdum</h2>

<ul>

<li><a href="#">Lorem ipsum dolor</a></li>

<li><a href="#">Suspendisse in neque</a></li>

<li><a href="#">Praesent et eros</a></li>

<li><a href="#">Lorem ipsum dolor</a></li>

<li><a href="#">Suspendisse in neque</a></li>

<li class="last"><a href="#">Praesent et eros</a></li>

</ul>

</div>

</div>

<!-- НАчинается код правой постоянной секции -->

<div class="column">

<ul class="latestnews">

<li><img src="images/demo/100x100.gif" alt="" />

<p><strong><a href="#">1</a></strong> Nullamlacus dui ipsum cons eque loborttis non euis que morbi penas dapibulum orna.</p>

</li>

<li><img src="images/demo/100x100.gif" alt="" />

<p><strong><a href="#">2</a></strong> Nullamlacus dui ipsum cons eque loborttis non euis que morbi penas dapibulum orna</p>

</li>

<li class="last"><img src="images/demo/100x100.gif" alt="" />

<p><strong><a href="#">3</a></strong> Nullamlacus dui ipsum cons eque loborttis non euis que morbi penas dapibulum orna</p>

</li>

</ul>

</div>

<br class="clear" />

</div>

</div>

<div class="wrapper"></div>

<!--Начинается нижняя секция -->

<div class="wrapper col8">

<div id="copyright">

<p class="fl_left">Copyright © 2010 - All Rights Reserved - <a href="#">Domain Name</a></p>

<p class="fl_right">4564564</p>

<br class="clear" />

</div>

</div>

</body>

</html>

css приводить не стал, думаю нет нужды ?

мне ЭТО, надо "попилить" на части, где часть: <!-- Центральная секция --> - то, что будет меняться на каждой странице, а остальные части - оставаться неизменными_)_

Link to comment
Share on other sites

12 answers to this question

Recommended Posts

  • 0
npofopr Trainee

npofopr

Posted
Posted

дак как бы все сайты вроде как так сделаны.

даже у этого форума есть своя шапка и подвал и меню.

изучайте php?

фреймами 200 страниц это наверно жестоко.

а вообще поставьте себе жумлу, вордпресс или форум. раз ссылку в качестве примера на форум приводите.

Link to comment
Share on other sites
  • 0
alturgrey Explorer

alturgrey

Posted
  • Author
Posted
дак как бы все сайты вроде как так сделаны.

даже у этого форума есть своя шапка и подвал и меню.

Нашел вариант на php. Страницу поделил на блоки, загружаемые в один файл ... один из тех 200 ...

Но столкнулся с проблемой:

Создаю файл: 11.php

<?

include("header.php");

?>

<!-- контент -->

<?

include("footer.php");

?>

Все отлично, шапка сверху, и футер снизу приписывается к ОСНОВНОМУ содержимому по середине,

НО ... меню справа, то что должно соседствовать бок о бок с Основным контентом, получается вписать только к шапке, или к футеру. Тогда оно или НАД контентом страницы, или ПОД ним ..

все упирается, что по высоте страницы выходит только 3 главных блока .. при чем они лежат друг на друге ..

Link to comment
Share on other sites
  • 0
Searcher Explorer

Searcher

Posted
Posted

Для меню у вас в разметке ведь должен быть отдельный див, или столбец, еслы вы таблицами верстаете. Ну так вот и запихните этот див или столбец в отдельный файл.

Потом, вы что, собираетесь каждую страницу из 200 отдельным файлом делать? Что у вас в контенте? Гораздо проще создать один скрипт php и при запросе к нему добавлять допустим ?showtopic=199 А в скрипте уже в массиве $_GET считывать значение переменной showtopic и в зависимости от этого значения формировать нужный контент.

Изучайте php.

Link to comment
Share on other sites
  • 0
alturgrey Explorer

alturgrey

Posted
  • Author
Posted

Спасибо за дельную мысль ....

А можно по подробнее ?

Я разбил страницу. Теперь есть подгружаемые три области - Хедер с главным меню, футер, и сбоку вспомогательное меню.

Но уперся во вторую, значимую проблему: Как динамически подгрузить контент из меню ?

Обычно меню, даже супер красивые и технологичные, базируются на <a href="#nogo5" class="top_ (вроде того), ссылки на ЦЕЛЬНЫЕ страницы ..

А мне надо что бы по ссылке нужный файл ВГРУЖАЛСЯ в нужную(основную и пустую) часть страницы.

Наверное нужен скрипт, который потом привязать к графической части Меню, вписанной в <body><div=> ...

Правда с загвоздкой ... - технология подгрузки(скрипт может) должны отличать (выбирать из списка) КАКИЕ Подменю нажимаются,

так как помимо простого пролистывания контента в Центральной части страницы, порой придется еще и какой-то Главных блоков (вспомогательное боковое меню, футер) подменять на другое ... (это специфика ПОДРАЗДЕЛОВ будущего сайта, увы, НЕ ВЕЗДЕ нужен один и тот же Футер, их по идее несколько).

Скажите, есть что-нибудь подходящее на примете ?

Или быть может вашу мысль:

Гораздо проще создать один скрипт php и при запросе к нему добавлять допустим ?showtopic=199 А в скрипте уже в массиве $_GET считывать значение.....
поподробнее распишите ?

Буду очень признателен ...

Link to comment
Share on other sites
  • 0
Vlad Explorer

Vlad

Posted
Posted

Контент из меню обычно динамически не подгружается. Делается проще - создается 200 разных страниц, у которых меню сбоку одинаково (за мелким исключением), а контент разный. Соответственно и футер с хедером у этих страниц тоже одинаковый. "Ручками" все 200 страниц никто сейчас не делает, а применяются всякие паттерны программирования. К примеру, типовой шаблон хранится отдельно и в нем только указаны области куда что загружать.

Чтобы скрипт понимал, что ссылки ведут на разные страницы, в конце адреса добавляют переменную со значением после знака вопроса. Это и есть передача данных с помощью метода GET. Используется везде, в любом поисковике можно посмотреть после ввода слова. Searcher об этом и говорил.

Сама программа получает значение так - $_GET['showtopic']. После чего берет полученное значение и обращается к базе данных (БД) к записи с соответствующим номером или файлу с тем же именем. В файле (БД) хранится только контент, который и вставляется в нужное место шаблона.

Технология вроде простая, но PHP изучать придется. Еще и всякие мелочи в голове держать, которые пока вроде не нужны, но в будущем окажутся важны. Это я про валидацию данных.

Link to comment
Share on other sites
  • 0
alturgrey Explorer

alturgrey

Posted
  • Author
Posted

вот блок "подгружаемой секции:

<td>

<? // надо ли писать вместо <? - <?php ?

$page = $_GET['page']; //сомнение вызывает эта строка .. СЮДА ли ее нужно поставить ?

if(!$page) { include("eip.php"); }

else if ($page=="cdo") { include("cdo.php"); }

else if ($page=="eip") { include("eip.php"); }

else if ($page=="fik") { include("fik.php"); }

?>

</td>

Вот кусок из меню:

<li><a href="#nogo2a">Абитуриенту</a></li>

<li><a href="index.php?page=cdo">ЦДО</a></li>

<li><a href="index.php?page=eip">ЭИП</a></li>

<li><a href="index.php?page=fik">ФИК</a></li>

<li><a href="#nogo2e">Магистратура</a></li>

Позиции меню как и следовало ожидать, рисуются,

при скролинге мышкой менюшки в статус баре текст:

http://www.xxx.ru/new2/index.php?page=cdo

Но при нажатии, ВСЯ страница полностью (вместе с хедерами и футерами = хотя казалось бы, их существование никто не отменял, должны же хоть они были на странице остаться) белый скрин,

Ошибка:

невозможно найти страницу.

Возможно эт стр была удалена, переименована или врем.недоступна

бла бла

HTTP 404 файл не найден

IE

Link to comment
Share on other sites
  • 0
alturgrey Explorer

alturgrey

Posted
  • Author
Posted

Достопочтимый форумчанен. Из сотен человек, кто мог бы прочесть мою тему(вернее мою проблему) наверное только вы один обратили внимание на Адрес моего сайта,

а не попытались бы разобраться собственно в проблеме, о которой идет речь))

Ну и для очистки совести снова спрошу, вы что, серьезно насчет порнухи ?

Скольких людей вы знаете, кто бы тупо тырил из сети контент порно-сайта ? .. вам самому не смешно ?

Я делаю свой сайт. по шаблону. себе. его еще нет. нету ни хостинга, ни окончательного кода. Это вообще, если честно сайт учебного заведения будет.

и буковки, после www/ значут, что я по ЭТИЧЕСКИМ соображениям не стал писать там: www/вася пупкин мега сайт/index.php?error ...

какая в топку разница, КАК зовут меня, и как зовется мой сайт ? ...

улыбнитесь, гражданин, что вам дались эти XXX ? ..

А насчет "забесплатно вам здесь не помогут" ... я чес говоря со стула съехал ...

что. так все круто и платно ?

Ай я и не знал ... пардон ... сорри ....

Link to comment
Share on other sites
  • 0
npofopr Trainee

npofopr

Posted
Posted

да все разобрались в вашей теме.

даже ответ дали: изучайте php

и я спрашивал и рассуждал, а не утверждал.

и если хотели показать, что у вас после индекса "позиция меню рисуется" /index.php?page=cdo

дак указали бы в скобках, что по ссылке ходить не надо.

в общем отписываюсь, дабы не разводить холиваров.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept