Модификация форума

Страница: 1

Тема закрыта

Сообщений 1 страница 3 из 3

Поделиться1Среда, 29 января, 2025г. 18:43:13

Автор: Merlin
Администратор
Зарегистрирован: Среда, 22 января, 2025г.
Приглашений: 0
Сообщений: 16
Уважение: +4
Позитив: +8
Провел на форуме:
21 час 57 минут
Последний визит:
Сегодня 05:23:33

В этой теме я буду писать, что где изменено с кратким пояснением.

Тема по умолчанию - Mybb Vbulletin mix.

Поделиться2Среда, 29 января, 2025г. 18:44:30

Автор: Merlin
Администратор
Зарегистрирован: Среда, 22 января, 2025г.
Приглашений: 0
Сообщений: 16
Уважение: +4
Позитив: +8
Провел на форуме:
21 час 57 минут
Последний визит:
Сегодня 05:23:33

HTML-верх

Скрыть логотипы в шапке

Код:

<style>
#pun-title h1 {  display: none;}
#pun-title table {
    background-size: contain;
    background-position: center;
    background-image: url("https://forumstatic.ru/files/0010/54/6f/20763.jpg");
    /* (img-height / img-width * container-width) */
    /* (300 / 1310 * 100) */
    height: 0;
    padding-top: 22.9%;
    width: 100%;
}
#pun-announcement h2 {display: none;}
#pun-announcement .container {padding-top: 1em}
</style>

Выделение ников после слова "Привет" на главной странице

Код:

<style>
.gid1 #pun-status .item1 strong {
    color: teal; /*цвет Админа после Привета*/
    background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;   
}
.gid2 #pun-status .item1 strong {
    color: purple; /*цвет Модераторов после Привета*/
  background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;  
}
.gid4 #pun-status .item1 strong {
        background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;   
}
</style>

"Лайки" (т.н. быстроплюсы) в "сердечке"

Код:

