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

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

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 - красненькие или зелененькие.
Ссылка на комментарий
Поделиться на других сайтах

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

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

Гость
Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Ответить в этой теме...

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

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

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

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

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

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

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

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

  Согласен