Стена юзера в профиле. [phpBB2, punBB]

Всем приветик ребята. d_daisy

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

Стена юзера в профиле. [phpBB2, punBB] 3253396

Этап первый - Создание изображения и виджета.

Для начала вам нужно создать графическое изображение, которое будет служить кнопкой для открытия стены, к примеру вот такое:

Стена юзера в профиле. [phpBB2, punBB] 3240791

Стена юзера в профиле. [phpBB2, punBB] 3240791

Имея изображения, можно перейти к следующему, более важному этапу. Топаем в эту тему:
https://help.forum2x2.ru/t24312-topic
И делаем всё по выложенной инструкции, чтобы получить виджет «комментариев». После создания и настройки виджета, копируем код для вставки и возвращаемся на свой форум. Теперь когда мы получили код виджета комментариев, можно перейти к следующему этапу, а если быть точнее к созданию Htlm страницы.

Этап второй - Создание Htlm страницы.

Панель Администратора ✄ Модули ✄ HTML & JAVASCRIPT ✄ Управление страницами HTML.

Создаём новую Htlm - страницу с такими параметрами:

Название * : Любое, к примеру Стена Юзера.
Вы хотите использовать верх и низ вашего форума? : НЕТ.
Использовать эту страницу в качестве Главной? : НЕТ.

Содержимое страницы:

Код:: <!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" dir="ltr" lang="ru" xml:lang="ru"> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> </head> <br/><br/><br/><br/><br/><br/><br/><br/><br/><div class="regulations"> <style> body { background: url(http://www.snapsnap.ru/i/ibackground.png); /*основной фон*/ background-attachment: fixed; /*Фиксация фона*/ } .regulations{ background: url(http://img.bzdao.com/11151/7515699.jpg); /*фон поля с содержимым*/ width:50%; /*ширина поля с содержимым*/ font-size:17px; /*размер шрифта*/ border:double 7px #FFFFFF; /*рамка*/ -moz-border-radius:10px; -khtml-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; margin: 0 auto; padding:0px 30px 20px 30px; min-width:700px !important; line-height:1.3em; } </style> </body> </html>

Это создаст оформление для вашей страницы. Получив основу, нужно вставить код виджета в середину страницы:

Спойлер:

Затем сохраняем изменения. plus

Оформление меняем на свой вкус и желание. drinks

Этап третий - Создание всплывающего окна.

После настройки копируем ссылку Htlm - страницы и вставляем её в этот код, аналогично вставляем и ссылку на изображение "стены юзера".

<div style="position: absolute; right: 50px; bottom: 55%;">
<script type="text/javascript"></script>
<a href="javascript:winopp();"><img src="Ссылка на изображение" border="0" /></a>
</div>

Готовый код будет выглядеть на моём пример вот так:

Код:: <div style="position: absolute; right: 50px; bottom: 55%;"> <script type="text/javascript"></script> <a href="javascript:winopp();"><img src="http://savepic.org/3227502.png" border="0" /></a> </div>

Этап четвёртый - Дополнительная настройка окна и картинки.

Ниже приведены параметры, которые можно заменить на свои:

position:absolute - Отвечает за прокрутку изображения. При absolute картинка будет прокручиваться вместе со страницей, а если указать fixed, это сделает картинку фиксированной на странице, а это будет не очень красиво, поэтому для лучшего отображения используйте absolute.

right:50px; - Отвечает за горизонтальное отображение. left можно заменить на right, а числовой параметр можно использовать как допустим 800px;, так и 80%. Т.е проще говоря указывать можно как в пикселях, так и в процентах, это уже как вам будет удобнее.

bottom:50% - Отвечает за вертикальное отображение. bottom можно заменить на top, а с числовым параметром тоже самое что и с горизонтальным отображением.

<a href="Ссылка на Htlm страницу"> - Собственно говоря этот параметр не так уж и важен и его можно удалить. Но если у вас есть к примеру желание создать описание ранга, то в определённой теме выкладываете описание, а затем вставляете ссылку на эту тему, заместо этих
слов "Ваша ссылка".

<img src="Ссылка на изображение" /> - Это самый важный параметр собственно отвечающий за изображение. Заместо моей ссылки на изображение, вставляете свои ссылки изображений рангов.

height=500 - Отвечает за высоту всплывающего окна со "стеной".

width=1000 - Отвечает за ширину всплывающего окна со "стеной".

Стена юзера в профиле. [phpBB2, punBB] 3253396

Этап пятый - Встройка кода в шаблон.

Переходим к последнему этапу создания "Стены юзера" в профиле. Готовый код всплывающего окна, нужно вставить в шаблон Неразвёрнутого профиля. read

Панель Администрации ✄ Оформление ✄ Шаблоны ✄ Профиль ✄ profile_view_body.

В начало шаблона ставим этот код:

Код:: <div style="position: absolute; right: 50px; bottom: 55%;"> <script type="text/javascript"></script> <a href="javascript:winopp();"><img src="[color=green]Ссылка на изображение[/color]" border="0" /></a> </div>

Спойлер:

После чего сохраняем и опубликовываем шаблон. plus

Проверка на отображение.
Топаем в профиль и проверяем на отображение. Должно получиться примерно так:

Спойлер:

Если ничего не получилось, тогда просто очистите кеш. Зачастую это и бывает причиной неправильного отображения форума. Exclamation

Советы по туториалу.

№1 - Положение кнопки можно прикреплять к разным углам профиля, можно даже попробовать поиграть с вставкой стены в блок инфы.

№2 - Виджет комментариев можно заменить на другие виджеты, например Виджет комментариев от Вконтакте или виджет комментариев от Disqus. Также можно написать свою форуму "Стены юзера", ну это конечно если вы владеете определёнными навыками веб программиста. biggrin

Примечание.

Уважаемые форумчане: Если вы найдёте в туториале ошибки или неправильные шаги туториала, пожалуйста напишите мне об этом в л/с. Туториал хоть и писала не на скорую руку, но всё же могла допустить ошибки в грамматике или инструкции. punish

С уважением автор данного туториала Мишель Картер aka Сказочница Зазеркалья. Стена юзера в профиле. [phpBB2, punBB] 3224725