Оформление цитаты на vb 3.x от vb 4.x

08-25-2011, 12:22 PM

Оформление цитаты на vb 3.x от vb 4.x [Инструкция от IRIDON]

Источник

На текущий момент вышло два типа оформления цитаты: с скругленными и квадратными краями.

Вариант с квадратными краями:

1. Скачиваем файлы для квадратной цитаты. Заливаем папки misc и buttons в папки своего стиля (если у Вас стиль по умолчанию, то обе папки скидываем в папку images.

2. Находим шаблон bbcode_quote в своем стиле и заменяем его содержимое на:

PHP Code:


			
<div <if condition="$show['iewidthfix']"></if>">
<div style="padding-left:20px;">
<div class="bbcode_container">
  <div class="bbcode_quote">
    <div class="btbtbt">
<div class="quote_container">
            <div class="bbcode_quote_container"></div>
                <div class="bbcode_postedby">
                    <if condition="$show['username']">
        <img title="Цитата" src="$stylevar[imgdir_button]/quote_icon.png" alt="Цитата">
        <phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase>
                        <if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost-right.png" border="0" alt="$vbphrase[view_post]" /></a>
                        </if>
                </div>
          <div class="message">$message</div>
        </div>
            <else />
                $message
            </if>
    </div> 
  </div>
</div>
    </div>
</div>

Сохраняем изменения.

3. Зайти в опцию "Все опции стиля" (админка - Стили и шаблоны - Управление стилями. В выпадающем меню нужного стиля выбрать Все опции стиля и нажать Вперед). Опускаемся в самый низ и в окно "Дополнительные определения CSS" (обычно там два окошка стиля, добавляем во второе) вот это CSS:

Code:

.quote_container {
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
}


div.bbcode_quote div.message {
	padding:8px 0px;
}

.bbcode_container {
	margin-right: 20px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-top: 5px;
	display: block;
}

.bbcode_container div.bbcode_quote {
margin-top: 0pt;
margin-right: 10px;
margin-left: 10px;
margin-bottom: 10px;
background-color: #f2f6f8;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
font-family: Tahoma,Calibri,Verdana,Geneva,sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal;
font-size: 13px;
line-height: normal;
font-size-adjust: none;
font-stretch: normal;
-x-system-font: none;
position: relative;
top: 0pt;
}


.bbcode_quote_container {
background-color: transparent;
background-image: url("images/misc/quote-left.png");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: left center;
display: block;
width: 9px;
height: 13px;
position: absolute;
left: -8px;
}

.bbcode_postedby {
font-family: Tahoma,Calibri,Verdana,Geneva,sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 12px;
line-height: normal;
font-size-adjust: none;
font-stretch: normal;
-x-system-font: none;
}

.bbcode_container div.bbcode_quote div.message {
padding-top: 8px;
padding-right: 0px;
padding-bottom: 8px;
padding-left: 0px;
}

.btbtbt {
border-left:solid 1px;
border-right:solid 1px;
border-bottom:solid 1px;
border-top:solid 1px;
border-color: #417394;
}

Сохраняем изменения.
Все.

Вариант с скругленными краями:

1. Скачиваем файлы для квадратной цитаты. Заливаем папки misc и buttons в папки своего стиля (если у Вас стиль по умолчанию, то обе папки скидываем в папку images.

2. Находим шаблон bbcode_quote в своем стиле и заменяем его содержимое на:

PHP Code:


			
<div <if condition="$show['iewidthfix']"></if>"> 
    <div style="padding-left:20px;"> 
        <div class="bbcode_container"> 
            <div class="bbcode_quote"> 
                <div> 
                    <div class="tl"> 
                        <div class="tr"> 
                            <div class="bord_top"></div> 
                        </div> 
                    </div>  
                </div> 
            <div class="btbtbt"> 
                <div class="quote_container"> 
                    <div class="bbcode_quote_container"></div> 
                        <div class="bbcode_postedby"> 
                            <if condition="$show['username']"> 
                                <img title="$vbphrase[quote]" src="$stylevar[imgdir_button]/quote_icon.png" alt="$vbphrase[quote]"> 
                                <phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase> 
                                    <if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost-right.png" border="0" alt="$vbphrase[view_post]" /></a> 
                                    </if> 
                        </div> 
                    <div class="message">$message</div> 
                </div> 
                            <else />
                        </div>
                $message 
                </div> 
                            </if> 
            </div> 
                <div class="bl"> 
                    <div class="br"><div class="bord_top2"></div></div> 
                    <div class="bord_botom"></div> 
                </div>  
            </div> 
        </div> 
    </div> 
</div>

Сохраняем изменения.

3. Зайти в опцию "Все опции стиля" (админка - Стили и шаблоны - Управление стилями. В выпадающем меню нужного стиля выбрать Все опции стиля и нажать Вперед). Опускаемся в самый низ и в окно "Дополнительные определения CSS" (обычно там два окошка стиля, добавляем во второе) вот это CSS:

Code:

.quote_container {
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
}


div.bbcode_quote div.message {
	padding:8px 0px;
}

.bbcode_container {
	margin-right: 20px;
	margin-bottom: 20px;
	margin-left: 0px;
	margin-top: 5px;
	display: block;
}

.bbcode_container div.bbcode_quote {
margin-top: 0pt;
margin-right: 10px;
margin-left: 10px;

background-color: #f2f6f8;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
font-family: Tahoma,Calibri,Verdana,Geneva,sans-serif;
font-style: italic;
font-variant: normal;
font-weight: normal;
font-size: 13px;
line-height: normal;
font-size-adjust: none;
font-stretch: normal;
-x-system-font: none;
position: relative;
top: 0pt;
}


.bbcode_quote_container {
background-color: transparent;
background-image: url("images/misc/quote-left.png");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: left center;
display: block;
width: 9px;
height: 13px;
position: absolute;
left: -8px;
}

.bbcode_postedby {
font-family: Tahoma,Calibri,Verdana,Geneva,sans-serif;
font-style: normal;
font-variant: normal;
font-weight: normal;
font-size: 12px;
line-height: normal;
font-size-adjust: none;
font-stretch: normal;
-x-system-font: none;
}

.bbcode_container div.bbcode_quote div.message {
padding-top: 8px;
padding-right: 0px;
padding-bottom: 8px;
padding-left: 0px;
}


.tl{
background:url(images/misc/tl_grey.gif) no-repeat left;
height: 10px;

}

.tr{
background:url(images/misc/tr_grey.gif) no-repeat right;
height: 10px;

}

.bl{
background:url(images/misc/bl_grey.gif) no-repeat left bottom;
height: 10px;

}

.br{
background:url(images/misc/br_grey.gif) no-repeat right bottom;
height: 10px;
}

.btbtbt {
border-left:solid 1px;
border-right:solid 1px;
border-color: #417394;
}

.bord_top {
border-top: 1px solid;
border-color:#417394;
margin-left: 10px;
margin-right: 10px;
border-color: #417394;
}

.bord_botom {
border-bottom: 1px solid;
border-color:#417394;
margin-left: 10px;
margin-right: 10px;
}

.bord_top2 {
border-left:1px solid;
border-right: 1px solid;
border-color: #417394;
}

Сохраняем изменения.
Все.

08-26-2011, 03:06 AM

что же у меня цитата так криво?
http://forum.clubvolvo.ru/showthread...18#post1605918

08-26-2011, 11:09 AM

Quote:

Originally Posted by liner

цитата так криво?

liner, если честно, то закругленную проверял только на локалке - вроде, все было Ок

.
На форуме стоит "прямоугольная"...

08-26-2011, 11:40 AM

наблюдение:
создайте в сообщении форума просто текст в цитате, без упоминания автора и ссылки на его цитируемый пост - появится косячок.
В любой цитате, где есть "Сообщение от ....>>" все нормально

08-26-2011, 08:40 PM

Не хватало закрытия 2х <div> кодов...
Собственно, поэтому и кривая простая цитата получается, когда нет в ней "Сообщение от Username".

Рабочий вариант:

PHP Code:


			
<div <if condition="$show['iewidthfix']"></if>"> 

    <div style="padding-left:20px;"> 

        <div class="bbcode_container"> 

            <div class="bbcode_quote"> 

                <div> 

                    <div class="tl"> 

                        <div class="tr"> 

                            <div class="bord_top"></div> 

                        </div> 

                    </div>  

                </div> 

            <div class="btbtbt"> 

                <div class="quote_container"> 

                    <div class="bbcode_quote_container"></div> 

                        <div class="bbcode_postedby"> 

                            <if condition="$show['username']"> 

                                <img title="$vbphrase[quote]" src="$stylevar[imgdir_button]/quote_icon.png" alt="$vbphrase[quote]"> 

                                <phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase> 

                                    <if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost-right.png" border="0" alt="$vbphrase[view_post]" /></a> 

                                    </if> 

                        </div> 

                    <div class="message">$message</div> 

                </div> 

                            <else />

                        </div>

                $message 

                </div> 

                            </if> 

            </div> 

                <div class="bl"> 

                    <div class="br"><div class="bord_top2"></div></div> 

                    <div class="bord_botom"></div> 

                </div>  

            </div> 

        </div> 

    </div> 

</div>

08-27-2011, 12:38 AM

спасибо, помогло

08-27-2011, 12:18 PM

Quote:

Originally Posted by liner

помогло

Поправил пост #1

01-10-2014, 02:17 PM

У меня по чему то вот так все (((

Прошу прощения из за не стандартного стиля нужно было поправить путь до загруженных изображений