Перейти к публикации
Дизайн и модификация IPS Community IPBSkinsBETA
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...
RPSVoloch

Редактирование дефолтной структуры

Автор: RPSVoloch, в Скины IPB 3.x

Рекомендованные сообщения

Fisana    700

Fisana
04/04/10 08:21

Выложить просто.

Есть файловый архив – http://ipbskins.ru/forum/files/

Add File, указать категорию, сделать нормальное описание, добавить скриншот (в самом низу).

Создастся тема поддержки автоматически.

Вручную выведу анонс на две страницы сайта.

Картинкой – http://ipbskins.ru/free.html

Картинкой с описанием и ссылкой с указанием Вашего авторства обязательно. http://ipbskins.ru/free/ipb3/

Еще выведу в новости. Также могу отрекламить на ipb-ru.net. Только тогда его заметят.

 

А в этой теме скин никто не найдет. Народ пассивен и нелюбознателен, хочет кормежки из ложечки.

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/18/10 11:17 (изменено)

Приветствую, у меня случилась проблема, переделываю стандартный шаблон под себя, и у меня возникла проблема при изменении оформления maintitle.

 

4.png

 

Код в css:

 

.cat_base{
background: transparent url(http://ipbskins.ru/forum/public/style_images/ipbskins/cat_bg.png);
       height: 28px;
       width: 100%
       margin: 0;
       padding:0;
overflow: hidden;

}
   body .cat_base a {
               color: #fff;
               font-family: tahoma, arial;
               font-size: 14px;
               padding-left: 5px;
   }


.cat_left{
background: url(http://ipbskins.ru/forum/public/style_images/ipbskins/cat_left.png) 0 0 no-repeat;
       height:28px;
       padding:0;
       margin:0;
}

.cat_right{
background: url(http://ipbskins.ru/forum/public/style_images/ipbskins/cat_right.png) 100% 0 no-repeat;
       height:28px;
       padding:0;
       margin:0;
}

 

Код в boardIndexTemplate:

 


         <div class='cat_base'>
           <div class='cat_left'>
             <div class='cat_right'>
					<h3 id='category_{$_data['cat_data']['id']}'><a class='toggle right' href='#' title="{$this->lang->words['toggle_cat']}">{$this->lang->words['toggle_cat']}</a> <a href="{parse url="showforum={$_data['cat_data']['id']}" seotitle="{$_data['cat_data']['name_seo']}" template="showforum" base="public"}" title='{$this->lang->words['view_cat']}'>{$_data['cat_data']['name']}</a></h3>
             </div>
           </div>
         </div>

 

Помогите сделать закругленными углы, я знаю что вылазит класс cat_base, но как сделать чтобы не вылазил?

Пробовал и ваш код, который на первой странице.

 

И ещё один вопрос, как сделать такой же бордер как в вашем шаблоне Black Sea?

 

3.png

2.png

 

Код в css:

 

.corner-right{
background: transparent url({style_images_url}/r.png) repeat-y right;
padding-right: 8px;
        margin: 0px;
}


.corner-left{
background: url({style_images_url}/l.png) repeat-y left;
padding-left: 8px;
        margin: 0px;
}
.top-left{
   padding:0;
   margin:0;
   background: url({style_images_url}/tl.png) 0 0 no-repeat;
   height:20px;
}

.top-right{
   padding:0;
   margin:0;
   background: url({style_images_url}/tr.png) 100% 0 no-repeat;
   height:20px;
}

.top{
   padding:0;
   margin:0 20px;
   background: url({style_images_url}/t.png) repeat-x;
   height:20px;
}

.bottom-left{
   padding:0;
   margin:0;
   background:url({style_images_url}/bl.png) 0 0 no-repeat;
   height:30px;
}
.bottom-right{
   padding:0;
   margin:0;
   background: url({style_images_url}/br.png) 100% 0 no-repeat;
   height:30px;
}

.bottom{
   padding:0;
   margin:0 20px;
   background: url({style_images_url}/b.png) repeat-x;
   height: 30px;
}

 

Как я понял за вывод этих классов отвечают:

 

{parse replacement="top"}

и 

{parse replacement="bot"}

 

Так вот, я не пойму, где редактируется последнее, просто я хочу сделать так же, только в моём шаблоне.

Изменено пользователем Axibas

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/18/10 11:38

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

Или сделать cat_base без фона, а класс с фоном назначить для h3 (или другого внутреннего)

 

А в этом шаблоне еще присутствует внешний контур у блоков. Его убирать надо везде.

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/18/10 11:41 (изменено)

А в этом шаблоне еще присутствует внешний контур у блоков. Его убирать надо везде.

Если можно по подробнее.

 

Посмотрите я обновил своё первое сообщение, добавил вопрос.

 

UPD:

 

Первый вопрос решён, сохранил картинки в .jpg, да и весить стали меньше, и проблема решена.

Остался второй вопрос.

Изменено пользователем Axibas

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/18/10 13:12

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

В дефолтном контуров у блоков практически нет....

 

Код html для рамки я вынесла в макросы – в top и bot. В шаблоне есть только переменные для обращения к макросам.

Но можно прописать и в шаблоне. Разницы нет.

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/18/10 13:18

Код html для рамки я вынесла в макросы – в top и bot. В шаблоне есть только переменные для обращения к макросам.

Но можно прописать и в шаблоне. Разницы нет.

Пример можно?

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/18/10 13:35

Просто откройте макросы и кодом, что содержит макрос с названием 'top', замените в шаблоне строчку {parse replacement="top"}

  • Upvote 1

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/20/10 20:38 (изменено)

В общем у меня опять появились вопросы, и думаю будет ещё не один, начну по порядку.

 

1. Сделал оформление блока "Последние обновление статусов", не знаю почему, но начал с него.

Выглядит он так:

 

2.png

 

Но проблема в том, что он не сворачивается, хотя нижние блоки сворачиваются. Не знаю может я где то допустил ошибку, и просто я её не замечаю или сделал не так.

Вот код:

 

 

<div class="sidebar_t">
 <div class="sidebar_tl">
   <div class="sidebar_tr">
     <h3 class="sidebar_text"><img src='{$this->settings['img_url']}/user_comment.png' alt='' /> {$this->lang->words['recent_status_updates']} </h3>
   </div>
 </div>
</div>
<div class="sidebar_l">
 <div class="sidebar_r">
   <script type='text/javascript' src='{$this->settings['public_dir']}js/ips.status.js'></script>
   {parse striping="recent_status" classes="row1,row2"}
   <div class='sidebar_wrapper'>
     <div class='clearfix' id='statusHook'>
       <div class='_sbcollapsable'>
         <if test="canCreate:|:$this->registry->getClass('memberStatus')->canCreate( $this->memberData )">
           <div class='status_update row2 altrow'>
             <input type='text' id='statusUpdate' style='width:80%'>
             <input type='submit' class='input_submit' id='statusSubmit' value='{$this->lang->words['_rarr']}' />
             <if test="update:|:(IPSLib::twitter_enabled() OR IPSLib::fbc_enabled() ) AND ( $this->memberData['fb_uid'] OR $this->memberData['twitter_id'] )">
               <p class='desc' style='padding-top:5px;'>{$this->lang->words['st_update']}
                 <if test="updateTwitter:|:IPSLib::twitter_enabled() AND ( $this->memberData['twitter_id'] )">
                   <input type='checkbox' id='su_Twitter' value='1' name='su_Twitter' />
                   <img src="{$this->settings['public_dir']}style_status/twitter.png" style='vertical-align:top' alt='' /></if>
                 <if test="updateFacebook:|:IPSLib::fbc_enabled() AND ( $this->memberData['fb_uid'] )"> 
                   <input type='checkbox' id='su_Facebook' value='1' name='su_Facebook' />
                   <img src="{$this->settings['public_dir']}style_status/facebook.png" style='vertical-align:top' alt='' /></if>
               </p>
             </if>
           </div>
         </if>
         <div id="status_wrapper">
           <if test="hasUpdates:|:count( $updates )"> {parse template="statusUpdates" group="profile" params="$updates, 1, 1"}
             <else />
             <p>{$this->lang->words['status_updates_none']}</p>
           </if>
           <div class="status_main_content" style='text-align:right;padding:4px'> <a class='desc' href='{parse url="app=members&module=profile&section=status&member_id={$member['member_id']}" seotitle="true" template="members_status_all" base="public"}'>{$this->lang->words['viewallupdates']} {$this->lang->words['_rarr']}</a> </div>
         </div>
       </div>
     </div>
   </div>
 </div>
</div>
<div class="sidebar_b">
 <div class="sidebar_bl">
   <div class="sidebar_br"></div>
 </div>
</div>
<div class="sidebar_gap"></div>

 

 

 

2. Как сделать так, чтобы внизу по середине была картинка этого блока, а точнее тут:

 

12.png

 

У меня за низ этого блока отвечает такой код css, там есть закомментированный участок кода, которым я пытался сделать вывод картинки.

 

/* SIDEBAR FOOTERS */

.sidebar_bl { 
background: transparent url({style_images_url}/sidebar_images/sidebar_bl.png) 0 0 no-repeat;
padding-left: 5px; 
margin: 0; 
height: 6px; 
}

.sidebar_br { 
background: transparent url({style_images_url}/sidebar_images/sidebar_br.png) 100% 0 no-repeat;
	padding-right: 5px;
margin: 0;
	height: 6px; 
}

.sidebar_b { 
background: transparent url({style_images_url}/sidebar_images/sidebar_b.png) repeat-x; 
margin: 0px; 
height: 6px; 
}

/*body .sidebar_b { 
background: url({style_images_url}/sidebar_images/sidebar_bottom.png) 50% 0 no-repeat;
       float: center;
       padding: 0px 0px 0 0px;
margin: 0px; 
height: 13px;
       display: block;
}*/

 

В идеале, в готовом варианте должно выглядеть так:

 

112.png

Изменено пользователем Axibas

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/20/10 21:06

1. Чтобы блок сворачивался в этом варианте верстки придется h3 выносить наружу, а не оборачивать слоями div

То есть придется все декоративные div загонять внутрь

Иначе js не понимает.

2. Ну и верстайте низ внутри блока с general_box. Только его придется сделать прозрачным и без контура.

А если снаружи, то margin нижний убирать придется и придумывать другой вариант отступа

  • Upvote 1

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/20/10 21:13 (изменено)

Хе хе) Вот разработчики подложили свинью)

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

Заставить бы, чтобы в дивах скрипт работать... Эх.. Мечты мечты...)