/*Быстроплюсы для Топика!*/
<style>
/*Быстроплюсы для Топика!*/
div .post-rating p a {
    text-align: center;
    outline: 1px solid transparent;
    font-weight: 700;
    background: url(https://forumstatic.ru/files/0019/f6/b8/47053.png) no-repeat center;
     background-size:36px auto;
     position:relative;
    z-index:100;
    width: 36px;
    height: 36px;
    text-align:center;
    font-size: 12px !important;
    display: inline-block;
    vertical-align: middle;
    line-height: 34px;
    letter-spacing: -.1px;
}
.noNull:before{content: "+";
    display: inline-block;
    margin-left: -1px;
    font-size: 9px;
    letter-spacing: 0!important;
}   
.punbb .post-rating p {
   padding: 0 !important;
}
</style>

<!--// Быстроплюсы v.1 by Deff //-->
<script src="https://forumstatic.ru/files/001b/a6/d4/74583.js"></script>

Закругления углов для цитат, спойлеров, картинок и т.п. рамок, и для аватаров

Код:

<!-- Закругления НАЧАЛО-->
<style type="text/css">
iframe {
    border-radius: 10px;
}
.code-box{padding-left:50px!important; border-radius: 10px !important;
    border: 1px solid #c5d0e6;
}
.quote-box.hide-box{padding-left:50px!important; background: #faf0e6; border-radius: 10px !important;
    border: 1px #c5d0e6;
}
.quote-box.answer-box{padding-left:50px!important; background: #e6e6fa; border-radius: 10px !important;
    border: 1px solid #c5d0e6;
}
.spoiler-box.media-box{padding-left:50px!important;  background: #e6e5ff; border-radius: 10px !important;
    border: 1px solid #c5d0e6;
}
.spoiler-box.text-box{padding-left:50px!important;  background: #e8e8fc; border-radius: 10px !important;
    border: 1px solid #c5d0e6;
}
.quote-box.spoiler-box{padding-left:50px!important; background: #e8e8fc; border-radius: 10px !important;
   border: 1px solid #c5d0e6;
}
.quote-box.quote-main{padding-left:50px!important; background: #e6e6fa; border-radius: 10px !important;   border: 1px solid #c5d0e6;
}
.quote-box.with-avatar{padding-left:50px!important; background: #E0E6F6; border-radius: 10px !important;
    border: 1px solid #A9A9A9;
}
.author-avatar+span {margin-left:-40px;}
.author-avatar {
  float: left;
  width: 39px;
  margin-left: -40px;
  margin-top: 27px;
  }
.author-avatar > img {
  width: 28px;
  padding: 2px;
  border: 1px solid #c5d0e6;
  border-radius: 4px;
  }
#pun-main h3 >a{ 
background: #f8f8ff;
padding: 0px 7px 3px !important;
border-radius: 10px !important;
</style>
<!-- Закругления КОНЕЦ-->
<!-- Аватары закругления НАЧАЛО-->
    <style>
.post .pa-avatar img {
  max-width: 130px;
  border-radius: 10px;              /* Закругление углов */
  box-shadow: 0px 5px 18px #000;    /* Тень */
}
</style>
<!-- Аватары закругления КОНЕЦ-->

Выделение фона для ника над аватаром (в темах)

Для админов, модераторов и пользователей цвета разные. Сделано с запасом на возможные будущие группы

Код:

<!-- Выделение ника и фона для ника над аватаром (в темах) -->  
    <style>

div[data-group-id="1"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}

div[data-group-id="2"] li.pa-author>a 
{
background: #d3c5f0;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}

div[data-group-id="3"] li.pa-author>a 
{color:
background: #c9d5ec;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}

div[data-group-id="4"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}

div[data-group-id="5"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
div[data-group-id="6"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
div[data-group-id="7"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
div[data-group-id="8"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
div[data-group-id="9"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-
div[data-group-id="10"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
bord
div[data-group-id="11"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
div[data-group-id="12"] li.pa-author>a 
{
background: #bed2f7;
padding: 0px 10px 3px !important;
border-radius: 6px !important;
}
</style>
<!-- Выделение ника и фона для ника над аватаром (в темах) -->

Аватар в цитате, часть 1 для HTML верх

Код:

<!-- Аватар в цитате V.2 © Alex_63 / Ч.1 в HTML верх-->
<script type="text/javascript">
var QuoteImg = 'https://forumstatic.ru/files/0015/ec/20/41408.png'; //Картинка "Перейти к сообщению" в цитате
</script><script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/77306.js"></script>
<script>
$(document).on('pun_post pun_edit', function() {setTimeout(function() {setLinkAndAva('.post.new-ajax')}, 0)})
$(document).on('pun_preview', function() {setTimeout(function() {setLinkAndAva('#post-preview')}, 0)})
</script>

Треугольник (влево) в мини профайле в теме

Код:

<!--Начало Треугольник -->
<style>
.post .post-body {
    position: relative;
    overflow: visible;
}
.post .post-body::before {
    content: "";
    border: solid 12px;
    border-color: transparent #f5f5ff transparent transparent;
    display: block;
    position: absolute;
    left: -24px;
    top: 15px;
    z-index: 1;
}
.post .post-body::after {
    content: "";
    border: solid 13px;
    border-color: transparent #d1d1e1 transparent transparent;
        display: block;
    position: absolute;
    left: -26px;
    top: 14px;
   }
      .post .postimg {
    border-radius: 7px;
border: solid 1px #ccc;
</style>
<!--Конец Треугольник -->

Иконки для разделов на главной

Код:

<!--НАЧАЛО иконки для разделов на главной-->
<style>
.punbb tr#forum_f21 div.icon {background: url("https://mir-3d.ucoz.ru/_ph/34/2/469812360.gif")  no-repeat left center / contain;}
.punbb tr#forum_f23 div.icon {background: url("https://i.ibb.co/DfHztCJZ/t123006-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f35 div.icon {background: url("https://i.ibb.co/WWqznZWN/918016937-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f44 div.icon {background: url("https://i.ibb.co/pv4jrx5f/4f5cbe7da07881bd96bc933524e4020b-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f53 div.icon {background: url("https://i.ibb.co/bRrTL8Q6/c6d6fc309a84334f0c4b81e26bc050c3-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f55 div.icon {background: url("https://i.ibb.co/YFWpKCKN/cce856b0ea6b4a852a6e34b25f92e156-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f58 div.icon {background: url("https://i.ibb.co/5WwScz78/a060afd12771d1bc40e0fa33566f748a-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f65 div.icon {background: url("https://i.ibb.co/4nTnYW2c/378189836-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f81 div.icon {background: url("https://i.ibb.co/tWMGC9p/986491840-1.gif")  no-repeat left center / contain;}
.punbb tr#forum_f83 div.icon {background: url("https://i.ibb.co/gbnCqSLD/0104074bb2b32deacc255da9d2813da3-1.gif")  no-repeat left center / contain;}
</style>
<!--КОНЕЦ иконки для разделов на главной-->

Поделиться3Среда, 29 января, 2025г. 18:44:46

Автор: Merlin
Администратор
Зарегистрирован: Среда, 22 января, 2025г.
Приглашений: 0
Сообщений: 16
Уважение: +4
Позитив: +8
Провел на форуме:
21 час 57 минут
Последний визит:
Сегодня 05:23:33

HTML-низ

Аватар в цитате V.2 © Alex_63 / Ч.2 в HTML низ

<script type="text/javascript">setLinkAndAva()</script>

Выделение цветом прикреплённых, закрытых и непрочитанных тем

Код:

<style>
tr.isticky td {
  background-color: #f2e1f2;
}

tr.iclosed td{
  background-color: #CFDCE8;
}
tr.inew td{
  background-color: #e0e2de;
}
</style>

Красивые кнопки в форме ответа + компактная форма ответа

Код:

<style>
/* Красивые кнопки в форме ответа  */
#form-buttons {
  display: inline-block;
  border: 1px solid #c9d9e9;
  border-left-width: 0;
  background-color: #e3ecf3;
  background-image: url(https://forumupload.ru/uploads/0007/af/57/14152-4.png);
  background-repeat: repeat-x;
}
#form-buttons table {
  width: 100% !important;
}
#form-buttons td {
  border-left: 1px solid #c9d9e9 !important;
  border-right: 1px solid #f3f7fa !important;
}
#form-buttons td:hover {
  background-color: #f5f8fb;
}
#form-buttons td:active {
  background-color: #c9d9e9;
  -moz-box-shadow: inset 1px 1px 5px #92a9c1;
  -webkit-box-shadow: inset 1px 1px 5px #92a9c1;
  box-shadow: inset 1px 1px 5px #92a9c1;
}
 
/* Компактная форма ответа  */
#post {
  margin: 0;
  padding: 0;
}
#post fieldset {
  border: none;
}
#post legend {
  display: none;
}
#post .formsubmit {
  padding: 0 18px 18px 18px;
  margin: 0 !important;
}
</style>

Ужатие некликабельных и кликабельных картинок в постах

Код:

<style>
/* Ужатие некликабельных и кликабельных картинок в постах */
.post-content .postimg, .post-content a .postimg {
  max-width:350px!important;
  max-height:350px!important;
  width:auto!important;
  height:auto!important;
  }
@media screen and (min-width: 540px) {
.post-content .postimg, .post-content a .postimg {
  max-width:400px!important;
  max-height:400px!important;
  width:auto!important;
  height:auto!important;
  }
}
</style>

Кнопки прокрутки вверх и вниз

Код:

<!--Кнопки прокрутки вверх и вниз-->
<div class="go-up" id='ToTop'><img src="https://s9.uploads.ru/ZoSUi.png" border="0" width=100%/></div>
<div class="go-down" id='OnBottom'><img src="https://s9.uploads.ru/7ilTu.png" border="0" width=100%/></div>
<style>
.go-up,.go-down {
display:none;
position:fixed; /*позиционируем*/
right:0px; /*указываем положение, если слева - left*/
z-index:9999; /*показываем поверх все элементов на странице*/
cursor:pointer;
opacity:.7; /*прозрачность*/
margin-bottom:5px; /*отступ снизу (можно не указывать)*/
width:30px; /*ширина кнопки*/
height:30px; /*высота кнопки*/
}
.go-up {
bottom:65px; /*положение от низа окна браузера верхняя кнопка*/
}
.go-down {
bottom:25px; /*положение от низа окна браузера нижняя кнопка кнопка*/
}
.go-down:hover,.go-up:hover {
opacity:1;
}
</style>
<script type="text/javascript">
$(function(){
if ($(window).scrollTop()>="250") $("#ToTop").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()<="250") $("#ToTop").fadeOut("slow")
  else $("#ToTop").fadeIn("slow")
});
if ($(window).scrollTop()<=$(document).height()-"999") $("#OnBottom").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()>=$(document).height()-"999") $("#OnBottom").fadeOut("slow")
  else $("#OnBottom").fadeIn("slow")
});
$("#ToTop").click(function(){$("html,body").animate({scrollTop:0},"slow")})
$("#OnBottom").click(function(){$("html,body").animate({scrollTop:$(document).height()},"slow")})
});
</script>
<!--Кнопки прокрутки вверх и вниз-->

