Перейти к контенту

"Полутекстовый скин"

Fisana

Автор: Fisana,
в Модификации в разработке

 Поделиться

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

Fisana

Fisana

Опубликовано
Опубликовано

Разработано пока для версии 1.3.

Суть:

Назначение текстовым кнопкам определенных классов css (существующих или вновь созданных на их основе) + изменения в шаблонах.

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

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

post-20188-1129074208_thumb.jpg

(цветом с полосочкой показана кнопка, на которую наведен курсор)

post-20188-1129074343_thumb.jpg

На основе maintitle созданы новые классы css (привожу свои, сделаете по аналогии):

.maintitle3 { 
background-color: #b2ab93;
vertical-align: middle;
border-bottom: 3px solid #655c45; 
border-top: 1px solid #8b826a;
border-left: 1px solid #8b826a;
border-right: 4px solid #8b826a;
font-weight: bold; 
padding: 3px 0px 3px 2px; 
margin-left: 5px; 
margin-right: 3px; color: #f9f9f7; 
}
.maintitle3 a:link, .maintitle3  a:visited, .maintitle3  a:active { 
text-decoration: none; 
color: #f9f9f7; 
border-left: 4px solid #b2ab93; 
}
.maintitle3 a:hover { 
background-color: #97aa75;
border-top: 0px solid #e3dfd2;
border-left: 4px solid #ffe622;
padding: 3px 1px 3px 3px;
text-decoration: none; 
}


.maintitle4 { 
background-color: #b1a78f; 
vertical-align: middle; 
font-weight: bold; 
padding: 5px 0px 5px 5px; 
color: #f9f9f7; 
}
.maintitle4 a:link, .maintitle4  a:visited, .maintitle4  a:active { 
text-decoration: none; 
color: #f9f9f7; 
}
.maintitle4 a:hover { 
text-decoration: none; 
}
.maintitle5 { 
vertical-align: middle;
background-color: #ddded9;
border-bottom: 1px solid #9d9e97;
border-right: 1px solid #bdbeb8;
border-top: 1px solid #ddded9;
border-left: 1px solid #ddded9; 
font-weight: bold; 
padding: 3px 3px 3px 2px; 
color: #655c45; 
}
.maintitle5 a:link, .maintitle4 a:visited, .maintitle4 a:active { 
text-decoration: none; 
color: #655c45; border: 0; 
}
.maintitle5 a:hover { 
background-color: #97aa75;
border-top: 0;
padding: 3px 1px 3px 3px;
text-decoration: none; 
}

Изменения в шаблонах:

skin_forum.php

Найти: 

<tr>
<td align='left' width="20%" nowrap="nowrap">{$data['SHOW_PAGES']}</td>
<td align='right' width="80%"><a href='{$ibforums->base_url}act=Post&CODE=00&f={$data['id']}'><{A_POST}></a>{$data[POLL_BUTTON]}</td>
</tr>

Заменить на:

<tr>
<td align='left' width="75%" nowrap="nowrap">{$data['SHOW_PAGES']}</td>

<td align='center' width=auto nowrap="nowrap"></td>
<td align='center' width="10%" class='maintitle3' ><a href='{ibf.script_url}act=Post&CODE=00&f={$data['id']}'><{A_POST}></a></td>

<td align='center' width="1%" nowrap="nowrap"></td>

<td align='center' width="12%" class='maintitle3' >{$data[POLL_BUTTON]}</td>

</tr>

Найти:

<tr>
<td align='left' width="20%" nowrap="nowrap">{$data['SHOW_PAGES']}</td> 
<td align='right' width="80%"><a href='{$ibforums->base_url}act=Post&CODE=00&f={$data['id']}'><{A_POST}></a>{$data[POLL_BUTTON]}</td> 
</tr>

Заменить на:

<tr>
<td align='left' width="75%" nowrap="nowrap">{$data['SHOW_PAGES']}</td>

<td align='center' width=auto nowrap="nowrap"></td> 
<td align='center' width="10%" class='maintitle3' ><a href='{ibf.script_url}act=Post&CODE=00&f={$data['id']}'><{A_POST}></a></td> 
<td align='center' width="1%" nowrap="nowrap"></td>
<td align='center' width="12%" class='maintitle3' >{$data[POLL_BUTTON]}</td> 
</tr>

skin_topic.php

Найти: 