Изменено пользователем Axibas

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/20/10 21:15

Я обновляла клиентский скин и тоже с этим столкнулась. Ну ничего, использовала h3 вместо наружного дива...

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/20/10 21:16

Пример можно? Просто очень интересно.)

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/20/10 21:26

http://forum.kerch.com.ua/

 

Обновляла с 3.0.5 до 3.1.1

В 3.0.5 не было сворачиваний в сайдбаре

Поделиться сообщением

Ссылка на сообщение

Lesovsky    150

Lesovsky
07/20/10 23:26

http://forum.kerch.com.ua/

 

Обновляла с 3.0.5 до 3.1.1

В 3.0.5 не было сворачиваний в сайдбаре

Приятный дизайн.)

Но к сожалению, я не спрашивал пример как это выглядит, а как сделать.)

Не ну конечно можно понапихать классов:

 

<h3 class='sidebar_t sidebar_tl sidebar_tr'>

 

Но думаю это не слишком хорошо.

 

И по путный вопрос, как переместить центр статистики за пределы.

 

112.png

 

Просто, я знаю, что код его находится в boardIndexTemplate, но как же его сделать не зависимым, если у меня вывод контента в том числе и вывод boardIndexTemplate стоит в:

 

<!-- CONTENT -->
<div id="corner">
<div class="top-left">
 <div class="top-right">
   <div class="top"> </div>
 </div>