Регулировка размера шрифта в постах

Код:

<!-- Регулировка размера шрифта в постах © Alex_63 -->
<style>
.FNTslider {
  border-radius: 4px;
  position:relative;z-index:1000;
  background: #E0E0E0;
  width: 110px;
  height: 5px;
  margin: 3px 5px;
  border: solid 1px #ccc;
  float: right;
  margin-right: 7%;
}
.FNTslider .before {
  height: 5px;
  border: solid 1px transparent;
  border-right: none 0;
  border-radius: 4px 0 0 4px;
  position: absolute;
  background: #A0BCDA;
  margin-top: -1px;
}
.FNTslider .thumb {
  width: 8px;
  height: 13px;
  border-radius: 3px;
  position: relative;
  top: -4px;
  background: #3980D8;
  cursor: pointer;
}
</style>
<script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/31001.js"></script>
<!-- Регулировка размера шрифта в постах © Alex_63 -->

Цветовыделение Ников по группам

Код:

<!-- Цветовыделение Ников по группам // V.3 -->
<script type="text/javascript">
var groupColors ={
//ID группы  //Цвет
          1 : 'teal',
          2 : 'purple',
          3 : 'gray'  //Последний элемент без запятой
};
</script>
<script type="text/javascript" src="https://forumstatic.ru/files/0015/c4/3f/30024.js"></script>
<!-- END Цветовыделение Ников по группам // V.3 -->

