Вышла вторая версия портала — Ссылка п.72. |
Наши наработки (Обязательно посмотрите!) |
Наши наработки:
Вариант портала от Kolobdur74 - Ссылка пост 96.
Улучшеная версия портала от Kolobdur74 - Ссылка пост 116.
Портал вкачестве главной (без редиректа) Создаем полноценный Портал на форумах MyBB! пост 35.
Портал вкачестве главной (с кукисами) Создаем полноценный Портал на форумах MyBB! пост 136.
Новости подфорумно Создаем полноценный Портал на форумах MyBB! пост 157.
Еще одна версия подфорумного портала Создаем полноценный Портал на форумах MyBB! пост 169.
Пагинатор для портала (переключатели страниц) Создаем полноценный Портал на форумах MyBB! пост 187.
Вариант портала с красивыми переходами между страницами. Создаем полноценный Портал на форумах MyBB! пост 336.
*Последний вариант портала с упрощенным заполнением: Создаем полноценный Портал на форумах MyBB!
* к нему же
вариант портала конструктор - это пост 839Таблицы селекторов: пост 838
Полноценный Портал на форумы. C3La-NS, Romych. © Версия 1.
Для всех тех, кто мечтает о полноценном портале на MYBB. Мне удалось написать код полноценного портала на ваши форумы!
Выглядит очень классно, даже ничуть не хуже чем на других сайтах не на майбб.
Ну, а теперь, если Вы не смыслите в HTML, разберем все по порядку. Пример можно посмотреть у меня: Ссылка
P.S. Профи, тоже сильно не пинать, я только учусь.
<style type="text/css">
div.color {
width:auto;
border-width:0px;
border-style:solid;
border-color:;
}
</style>
<style>
.Box1 {
margin-bottom:5px;
width:auto;
height: auto;
background-color: #ffffff;
border: 2px solid #D4D4D4;
border-radius: 0 0 8px 8px;
-moz-border-radius:0 0 8px 8px;
-khtml-border-radius: 0 0 8px 8px;
box-shadow: 0 0 15px #A9A9A9;
padding:20px 40px;
}
</style><style>
#BoxRSS {
margin: auto;
width: 30% !important;
min-width: 30% !important;
max-width: 30% !important;
position: absolute;
}
</style>
<style>
#bib p iframe {max-height: 600px;max-width: 600px;}
#bib p img {max-width: 600px;}
</style><table style="height: 300px; ; width: 100%;" border="0" frame="void" rules="none" cellpadding="0">
<tbody>
<tr>
<td valign="top" width="70%">
<br>
<br>
<div class="color"><h1>Новостная лента</h1>
<div class="BoxRSS" style="height: auto;">
<script type="text/javascript">
$(function(){
$('div#pun-pages div#pun-main div.BoxRSS').append('<div id="RSS" style="width: 100%;border: 0px solid #778899;margin-left: 0;background: white;"><table id="bib" cellspacing="0" width=100% align="center"><tr><th width=100%><b>Последние сообщения форума</b></th></tr></table></tr></table></div>');
$.get('/export.php','',processXML);
function processXML(data){
$(data).find('item:lt(10)').each(function(){
var JAuthor=$(this).find('author').text().slice(14,-1);var JTitle=$(this).find('title').text();
var JLink=$(this).find('link').text();var JCont=$(this).find('description').text();
var JPosted=$(this).find('pubDate').text().slice(4,-9);
$('#bib').append('<tr><td><a href="'+ JLink +'">'+JTitle+'</a><br><br>'+JCont+'<br></br><strong>Написал — </strong><b>'+ JAuthor +'</b> '+ JPosted +'</td></tr>'); });
} });
</script></div></div></td>
<td valign="top" width="30%">
<div class="color"><h1>Заголовок 1-го блока</h1>
<div class="Box1" style="hieght: 250px;">Текст 1-го блока</div></div>
<br>
<div class="color"><h1>Заголовок 2-го блока</h1>
<div class="Box1">
Текст 2-го блока
</div></div>
<br>
<div class="color"><h1>Заголовок 3-го блока</h1>
<div class="Box1" style="hieght: 200px;">Текст 3-го блока
</div></div>
<br>
<div class="color"><h1>Заголовок 4-го блока</h1>
<div class="Box1" style="hieght: 70px;">Текст 4-го блока.
</div></div>
<br>
</td>
</tr>
</tbody>
</table>
Важно: при редактировании страницы не используйте визуальный редактор, в противном случае портал перекособочит!
Что представляет данная страница? — условно я поделил ее на две части, использовав невидимую таблицу. Левая часть — самая большая 70% от размера форума, соответственно правая — 30%. Но, я думаю, Вы это уже поняли, испытав код.
Фиолетовое — вообще не трогаем, это мой бред, чтобы вся конструкция держалась четко.
Зеленое в тегах <style> — отвечает за стиль оформления наших боковых блоков (в правой части). Меняем на свое, чтобы настроить.
Все блоки DIV с названием Box1 — это наши боковые блоки. Их стиль определяется по первому зеленому Style. Однако некоторые из них имеют и свои настройки, как например 3 и 4 блок. В нашем случае это определенная высота.
<style></style> с содержимым оливкового цвета отвечает лишь за один самый большой блок.
Это мы только рассмотрели каркас нашего портала. Теперь давайте двинемся дальше и посмотрим как сделать ленту новостей!
Красное — это и есть скрипт, который выводит все свежие новости форума. Впринципе, все автоматизировано, так что ничего менять/указывать не надо. Можно оставить как есть.
Есть другая проблема: дело в том, что изображения большого разрешения будут выезжать за пределы новостной ленты и наезжать на другие блоки. Не хорошо. Исправляем это голубым кодом. Сами настраивайте максимальную ширину и длину изображений и фреймов для своего форума. Теперь картинки высокого разрешения будут ужиматься сами до максимально-допустимого значения. Э, фреймы тоже.
На этом все. Дальше сами наполняйте свой портал контентом, не стесняйтесь менять что-нибудь на свой лад.
Обо всех ошибках пишите сюда, попытаемся устранить.
• пока я сам нашел только один недочет: огромный непрерывный текст (без пробелов) выезжает за пределы новостной ленты, но это постараемся исправить в ближайших апдейтах.
Ставим Плюсики если понравилось
Отредактировано C3La-NS (Вт, 1 Окт 2013 18:07:27)