<tr>
<td align='left' width="20%" nowrap="nowrap">{$data['TOPIC']['SHOW_PAGES']} {$data['TOPIC']['go_new']}</td>
<td align='right' width="80%">{$data[TOPIC][REPLY_BUTTON]}<a href='{$ibforums->base_url}act=Post&CODE=00&f={$data[FORUM]['id']}' title='{$ibforums->lang['start_new_topic']}'><{A_POST}></a>{$data[TOPIC][POLL_BUTTON]}</td>
</tr>

Заменить на:

<tr>
<td align='left' width=auto nowrap="nowrap">{$data['TOPIC']['SHOW_PAGES']} {$data['TOPIC']['go_new']}</td>
<td align='center' width="8%" class='maintitle3' >{$data[TOPIC][REPLY_BUTTON]}</td>
<td align='center' width="1%" nowrap="nowrap"></td>
<td align='center' width="10%" class='maintitle3' ><a href='{ibf.script_url}act=Post&CODE=00&f={$data[FORUM]['id']}' title='{ibf.lang.start_new_topic}'><{A_POST}></a></td>
<td align='center' width="1%" nowrap="nowrap"></td>
<td align='center' width="12%" class='maintitle3' >{$data[TOPIC][POLL_BUTTON]}</td>
</tr>

Найти:

<!-- REPORT / DELETE / EDIT / QUOTE DIV -->

Ниже:

<div align='right'>
{$post['report_link']}{$post['delete_button']}{$post['edit_button']}<a href='{$ibforums->base_url}act=Post&CODE=06&f={$ibforums->input[f]}&t={$ibforums->input[t]}&p={$post['pid']}'><{P_QUOTE}></a>
</div>

Заменить на:

<div align='right' class='maintitle3' style='float:right; width:auto'>
{$post['report_link']}{$post['delete_button']}{$post['edit_button']}<a href='{ibf.script_url}act=Post&CODE=06&f={$ibforums->input[f]}&t={$ibforums->input[t]}&p={$post['pid']}'><{P_QUOTE}></a> 
</div>

Найти:

<!-- PM / EMAIL / WWW / MSGR -->

Ниже 

<div align='left' class='darkrow3' style='float:left;width:auto'>
{$author['addresscard']}{$author['message_icon']}{$author['email_icon']}{$author['website_icon']}{$author['integ_icon']}{$author['icq_icon']}{$author['aol_icon']}{$author['yahoo_icon']}{$author['msn_icon']}
</div>

Заменить на:

<div align='left' class='maintitle4' style='float:left;width:auto'>
 {$author['addresscard']}{$author['message_icon']}
{$author['email_icon']}{$author['website_icon']}
{$author['integ_icon']}
{$author['icq_icon']}{$author['aol_icon']}{$author['yahoo_icon']}
{$author['msn_icon']} </div>

Найти:

<tr>
<td align='left' width="20%" nowrap="nowrap"><!--IBF.TOPIC_OPTIONS_CLOSED-->{$data[TOPIC][SHOW_PAGES]}</td>
<td align='right' width="80%">{$data[TOPIC][REPLY_BUTTON]}<!--IBF.QUICK_REPLY_CLOSED--><a href='{$ibforums->base_url}act=Post&CODE=00&f={$data[FORUM]['id']}' title='{$ibforums->lang['start_new_topic']}'><{A_POST}></a>{$data[TOPIC][POLL_BUTTON]}</td>
</tr>

Заменить на:

<tr>
<td align='center' width="11%" class='maintitle3'><!--IBF.TOPIC_OPTIONS_CLOSED--></td>
<td align='center' width="1%" nowrap="nowrap"></td>
<td align='center' width=auto nowrap="nowrap">{$data[TOPIC][SHOW_PAGES]}</td>
<td align='center' width="40%" nowrap="nowrap"></td>
<td align='center' width=auto nowrap="nowrap"></td>
<td align='center' width="8%" class='maintitle3' >{$data[TOPIC][REPLY_BUTTON]}</td>
<td align='center' width="1%" nowrap="nowrap"></td>
<!--IBF.QUICK_REPLY_CLOSED-->
<td align='center' width="11%" class='maintitle3'><a href='{ibf.script_url}act=Post&CODE=00&f={$data[FORUM]['id']}' title='{ibf.lang.start_new_topic}'><{A_POST}></a></td>
<td align='center' width="1%" nowrap="nowrap"></td>
<td align='center' width="13%" class='maintitle3' >{$data[TOPIC][POLL_BUTTON]}</td>
</tr>

..............................

Закончили со skin_topic.php

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано

skin_online.php

Найти:

<td class='row1' align='center'>{$session['msg_icon']}</td>

Заменить на:

<td class='maintitle5' align='center'>{$session['msg_icon']}</td>

 

skin_mlist.php

Найти:

<td class='row2' align="center">{$member['member_email']}</td>
<td class='row2' align="center">{$member['aim_name']}</td>
<td class='row2' align="center">{$member['icq_number']}</td>
<td class='row2' align="center">{$member['camera']}</td>
</tr>

Заменить на:

<td class='maintitle5' align="center" width="7%">{$member['member_email']}</td>
<td class='maintitle5' align="center" width=auto>{$member['aim_name']}</td>
<td class='maintitle5' align="center" width=auto>{$member['icq_number']}</td>
<td class='row2' align="center">{$member['camera']} </td>
</tr>

[1129076244:1129076499]skin_stats.php

Найти:

<td align='center' class='row1' valign='middle'>{$info['location']}</td>
<td align='center' class='row1' valign='middle'>{$info['msg_icon']}</td>

Заменить на:

<td align='center' class='row1' valign='middle'>{$info['location']}</td>
<td align='center' class='maintitle5' valign='middle'>{$info['msg_icon']}</td>

 

skin_msg.php

Найти:

<div align='left' class='darkrow3' style='float:left;'>
{$data['member']['addresscard']}{$data['member']['message_icon']}{$data['member']['email_icon']}{$data['member']['website_icon']}{$data['member']['integ_icon']}{$data['member']['icq_icon']}{$data['member']['aol_icon']}{$data['member']['yahoo_icon']}{$data['member']['msn_icon']}
</div>

Заменить на:

<div align='left' class='maintitle4' style='float:left; width:auto';>
{$data['member']['addresscard']}{$data['member']['message_icon']}{$data['member']['email_icon']}{$data['member']['website_icon']}{$data['member']['integ_icon']}{$data['member']['icq_icon']}{$data['member']['aol_icon']}{$data['member']['yahoo_icon']}{$data['member']['msn_icon']}
</div>

[1129076499:1129076655]Если вы хотите в текстовых кнопках использовать не цвета, а градиенты, это тоже сработает, только в этом случае уберите border.

Ссылка на комментарий
Поделиться на других сайтах
=SPiRiT=

=SPiRiT=

Опубликовано
Опубликовано

Достаточно интересная задумка!

умаю пойдет для установки скина в качестве дополнительного - для тех, кто экономит траффик! :D

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано
И забыло написать, в макросах, естественно, нужно произвести изменения аналогичные таковым в настоящих текстовых скинах.
Ссылка на комментарий
Поделиться на других сайтах
JaveLiner

JaveLiner

Опубликовано
Опубликовано

У меня на агате.ру ракой стоял на предыдущем форуме.

И частично сейчас (Сейчас форум не мой и я там больше не админ)

Ссылка на комментарий
Поделиться на других сайтах
  • 2 недели спустя...
  • 10 месяцев спустя...
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано (изменено)

Экспериментальный текстовый скин под 2.1

Тестить в текстовом режиме браузеров

test/test

ссылка умерла

Изменено пользователем Fisana
Ссылка на комментарий
Поделиться на других сайтах
replicant

replicant

Опубликовано
Опубликовано

sergeykur Вообще текстовые и полутекстовые скины делаются на коленке за несколько минут, просто начните с замены бекграундов и кнопочек, между прочим их можно ксати перерисовать очень легким gif'ом по весу лишь чуть тяжелее текста и дальше само пойдет как по маслу ... не так это и сложно, ну будет не текстовый, а полутекстовый, но очень легкий скин.

 

Лично для меня гораздо больше проблем с установкой готового скина, чем с правкой уже существующего. Отчасти из-за большого числа индивидуальных особенностей форума.

 

ИМХО много наворотов в текстовом скине только увеличивают вес CSS за счет которого скин может сравняться по массе своей с полутекстовым.

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано (изменено)

>>Вообще текстовые и полутекстовые скины делаются на коленке за несколько минут.

 

А Вы попробуйте на коленке такое сделать и за несколько минут:D

Пример -

Например, отключите графику прямо в этой теме и увидите, как все расползется по швам.

Именно поэтому все текстовые скины и выглядят как набор знаков препинания и тяжело читаются.

 

А теперь загляните в тестовую тему на моем форуме и тоже отключите графику.

Как кнопочки и расползание таблиц?

Его нет. А кнопки не отличимы от графических.

Вес css и html пытаюсь сократить. Решения придумываю всякие..

Не все решила, поэтому и выпустила пока бету.