</div>
<div class="corner-left">
 <div class="corner-right">
   <div id='ipbwrapper2'> <a id='j_content'></a> {$items['adHeaderCode']}
     <if test="mainpageContent:|:$html">{$html}</if>
     {$items['adFooterCode']} <br class='clear' />
   </div>
 </div>
</div>
<div class="bottom-left">
 <div class="bottom-right">
   <div class="bottom"> </div>
 </div>
</div>
<!-- CONTENT -->

 

Честно, у меня нет соображений как сделать, чтобы центр статистики был за пределами...

Поделиться сообщением

Ссылка на сообщение

Fisana    700

Fisana
07/20/10 23:42

1. Я сказала как сделать. Задать h3 в сайдбаре свойства внешнего div, который Вы используете. Сделать это можно по-разному. Я не знаю тонкостей Вашей верстки. Грубо задав свойства можно испортить другие заголовки с h3 уже не в сайдбаре. Поэтому можно дать только направление для экспериментов, но не готовое решение.

2. Статистику не вытащить, потому что она находится в шаблонах группы Board Index, а не в глобальных.

В глобальных прописывается тег content, который заменяется содержанием из других групп, в частности, Board Index.

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

Внутренние элементы наружными не сделать. Это то же самое, что стать отцом своей матери :)

  • Upvote 1

Поделиться сообщением

Ссылка на сообщение

Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
Перейти к списку тем

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу.

×
  • RU
×
  • Создать...