Запятая после ника

Код:

<!-- запятая после ника -->
<script type="text/javascript">
function to(username)
{insert('[b]' + username + '[/b]' + ', ');}
</script>
<!-- запятая после ника -->

Аватарка в строке приветствия

Код:

<!-- Аватарка в строке приветствия -->
<style>.status_userava>img{width:34px;height:auto;vertical-align:middle;border-radius:4px;margin:-.6em 0}</style>
<script>$('#pun-status>p').prepend('<span class="status_userava"><img src="'+(window.UserAvatar?UserAvatar:'/i/default_avatar.jpg')+'"/></span>')</script>
<!-- Аватарка в строке приветствия -->

Кнопка "Показать пароль" в форме входа

Код:

<!-- // Кнопка "Показать пароль" в форме входа -->
<style>#login label[for=fld16]{margin-left:3px!important;}.pw-wrp{margin:2px 0;}
#Login_Punbb .inputfield:last-child{margin-top:17px!important;}</style>
<script>if($('#pun-login,#Login_Punbb').length)(function(){
var Sp='<span style="display:block" class="pw-wrp"><input type=checkbox id=fld16 style="margin:1px 0 0 0;float:left;"/>\
<label for=fld16 style="font-weight:400">Показать пароль</label></span>';
$('input[name="req_password"]').after(Sp);
$('#fld16,label[for="fld16"]').click(function(){
  if($('#fld16').attr('checked')){$('input[name="req_password"]')[0].type='text';}
  else{$('input[name="req_password"]')[0].type='password';}
});}())
</script>
<!-- // Кнопка "Показать пароль" в форме входа -->