Изменено пользователем Fisana
Ссылка на комментарий
Поделиться на других сайтах
Chrno

Chrno

Опубликовано
Опубликовано (изменено)

Хачу, хачу, хачу такой скин! :D

Итак:

1. При переходе по ссылке Файловый архив - бага с отображением меток прочитанное-непрочитанное, видимо макросы тут не прописаны.

2. Расширенная форма ответа. Бага с ссылками на элементы форматирования (текстовые кнопочки надо делать), расползание отображения.

3. Новая тема. Аналогично.

4. Новое письмо. Аналогично.

5. Личные данные -> Изменить подпись. Аналогично.

Хватит на первое время? ;)

Изменено пользователем Chrno
Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано

1. Файловый архив - это отдельно. Я не могу скин под все модули, что у меня на форуме, настраивать.

2. Знаю. Если получится, сделаю. Пока что там ничего не трогала. Но если не выйдет заменить, то альты так и будут из форума длиннющими хвататься.

3,4,5=2. Новая тема = новое письмо = изменить подпись = форма ответа. Редактор там один и правится только один фрагмент.

+ У меня на форуме редактор заужен под скин по умочанию..

Спасибо за помощь :D

Буду пробовать править.

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

RSS прямо с переменной в макрос засунула.

Макрос кривой, не правится даже, только удаляется..

Но кнопка работает ;)

 

В общем основная проблема - мультицитата.

Вывести текстовую кнопку могу, заставить работать - нет.

Впрочем, в любых скинах она в текстовом режиме нефункциональна.

 

Править под цитату ява-скрипт форума - непрактично, так как это не в скине +, самое главное, маловероятно, что такой скин будет у народа единственным на форуме. А скрипт скопом работает..

И не очень я с явой умею еще.. Только один скрипт поправила чудом (так как методом тыка).

То есть скрипт бы в скин отдельно вынести.

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

Ссылка на комментарий
Поделиться на других сайтах
Chrno

Chrno

Опубликовано
Опубликовано
В общем основная проблема - мультицитата.

Вывести текстовую кнопку могу, заставить работать - нет.

Впрочем, в любых скинах она в текстовом режиме нефункциональна.

Бог с ней. Ни я, ни мои знакомые эту фичу не любят. Слишком она ненаглядная. Я ставлю на форум хак "Quick quote в стиле multiquote".

 

Вспомнил еще одну проблему, сталкивался, когда делал текстовый скин - проверить сейчас не могу. Модерирование темы, выделение постов для модерирования, там флажок по клику хитро закрашивался джава-скриптом (картинка менялась), в тексте у меня реализовать не получилось, как у тебя?

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано

У меня этотоже не вышло.

Билась долго, пыталась в скинах прописать макрос вместо имиджа. Там, кроме темы, в skin_topic например, еще два фрагмента html отвечают за смену кнопки.. Также, как и за цитату.

Максимум что, удалось, как и с цитатой, это вывести кнопку.

Но переключения не происходит.

В итоге вернула графический вид (

Вот рейтинг дался проще. В шаблоне renderrow внизу в скрипте заменила путь к картинкам макросами, а во фрагменте рейтенга, что показывает его на майнтитле, циферкой с оформлением..

Ссылка на комментарий
Поделиться на других сайтах
GLeNN

GLeNN

Опубликовано
Опубликовано

Рейтинг там же легко все

У меня не вышло только мультицитата и модерирование темы. остальное все работает

 

http://q1p.org/ibres_scrin_rvr.JPG

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано

Вот и у меня не вышло то же, что и у Вас.

А галочки, что при регистрации вылазят, смогли заменить?

Ссылка на комментарий
Поделиться на других сайтах
Fisana

Fisana

Опубликовано
  • Автор
Опубликовано
Когда регистрируешься и отвечаешь на вопросы, галочки выскакивают в 2.1 - красненькие или зелененькие.
Ссылка на комментарий
Поделиться на других сайтах

Присоединиться к обсуждению

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

Гость
Ответить в этой теме...

×   Вы вставили отформатированный текст.   Удалить форматирование

  Допустимо не более 75 смайлов.

×   Ваша ссылка была автоматически заменена на медиа-контент.   Отображать как ссылку

×   Ваши публикации восстановлены.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

Зарузка...
×
 Поделиться
Перейти к списку тем
×
×
  • Создать...

Важная информация

Находясь на нашем сайте, вы соглашаетесь на использование файлов cookie, а также с нашим положением о конфиденциальности Политика конфиденциальности и пользовательским соглашением Условия использования.

  Согласен