Быстрый переход по разделам форума

Код:

<!-- Быстрый переход по разделам форума © Alex_63 -->
<style>
.quickJump {
  display: none;
  position: absolute;
  background: #f7f7f7;
  color: #333;
  font-size: 11px;
  margin-top: 3px;
  padding: 5px !important;
  border: solid 1px #ccc;
  border-radius: 5px;
}
.openQJump { cursor: pointer; margin-right: 1px; }
.openQJump > img { margin-bottom: -2px; margin-right: 2px; opacity: 1.0; }
.openQJump > img:hover { opacity: 0.8; }
</style>
<!-- Быстрый переход по разделам форума © Alex_63 -->

Добавка ссылки на тему к заголовку поста

Код:

<!--Добавка ссылки на тему к заголовку поста-->
<script type="text/javascript">$(document).trigger("pun_about_ready"); if (typeof ym == 'object') {ym(201230, 'userParams', {UserId:2, is_user:1}); ym(201230, 'params', {forum_id: 1262678});}</script>
<script>
<script type="text/javascript">$(document).trigger("pun_about_ready"); if (typeof ym == 'object') {ym(201230, 'userParams', {UserId:2, is_user:1}); ym(201230, 'params', {forum_id: 1262678});}</script>
<script><!--Добавка ссылки на тему к заголовку поста-->
if($(".punbb").attr("id")=="pun-viewtopic"){
  var s0=$("link[rel='alternate']").attr("href").replace(/^.*id=(\d+)$/igm,"$1");
  var s1="/viewtopic.php?id="+s0;var s2=$(".main h1 span").text();
  var s3='<li class="TopicLnk" style="font-weight:normal;display:inline-block;color:#7c7cc2;"> Тема: <a href="';
  s3+=s1+'">'+s2+'</a></li>';$(".post h3>span a.permalink").each(function(){
  if($(this).parents(".post").hasClass("topicpost")){$(this).after(s3.replace("Re: ",""));
  }else{$(this).after(s3);};});}
</script>
<!--Добавка ссылки на тему к заголовку поста-->

Ссылка "Новые сообщения" на главной странице

Код:

<!-- Рестор (восстановление)  ссылки "Новые сообщения" на главной странице -->
<script type="text/javascript">
    if(GroupID != 3) { $('#pun-ulinks .container').prepend('<li class="item1"><a href="/search.php?action=show_new">Новые сообщения</a></li>'); }
    </script>
    <!-- Рестор (восстановление)  ссылки "Новые сообщения" на главной странице -->

Уменьшение количества кнопок в форме быстрого ответа при мобильном просмотре

Код:

<!-- Уменьшение количества кнопок в форме быстрого ответа при мобильном просмотре -->
<style type="text/css">
@media only screen and (hover: none) and (pointer: coarse){
td#button-font, td#button-size, td#button-indent, td#button-link, td#button-quote, td#button-code, td#button-table, td#button-keyboard {display: none;}
}
</style>
<!-- Уменьшение количества кнопок в форме быстрого ответа при мобильном просмотре -->

Тема закрыта

Страница: 1

ФОРУМ «ГРИБНЫЕ МЕСТА»

Меню навигации

Пользовательские ссылки

Информация о пользователе

Модификация форума

Сообщений 1 страница 3 из 3

Поделиться1Среда, 29 января, 2025г. 18:43:13

Поделиться2Среда, 29 января, 2025г. 18:44:30

Поделиться3Среда, 29 января, 2025г. 18:44:46