Jump to content

Tutorials

13 files

  1. Перестройка формы регистрации (2.1.x)

    Перестройка формы регистрации (2.1.x)
     
    Решение для узких скинов на стандартных шаблонах (без "круглых" майнтитлов и т.д).
    Рекомендуется использовать, если список часовых поясов ломает форму и портит дизайн.
    Открыть skin register --> ShowForm
    Заменить код новым:

    <script type="text/javascript"> <!-- var ipb_lang_js_blanks = "{ipb.lang['js_blanks']}"; var ipb_lang_js_no_check = "{ipb.lang['js_no_check']}"; var subsdesc_0 = "{ipb.lang['subsm_no_desc']}"; var subdesc = new Array(); <!--{SUBS.JSCRIPT}--> var register_method = "{ipb.vars['converge_login_method']}"; --> </script> <script type="text/javascript" src="jscripts/ipb_register.js"></script> <form action="{ipb.vars['board_url']}/index.{ipb.vars['php_ext']}" method="post" name="REG" onsubmit="return validate_reg_form(event)"> <input type="hidden" name="act" value="Reg" /> <input type="hidden" name="termsread" value="1" /> <input type="hidden" name="agree_to_terms" value="1" /> <input type="hidden" name="CODE" value="02" /> <input type="hidden" name="coppa_user" value="{$data['coppa_user']}" /> <div class="borderwrap"> <div class="maintitle"><{CAT_IMG}> {ipb.lang['registration_form']}</div> <div class="formsubtitle">{$data['TEXT']}</div> <div class="tablepad"> <table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td> <fieldset> <legend>{ipb.lang['op_tz_title']}</legend> <div class="desc">{ipb.lang['op_tz_text']}</div><br /> <!--{TIME_ZONE}--><br /><br /> <!--<input type="checkbox" name="dst" value="1" class="checkbox" <!--[dst.checked]--> />{ipb.lang['op_tz_dst']}<br />--> </fieldset> </td> </tr> </table> <table class='ipbtable' cellspacing="0"> <tr> <td width="50%"> <fieldset class="row3"> <legend><b>{ipb.lang['user_name_title']}</b></legend> <if="ipb.vars['converge_login_method'] == 'username'"> <div class='input-warn-content' id='box-name'><div id='msg-name'>{$errors['username']}</div></div> <table class='ipbtable' cellspacing="0"> <tr> <td>{ipb.lang['user_name']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['user_name_text']}">?</a>)</span></td> </tr> <tr> <td> <input type="text" size="50" maxlength="64" value="{ipb.input['UserName']}" id='reg-name' name="UserName" /> <img id='img-name' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' /> </td> </tr> </table> </if> <if="ipb.vars['auth_allow_dnames'] == 1 OR ipb.vars['converge_login_method'] == 'email'"> <div class='input-warn-content' id='box-dname'><div id='msg-dname'>{$errors['dname']}</div></div> <table class='ipbtable' cellspacing="0"> <tr> <td>{ipb.lang['dname_name']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['dname_text']}">?</a>)</span></td> </tr> <tr> <td> <input type="text" size="50" maxlength="64" value="{ipb.input['members_display_name']}" id='reg-members-display-name' name="members_display_name" /> <img id='img-members-display-name' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' /> </td> </tr> </table> </if> </fieldset><br /> <fieldset class="row3"> <div class='input-warn-content' id='box-password'><div id='msg-password'>{$errors['password']}</div></div> <legend><b>{ipb.lang['password_title']}</b></legend> <table class='ipbtable' cellspacing="0"> <tr> <td width="1%" nowrap="nowrap">{ipb.lang['password']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['password_text']}">?</a>)</span></td> <td width="100%">{ipb.lang['password_confirm']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['password_confirm_text']}">?</a>)</span></td> </tr> <tr> <td><input type="password" size="25" maxlength="32" value="{ipb.input['PassWord']}" id='reg-password' name="PassWord" /></td> <td><input type="password" size="25" maxlength="32" value="{ipb.input['PassWord_Check']}" id='reg-password-check' name="PassWord_Check" /></td> <td width='12'> <img id='img-password' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' /> </td> </tr> </table> </fieldset><br /> <fieldset class="row3"> <div class='input-warn-content' id='box-emailaddress'><div id='msg-emailaddress'>{$errors['email']}</div></div> <legend><b>{ipb.lang['email_address_title']}</b></legend> <table class='ipbtable' cellspacing="0"> <tr> <td width="1%" nowrap="nowrap">{ipb.lang['email_address']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['email_address_text']}">?</a>)</span></td> <td width="100%">{ipb.lang['email_address_confirm']}  <span>(<a href="#" style="cursor: help; color: #555;" title="{ipb.lang['email_address_confirm_text']}">?</a>)</span></td> </tr> <tr> <td><input type="text" size="25" maxlength="150" value="{ipb.input['EmailAddress']}" id='reg-emailaddress' name="EmailAddress" /></td> <td><input type="text" size="25" maxlength="150" value="{ipb.input['EmailAddress_two']}" id='reg-emailaddress-two' name="EmailAddress_two" /></td> <td width='12'> <img id='img-emailaddress' src="{ipb.vars['img_url']}/spacer.gif" alt="" width='12' height='12' /> </td> </tr> </table> </fieldset> <!--{REQUIRED.FIELDS}--> <!--{SUBS.MANAGER}--> <!--IBF.MODULES.EXTRA--> </td> <td width="50%" valign="top"> <div> <b>{ipb.lang['cf_optional']}</b><br /><br /> <table class='ipbtable' cellspacing="0"> <tr> <td> <fieldset> <legend>{ipb.lang['op_email_title']}</legend> <div class="desc">{ipb.lang['op_email_text']}</div><br /> <input type="checkbox" name="allow_admin_mail" value="1" class="checkbox" <!--[admin.checked]--> /> {ipb.lang['op_email_ad']}<br /> <input type="checkbox" name="allow_member_mail" value="1" class="checkbox" <!--[member.checked]--> /> {ipb.lang['op_email_mem']} </fieldset><br /> <!--{OPTIONAL.FIELDS}--> </td> </tr> <tr> <td><!--{REG.ANTISPAM}--></td> </tr> </table> </div> </td> </tr> <tr> <td valign="middle" align="center"> <div class="desc">{ipb.lang['submit_text']}</div><br /> <input type="submit" value="{ipb.lang['submit_form']} > >" /> </div> </td> </tr> </table> </div> </div> </form> <script type="text/javascript"> //<![CDATA[ reg_error_no_name = "{ipb.lang['reg_error_no_name']}"; reg_error_no_pass = "{ipb.lang['reg_error_no_pass']}"; reg_error_pass_nm = "{ipb.lang['reg_error_pass_nm']}"; reg_error_chars = "{ipb.lang['reg_error_chars']}"; reg_error_taken = "{ipb.lang['reg_error_taken']}"; reg_error_username_taken = "{ipb.lang['reg_error_username_taken']}"; reg_error_username_none = "{ipb.lang['reg_error_username_none']}"; reg_error_email_missing = "{ipb.lang['reg_error_email_missing']}"; reg_error_email_nm = "{ipb.lang['reg_error_email_nm']}"; reg_error_email_taken = "{ipb.lang['reg_error_email_taken']}"; reg_error_email_ban = "{ipb.lang['reg_error_email_ban']}"; var got_dname = 0; <if="ipb.vars['auth_allow_dnames'] == 1 OR ipb.vars['converge_login_method'] == 'email'"> got_dname = 1; </if> init_reg_form(got_dname, register_method); //]]> </script>
    Теперь откройте фрагмент - skin register -->bot_antispam_gd
    Замените код этим:

    <br /> <input type="hidden" name="regid" value="$regid" /> <fieldset class="row3"> <legend><b>{ipb.lang['las_title']}</b></legend> <table class='ipbtable' cellspacing="0"> <tr> <td width="1%" align="center"> {ipb.lang['las_input']}<div class="desc">{ipb.lang['las_input_text']}</div> <input type="text" size="25" maxlength="32" name="reg_code" /> </td></tr> <tr> <td align="center"><img src="{ipb.script_url}act=Reg&CODE=image&rc={$regid}" alt="{ipb.lang['alt_loadingimg']}" /></td> </tr> </table> </fieldset>
    Результат перестройки - пример стиля ipbskins.ru - форма регистрации)[/url]

    4 downloads

    0 comments

    Updated

  2. FAQ по установке скинов

    Последняя версия этой инструкции теперь живет здесь – FAQ по установке скинов
     
    Руководство по установке скинов (пригодно и для версий 2.0.x)
    (Повтор из моей темы на IBResource).
     
    Прежде всего вы должны понимать - ВСЕ СКИНЫ ЛИНЕЙКИ 2.1.x ПОДОЙДУТ как для 2.1.0, так и для 2.1.5. Апдейты ничего существенного не меняют, более того, мелкие изменения при установке скина вносятся автоматически. А если что-то не апдейтится в измененных шаблонах, Вы этого даже не заметите.
    Если у Вас английская админка, рекомендуется вначале прочесть Документацию по ipb.
    Там описание для 2.0.х, но функции в 2.1.х те же, изменилось только оформление.
     
    Пытаюсь изложить доходчиво по пунктам.
    А. Убедитесь, что правильно выставлен CHMOD - Установка CHMOD
    Б. Проверьте, не установил ли хостер php в safe mode (безопасный режим). При безопасном режиме картинки не импортируются, появляется только ПУСТАЯ ПАПКА. И скины вначале придется распаковывать на локалхосте (например установив Денвер и форум на локально.
    (подробнее про безопасный режим читать в ДОКУМЕНТАЦИИ
     
    **** Возможное решение проблемы создания кеша в safe mode теперь есть - Установка скинов при включенном safe_mode
     
    В. Проверьте соответствие версии скина версии форума. Скины 2.0x и 2.1х похожи ТОЛЬКО ВНЕШНЕ. Если Вы не понимаете что и где нужно потом править, не экспериментируйте.
    Г. Убедитесь, что в наличии ДВА АРХИВНЫХ ФАЙЛА XML - один с шаблонами, другой с картинками (в названии будет присутствовать слово "images").
     
    1. Зайдите в админпанель.
    2. Откройте вкладку - Внешний Вид (наверху - вторая слева).
    3. В левом меню найдите пункт - импорт/экспорт стилей (4-й сверху). Откройте его.
    4. Увидите заголовок "Импорт..." Там - Импорт шаблонов стиля и Импорт изображений.
    5. Импортируйте поочередно оба архива, не перепутав картинки с шаблонами. Задайте в нижней строчке при каждой операции соответственно название скина (латинскими буквами) и название папки имиджей (тоже не на русском)*.
    6. После удачного импорта зайдите в Менеджер стилей (верхняя строка левого меню). Внизу в списке найдете новый скин. Откройте меню (справа в строке со скином), нажмите на "Настройки".
    7. В Настройках увидите - Настройки изображений. Здесь обязательно нужно связать шаблоны скина с папкой его картинок. В меню просто выберите название нужной папки.
    8. По желанию там же настраиваете другие параметры скина.
     
    * Название иногда задавать не нужно. Это бывает в тех случаях, когда авторы прописывают название папки в путях в html шаблонах и/или css - пример - скин от Nickostyle из нашего архива. Тогда папка назовется так, как назвал ее автор.
     
    Если после установки скина выскакивает ошибка, не кричите о том, что форум накрылся из-за скина или что-то в этом роде.
    Вероятно, дело в хостинге. Обычно такое случается на jino-net.ru и ему подобных. В ряде случаев там не создается папка кеша. Придется менять хостинг, либо устанавливать скины локально, а затем переносить папку skin_caсh на хостинг.
     
    Если после установки скинов/манипуляций с кешем форум не работает, но показываются ошибки, в тексте которых фигурирует "ipsclass.php on line..", ответ попробуйте поискать в этой - Статье

    7 downloads

    0 comments

    Updated

  3. Перестройка конца инбокса (2.1)

    Перестройка конца инбокса (2.1)
     
    Если на странице личных сообщений иконки сообщений в легенде ломают нижнюю кромку таблицы, откройте skin_msg (Личные сообщения) -->end_inbox
    И замените весь код этим

    <tr> <td align="right" colspan="5" class="row2"> <input type="submit" name="move" value="{ipb.lang['move_button']}" /> $vdi_html {ipb.lang['move_or_delete']} <input type="submit" name="delete" value="{ipb.lang['delete_button']}" /> {ipb.lang['selected_msg']} </td> </tr> </table> </form> <div style="padding: 5px;"> <div class="row1"><{M_READ}> {ipb.lang['icon_read']} <{M_UNREAD}> {ipb.lang['icon_unread']}</div> <div align="right">$pages  <i>$amount_info</i></div> </div></div>

    2 downloads

    0 comments

    Updated

  4. "Круглые майнтитлы"

    Обычный и надоевший вопрос - Как сделать "Круглые майнтитлы"..
    Вообще они могут быть не только круглыми, а какими угодно. Принцип один.
    Для начала рекомендую ознакомиться с базовыми понятиями html, такими как таблица, ряд, ячейка, блок.. В этом поможет Справочник по html
    Затем:
    1. Создаем картинки, высотой 25px (самый устойчивый и неглючный размер).
    Боковушки - левую и правую и "растягивающуюся" серединку, которую прописываем в css.
    Картинки кладем в папку графики стиля.
    В режиме расширенного редактирования css cоздаем Новый класс (new) со свойствами maintitle, но с padding 0 (это чтобы названия не съезжали).
    Прописываем этот класс отдельно, но также добавляем всюду, где фигурирует слово maintitle.
    Например туда, где найдете maintitle a:link, дописываем new a:link
    Затем для упрощения верстки привязываем картинки к макросам.
    Для этого открываем редактор макросов и по принципу привязки любых иконок создаем 2 макроса, допустим и
    Теперь тренируемся на какой-нибудь простой форме вроде Помощи. Заходим в редактирование html - шаблонов стиля,
    открываем skin_help (Помощь) --> start
    Находим

    <div class="borderwrap"> <div class="maintitle"><{CAT_IMG}> $one_text</div>
    Заменяем на

    <table border="0" width="100%" cellspacing="0" cellpadding="0" class="new"> <tr> <td style="padding: 0px"><{LEFT}></td> <td style="padding: 0px" width="100%"><{CAT_IMG}> $one_text</td> <td style="padding: 0px"><{RIGHT}></td> </tr> </table> <div class="borderwrap">
    Сохраняем и смотрим результат на форуме :)

    9 downloads

    0 comments

    Updated

  5. Перстройка окна редактора в узких скинах (2.1)

    Перстройка окна редактора в узких скинах (2.1)
     
    Очень часто при сужении скинов окно редактора ломает форму ответа в темах, и (в первую очередь) окно панели управления пользователя при создании личного сообщения.
    В первом случае помогает простое уменьшение размеров этого окна в Админпанели - см. настройки тем, сообщений..
    Во втором случае не помогает ничего. Нижняя планка кнопочного бара вылезает наружу из-за перегруженности иконками.
    Решение. Иконки списков выносим на верхнюю планку
    После уменьшения окна редактора личных сообщений примерно на 50 px откройте в html-шаблонах
    skin_editors (Редактор сообщений) --> editor_std
    Замените код этим:

    <script type="text/javascript"> //<![CDATA[ // INIT var postformid; var postfieldid; var postformobj; var postfieldobj; var MessageMax = parseInt("{ipb.lang['the_max_length']}"); var Override = "{ipb.lang['override']}"; // Easy prompts var text_enter_url = "{ipb.lang['jscode_text_enter_url']}"; var text_enter_url_name = "{ipb.lang['jscode_text_enter_url_name']}"; var text_enter_image = "{ipb.lang['jscode_text_enter_image']}"; var text_enter_email = "{ipb.lang['jscode_text_enter_email']}"; var text_code = "{ipb.lang['jscode_text_code']}"; var text_quote = "{ipb.lang['jscode_text_quote']}"; var error_no_url = "{ipb.lang['jscode_error_no_url']}"; var error_no_title = "{ipb.lang['jscode_error_no_title']}"; var error_no_email = "{ipb.lang['jscode_error_no_email']}"; var prompt_start = "{ipb.lang['js_text_to_format']}"; var list_prompt = "{ipb.lang['js_tag_list']}"; // Validate Form text var js_used = "{ipb.lang['js_used']}"; var js_max_length = "{ipb.lang['js_max_length']}"; var js_post = "{ipb.lang['js_post']}"; var js_no_message = "{ipb.lang['js_no_message']}"; var js_current = "{ipb.lang['js_current']}"; var js_characters = "{ipb.lang['js_characters']}"; var js_msg_no_title = "{ipb.lang['msg_no_title']}"; var js_remove_attach = "{ipb.lang['remove_attach']}"; // Easy mode toggle var js_bbeasy_on = "{ipb.lang['js_bbeasy_on']}"; var js_bbeasy_off = "{ipb.lang['js_bbeasy_off']}"; var js_bbeasy_toggle = "{ipb.lang['js_bbeasy_toggle']}"; var js_check_length = "{ipb.lang['js_check_length']}"; // Extra Lang Bits var jsfile_error_lang = "{ipb.lang['jsfile_error']}"; var jsfile_myweb_lang = "{ipb.lang['jsfile_mywebpage']}"; //]]> </script> <script type="text/javascript" src="jscripts/ipb_editor.js"></script> <script type="text/javascript" src="jscripts/ipb_editor_std.js"></script> <if="ipb.force_editor_change == 1"> <div class='borderwrap'> <div class='row1' style='padding:4px'>{ipb.lang['js_forced_change']}</div> </div> </if> <!-- START NORMAL POST BUTTONS --> <div class="rteDiv" style="width:{$width}" align='left'> <!-- Color palette --> <iframe width="154" height="104" id="cp" src="{ipb.vars['img_url']}/folder_rte_files/palette.html" marginwidth="0" marginheight="0" scrolling="no" style="visibility:hidden; display: none; position: absolute;"></iframe> <!-- /Color palette --> <!-- Row 1 --> <table class="rtebuttonbar1" cellpadding="2" cellspacing="0" id="Buttons1"> <tr> <td width='1%' align='left' nowrap='nowrap'> <table cellpadding='0' cellspacing='0' width='100%'> <tr> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/rte_dots.gif" width="3" height="15" border="0" alt=""></td> <td><select name="ffont" class="codebuttons" onchange="alterfont(this.options[this.selectedIndex].value, 'font')"> <option value='0'>{ipb.lang['box_font']}</option> <script type="text/javascript">document.write( write_fontface_box() );</script> </select></td> <td><select name="fsize" class="codebuttons" onchange="alterfont(this.options[this.selectedIndex].value, 'size')"> <option value='0'>{ipb.lang['box_size']}</option> <script type="text/javascript">document.write( write_fontsize_box() );</script> </select></td> <!--SEP--> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/blackdot.gif" width="1" height="20" border="0" alt=""></td> <!--/SEP--> <td><div id="do_indent"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/indent.gif" width="25" height="24" alt="{ipb.lang['js_tt_indent']}" title="{ipb.lang['js_tt_indent']}" onclick="simpletag('indent')"></div></td> <!--SEP--> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/blackdot.gif" width="1" height="20" border="0" alt=""></td> <!--/SEP--> <td><div><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/numbered_list.gif" width="25" height="24" alt="{ipb.lang['js_tt_list']}" title="{ipb.lang['js_tt_list']}" onClick="tag_list('ordered')"></div></td> <td><div><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/list.gif" width="25" height="24" alt="{ipb.lang['js_tt_list']}" title="{ipb.lang['js_tt_list']}" onClick="tag_list('unordered')"></div></td> </tr> </table> </td> <td width='98%'> </td> <td width='1%' nowrap='nowrap' align='right'> <table cellpadding='0' cellspacing='0' width='100%'> <tr> <td><div id="do_closeall"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/closeall.gif" width="25" height="24" alt="{ipb.lang['js_tt_closeall']}" title="{ipb.lang['js_tt_closeall']}" onclick="closeall()"></div></td> </tr> </table> </td> </tr> </table> <!-- /Row 1 --> <!-- Row 2 --> <table class="rtebuttonbar1" cellpadding="2" cellspacing="0" id="Buttons1"> <tr> <td width='1%' align='left' nowrap='nowrap'> <table cellpadding='0' cellspacing='0' width='100%'> <tr> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/rte_dots.gif" width="3" height="15" border="0" alt=""></td> <td><div id="do_bold"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/bold.gif" width="25" height="24" alt="{ipb.lang['js_tt_bold']}" title="{ipb.lang['js_tt_bold']}" onclick="simpletag('b')"></div></td> <td><div id="do_italic"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/italic.gif" width="25" height="24" alt="{ipb.lang['js_tt_italic']}" title="{ipb.lang['js_tt_italic']}" onclick="simpletag('i')"></div></td> <td><div id="do_underline"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/underline.gif" width="25" height="24" alt="{ipb.lang['js_tt_underline']}" title="{ipb.lang['js_tt_underline']}" onclick="simpletag('u')"></div></td> <td><div id="do_strikethrough"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/strike.gif" width="25" height="24" alt="{ipb.lang['js_tt_strike']}" title="{ipb.lang['js_tt_strike']}" onclick="simpletag('s')"></div></td> <!--SEP--> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/blackdot.gif" width="1" height="20" border="0" alt=""></td> <!--/SEP--> <td><div id="forecolor"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/textcolor.gif" width="25" height="24" alt="{ipb.lang['js_tt_font_col']}" title="{ipb.lang['js_tt_font_col']}" onclick="popcolor('forecolor');"></div></td> <!--<td><div id="hilitecolor"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/bgcolor.gif" width="25" height="24" alt="{ipb.lang['js_tt_back_col']}" title="{ipb.lang['js_tt_back_col']}" onclick="popcolor('hilitecolor');"></div></td>--> <!--SEP--> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/blackdot.gif" width="1" height="20" border="0" alt=""></td> <!--/SEP--> <td><div><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/hyperlink.gif" width="25" height="24" alt="{ipb.lang['js_tt_link']}" title="{ipb.lang['js_tt_link']}" onclick="tag_url()"></div></td> <td><div><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/email.gif" width="25" height="24" alt="{ipb.lang['js_tt_email']}" title="{ipb.lang['js_tt_email']}" onclick="tag_email()"></div></td> <td><div><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/image.gif" width="25" height="24" alt="{ipb.lang['js_tt_image']}" title="{ipb.lang['js_tt_image']}" onclick="tag_image()"></div></td> <!--SEP--> <td><img class="rteVertSep" src="{ipb.vars['img_url']}/folder_rte_images/blackdot.gif" width="1" height="20" border="0" alt=""></td> <!--/SEP--> <td><div id='do_quote'><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/quote.gif" width="21" height="21" alt="{ipb.lang['js_tt_quote']}" title="{ipb.lang['js_tt_quote']}" onclick="simpletag('quote')"></div></td> <td><div id='do_code'><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/code.gif" width="21" height="21 alt="{ipb.lang['js_tt_code']}" title="{ipb.lang['js_tt_code']}" onclick="simpletag('code')"></div></td> </tr> </table> </td> <td width='98%'> </td> <td width='1%' nowrap='nowrap' align='right'> <table cellpadding='0' cellspacing='0' width='100%'> <tr> <td><div id="do_justifyleft"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/left_just.gif" width="25" height="24" alt="{ipb.lang['js_tt_left']}" title="{ipb.lang['js_tt_left']}" onClick="simpletag('left')"></div></td> <td><div id="do_justifycenter"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/centre.gif" width="25" height="24" alt="{ipb.lang['js_tt_center']}" title="{ipb.lang['js_tt_center']}" onClick="simpletag('center')"></div></td> <td><div id="do_justifyright"><img class="rteimage" src="{ipb.vars['img_url']}/folder_rte_images/right_just.gif" width="25" height="24" alt="{ipb.lang['js_tt_right']}" title="{ipb.lang['js_tt_right']}" onClick="simpletag('right')"></div></td> </tr> </table> </td> </tr> </table> <!-- /Row 2 --> <!-- END NORMAL POST BUTTONS --> </div> <textarea cols="80" rows="20" style='margin:0px;width:{$width}' id='postcontent' name="{$form_field}" tabindex="5" class="rteiframe">$text</textarea> <div class="rteDiv" style="width:{$width}"> <!-- Bottom Buttons --> <table cellpadding="0" cellspacing="0" style="padding:0px;margin:0px;" id='std-table-buttons' width="100%"> <tr> <td style="padding:0px;margin:0px;" align="left" width="1%" valign='top' nowrap="nowrap"> <input type="button" value=" + " onclick='std_window_resize( 100 );' id="rtesizeplus" class="rtebottombutton" /> <input type="button" value=" - " onclick='std_window_resize( -100 );' id="rtesizeminus" class="rtebottombutton" /> </td> <td style="padding:0px;margin:0px;height:30px" align="right" valign='top' width="99%"> <input type="button" value=" {ipb.lang['button_init']} " title='{ipb.lang['js_bbeasy_toggle']}' onclick='toggle_bbmode(); return false;' id="togglebbmode" class="rtebottombutton" /> <input type="button" value="{ipb.lang['js_check_length']}" title='{ipb.lang['js_check_length']}' onclick='check_length(); return false;' id="checklength" class="rtebottombutton" /> </td> </tr> </table> <!-- / Bottom Buttons --> </div> <!-- Prep BBCode buttons & Editor --> <script type="text/javascript"> init_editor(); init_std_editor(); </script>

    3 downloads

    0 comments

    Updated

  6. Перестройка нижней части таблицы просмотра конкретного форума (2.1)

    Перестройка нижней части таблицы просмотра конкретного форума (2.1)
     
    Перестройка таблицы с иконками тем и скроллинг списками.
    Решение для узких скинов в случае длинных названий форума, когда окошко перехода между форумами ломает таблицу.
    А также это просто красиво..
    Открыть skin_forum --> TableEnd
    Найти
    <!--IBF.FORUM_ACTIVE-->
    Все, что ниже, заменить этим:

    <div class="activeusers"> <div class="row2"><br /> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="29%" nowrap="nowrap">  <{B_NEW}>  <span class="desc">{ipb.lang['pm_open_new']}</span> <br /><br /> <{B_NORM}>  <span class="desc">{ipb.lang['pm_open_no']}</span></td> <td width="30%" nowrap="nowrap">  <{B_HOT}>  <span class="desc">{ipb.lang['pm_hot_new']}</span> <br /><br /> <{B_HOT_NN}>  <span class="desc">{ipb.lang['pm_hot_no']}</span>  </td> <td width="26%" nowrap="nowrap">  <{B_POLL}>  <span class="desc">{ipb.lang['pm_poll']}</span> <br /><br /> <{B_POLL_NN}>  <span class="desc">{ipb.lang['pm_poll_no']}</span></td> <td width="15%" nowrap="nowrap">  <{B_LOCKED}>  <span class="desc">{ipb.lang['pm_locked']}</span> <br /><br /> <{B_MOVED}>  <span class="desc">{ipb.lang['pm_moved']}</span> </td> </tr></table> <table cellspacing="0" width="100%"> <tr> <form action="{ipb.script_url}act=SF&f={$data['id']}&st={ipb.input['st']}&changefilters=1" method="post"></td> <td align="left" width="50%"> <select name="sort_key">{$this->ipsclass->show['sort_by']}</select> <select name="sort_by">{$this->ipsclass->show['sort_order']}</select></td> <td align="right" width="50%"> <select name="prune_day">{$this->ipsclass->show['sort_prune']}</select> <select name="topicfilter">{$this->ipsclass->show['topic_filter']}</select> <input type="submit" value="{ipb.lang['sort_submit']}" class="button" /> </form> </td> </tr> </table> </div> </div> <br /> <table width="100%" border="0" cellspacing="0" cellpadding="0"><tr> <td align="right" width="50%"> {$data[FORUM_JUMP]}</td> </tr></table> </form> <br clear="all" /> <if="ipb.member['is_mod']"> <a name='forumoptions'></a> <div align="center" id='forumoptionsjs'> <a href="{ipb.script_url}showforum={$data['id']}&modfilter=invisible_topics">{ipb.lang['mod_showallinvisible']}</a> · <a href="{ipb.script_url}showforum={$data['id']}&modfilter=invisible_posts">{ipb.lang['mod_showallposts']}</a> · <a href="{ipb.script_url}act=mod&CODE=resync&f={$data['id']}&auth_key={$auth_key}">{ipb.lang['mod_resync']}</a> · <a href="java script:PopUp('{ipb.script_url}act=mod&CODE=prune_start&f={$data['id']}&auth_key={$auth_key}', 'PRUNE', 600,500)">{ipb.lang['mod_prune']}</a> </div> <script type='text/javascript'> //<![CDATA[ document.getElementById('forumoptionsjs').style.display = 'none'; //]]> </script> </if> <script type='text/javascript'> //<![CDATA[ // INIT links for editing if ( use_enhanced_js && perm_can_edit ) { forum_init_topic_links(); } //]]> </script>
    Пример - здесь - почти на всех стилях в разных вариантах.

    1 download

    0 comments

    Updated

  7. Перестройка конца таблицы результатов поиска (2.1)

    Перестройка конца таблицы результатов поиска (2.1)
     
    Перестройка таблицы с иконками тем и вынесение скроллинг-списка за ее пределы.
    Рекомендуется для узких скинов.
    Открыть skin_search (Поиск) --> end_results_table
    Найти
    <div>{$data[sHOW_PAGES]}</div>
    Все, что ниже, заменить этим:

    <br /> <div class="borderwrap"> <table class="row1" cellspacing="0" width="100%"> <tr> <td width="30%" nowrap="nowrap"><br /> <{B_NEW}>  {ipb.lang['pm_open_new']}<br /><br /> <{B_NORM}>  {ipb.lang['pm_open_no']}</td> <td width="29%" nowrap="nowrap"><br /> <{B_HOT}>  {ipb.lang['pm_hot_new']}<br /><br /> <{B_HOT_NN}>  {ipb.lang['pm_hot_no']}</td> <td width="26%" nowrap="nowrap"><br /> <{B_POLL}>  {ipb.lang['pm_poll']}<br /><br /> <{B_POLL_NN}>  {ipb.lang['pm_poll_no']}</td> <td width="15%" nowrap="nowrap"><br />  <{B_LOCKED}>  {ipb.lang['pm_locked']}<br /><br />  <{B_MOVED}>  {ipb.lang['pm_moved']}</td> </table> <table cellspacing="0" width="100%"> <td align="right" width="86%" class="formbuttonrow" style="text-align: right;">{$this->ipsclass->forum_jump}</td> </tr> </table> </div> <br />
    Пример - почти на всех скинах на этом форуме.

    0 downloads

    0 comments

    Updated

  8. Маленькое исправление новостного блока на главной (2.x)

    Маленькое исправление новостного блока на главной (2.x)
     
    Исправление касается тех, кто включает новости форума, и они отображаются под навигацией на главной странице.
    В узких скинах, либо при разрешении экрана 1024х768 и ниже, длинные названия тем деформируют соседнюю ячейку. Не смотря на то, что они переходят на вторую строчку, кнопка поиска/логина тоже перескакивает вниз.
    Это некрасиво.
    Для исправления -
    В группе шаблонов skin_board найдите фрагмент PageTop
    В нем строку:

    <td><b>{ipb.lang['welcome_back_text']}: <span>$lastvisit</span></b><!-- IBF.NEWSLINK --></td>
    Замените на

    <td width=70%><b>{ipb.lang['welcome_back_text']}: <span>$lastvisit</span></b><!-- IBF.NEWSLINK --></td>
    Теперь длинные строки новостей не будут портить это окошко.
    Количество % можно подобрать точнее к каждому конкретному скину.

    0 downloads

    0 comments

    Updated

  9. Картинка в окошке редиректа (2.x)

    Картинка в окошке редиректа (2.x)
     
    Сделайте небольшую картинку. Назовите ее redirect.gif и положите в папку графики скина на сервере.
     
    Откройте редактирование html шаблонов
    skin_global --> redirect
    Найдите:

    <div id="redirectwrap"> <h4>{ipb.lang['thanks']}</h4> <p>$Text<br /><br />{ipb.lang['transfer_you']}</p> <p class="redirectfoot">(<a href="$Url">{ipb.lang['dont_wait']}</a>)</p> </div>
    1 вариант. Картинка внизу. Все надписи сохраняются.
    Пример - в стиле Romantic.
    Замените на:

    <div id="redirectwrap"> <h4>{ipb.lang['thanks']}</h4> <p>$Text<br /><br />{ipb.lang['transfer_you']}</p> <p><img src="style_images/<#IMG_DIR#>/redirect.gif" alt="Redirecting" /></p> <p class="redirectfoot">(<a href="$Url">{ipb.lang['dont_wait']}</a>)</p> </div>
    2 вариант.
    Только картинка. Ее можно сделать анимированной.
    Замените на:

    <div id="redirectwrap"> <img src="style_images/<#IMG_DIR#>/redirect.gif" alt="Redirecting" /> </div>
    В этом варианте придется поправить css.
    Найдите класс
    #redirectwrap и параметру width задайте ширину, равную в px ширине вашей картинки.

    8 downloads

    0 comments

    Updated

  10. Установка счетчиков и кнопок внизу форума (IPB v2x)

    Установка счетчиков и кнопок внизу форума (IPB v2x)
     
    Простейший вариант
    Менеджер стилей --> Ваш стиль --> Изменить общий шаблон форума
    Находим внизу тег

    53 downloads

    0 comments

    Updated

  11. IP.Board v2.2.2: исправляем "Мой помощник"

    IP.Board v2.2.2: исправляем "Мой помощник"
     
    "My Assistant" или "Мой помощник" - это изначально маленькое вспомогательное окошко, расчитанное только на самые короткие фразы.
    В русском языке коротких фраз мало, поэтому окошко ломается при получении новых сообщений в результате добавления еще одного пункта в меню.
    В русской I.P.Board v2.2.2 сделана попытка убить воробья из пушки, путем изменения ява-скрипта, css и html адаптирован размер окна к русским фразам. Но большое окно сложно назвать вспомогательным.
    Кроме того, в русской версии в связи с изменением в ява-скрипте окно помощника во всех скинах, за исключением русского дефолтного, портится еще больше.
    Для приведения остальных скинов к единому виду с русским дефолтным стилем обладателям русского 2.2.2 нужно сделать следующее:
    a ) Открыть редактирование html фрагментов >> skin_global >> global_board_header
    Найти

    <div id='get-myassistant' style='display:none;width:400px;text-align:left;'>
    заменить на

    <div id='get-myassistant' style='display:none;width:606px;text-align:left;'>
    b ) (не обязательно делать - будет работать и без этого пункта)
    Открыть редактирование css. Внизу добавить

    .mya-back {width: 600px;}Окно помощника станет огромным, но перестанет ломаться.
    Мне не нравятся большие вспомогательные окна, поэтому предлагаю свое решение в двух вариантах.
    1. Просто поправить русский перевод, открыв файл lang_buddy.php
    ./cach >> lang_cach>> папка с русскими языковыми файлами >> lang_buddy.php
    Найти

    'tab_posts' => 'Новые сообщения', 'tab_search' => 'Поиск', 'tab_pms' => 'Личные сообщения', 'tab_newpms' => 'НОВЫЕ личн. сообщения',
    Заменить на

    'tab_posts' => 'Обновления', 'tab_search' => 'Поиск', 'tab_pms' => 'Почта', 'tab_newpms' => 'Новые PM',
    Или заменить своим вариантом короткого перевода.
    ***
    Обладателям русского лицензионного при этом придется вернуть к оригинальному виду ява-скрипт и изменения в шаблонах в русском дефолте.
    a ) ./jscripts/ipb_global_xmlenhanced.js
    Найти

    600 заменить на
    398
    b ) Привести в порядок global_board_header
    Найти
    width:606px; заменить на
    width:400px;
    с ) Поправить в русском дефолтном css. Найти класс .mya-back и удалить оттуда
    .width: 600px; 
    Если Вам все-таки дороги длинные фразы, можно обойтись малой кровью, но, кроме перевода, придется также править css.
    2. Незначительная правка перевода и перестройка окна с сохранением компактного вида.
    a ) ./cach >> lang_cach>> папка с русскими языковыми файлами >> lang_buddy.php

    'tab_info' => 'Информация', 'tab_posts' => 'Новые сообщения', 'tab_search' => 'Поиск', 'tab_pms' => 'Личные сообщения', 'tab_newpms' => 'НОВЫЕ личн. сообщения',
    Заменить на

    'tab_info' => 'Информация<br /> ', 'tab_posts' => 'Новые <br />сообщения', 'tab_search' => 'Поиск<br /> ', 'tab_pms' => 'Личные<br /> сообщения', 'tab_newpms' => 'НОВЫЕ <br />письма',
    b ) Открыть css. Внизу добавить

    .pp-contentbox-entry-noheight, .pp-contentbox-entry-noheight-mod, .pp-contentbox-entry-noheight-sel { margin-top: 10px; }
    И будет вам счастье.
    Обладателям русской лицензии при такой правке придется привести в порядок код, измененный в IBResource - см. выше под знаком ***

    5 downloads

    0 comments

    Updated

  12. Баннер справа от логотипа – стандартный вариант для простой шапки

    Баннер справа от логотипа – стандартный вариант для простой шапки
     
    Если баннер предполагается расположить справа от логотипа, откройте
    редактирование html фрагментов --> skin_global --> global_board_header,
     
    Найдите и отредактируйте

    <div id="logostrip"><a href='{ipb.script_url}'><!--ipb.logo.start--><img src='http://ipbskins.ru/forum/public/style_images/<#IMG_DIR#>/logo4.gif' style='vertical-align:top' alt='IPB' border='0' /><!--ipb.logo.end--></a></div>
     
    Должно в итоге получиться примерно так

    <div id="logostrip"> <div style="float:right;padding:5px">КОД БАННЕРА</div> <a href='{ipb.script_url}'><!--ipb.logo.start--><img src='style_images/<#IMG_DIR#>/logo4.gif' style='vertical-align:top' alt='IPB' border='0' /><!--ipb.logo.end--></a> </div>

    66 downloads

    1 comment

    Updated

  13. Добавление своих кнопок bb-кода

    Добавление своих кнопок bb-кода
     
    Бывает нужно добавить кнопочки бб-кода в редактор, а как это сделать? Тем более нынешний редактор от ips слишком тяжелый в понимании так к тому же еще и полностью завязан с java.
    Вот небольшая статья, о том как добавить на панель редактора свои кнопки, которые будут работать, как в обычном режиме редактора, так и в расширенном (WYSIWYG).
    Буду делать все на примере тега [sometag]. И так первое – это открыть ваш дистрибутив форума, и найти там папку development. В ней есть папка с несжатыми скриптами под названием javascript_uncompressed, там нам понадобятся следующие файлы:
    Копируйте их куда-нибудь и откройте в любом редакторе с подсветкой синтаксиса. Не используйте обычный блокнот для редактирования файлов!!!
    Начнем с формы быстрого ответа, за нее отвечает файл ips_text_editor_lite.js. Найдем там строки:
     

    /** * STD: * IPB code override */ this.ipb_code = function() { var _text = this.get_selection(); this.wrap_tags( 'code', false, _text ); };
    Копируем их, и вставим ниже. Т.е. получится что-то вроде этого:
     

    /** * STD: * IPB code override */ this.ipb_code = function() { var _text = this.get_selection(); this.wrap_tags( 'code', false, _text ); }; /** * STD: * IPB code override */ this.ipb_code = function() { var _text = this.get_selection(); this.wrap_tags( 'code', false, _text ); };
     
    Теперь находим в том, что мы скопировали слова "code" и заменяем их на "sometag". В итоге у нас получилась вот такая конструкция (вместе со стандартным текстом):
     

    /** * STD: * IPB code override */ this.ipb_code = function() { var _text = this.get_selection(); this.wrap_tags( 'code', false, _text ); }; /** * STD: * IPB sometag override */ this.ipb_sometag = function() { var _text = this.get_selection(); this.wrap_tags( 'sometag', false, _text ); };
     
    На данный момент вы получили полностью рабочую функцию вашей кнопки, можно сразу залить на сайт, однако этот файл слишком большой по объему, и его желательно сжать, как сделали это ips. Весь файл мы естественно сжимать заново не будем, а сожмем лишь новую функцию. И так, берем:
     

    /** * STD: * IPB sometag override */ this.ipb_sometag = function() { var _text = this.get_selection(); this.wrap_tags( 'sometag', false, _text ); };
     
    И удаляем из нее все пробелы и переводы строк, но не трогаем пробел после слова "var", а так же закомментированные строки. Удалив это, у вас должно получиться что-то наподобие этого:
     

    this.ipb_sometag=function(){var _text=this.get_selection();this.wrap_tags('sometag',false,_text);};
     
    Вот вы и сжали функцию. Теперь открываете файл ./jscripts/ips_text_editor_lite.js в папке с вашим форумом, предварительно сделав резервную копию. B находите в нем такую конструкцию:
     

    this.ipb_code=function(){var _text=this.get_selection();this.wrap_tags('code',false,_text);};
     
    И вставляете после нее вашу сжатую функцию, у меня это sometag:
     

    this.ipb_sometag=function(){var _text=this.get_selection();this.wrap_tags('sometag',false,_text);};
     
    И в итоге получится вот такая длинная строка
     

    this.ipb_code=function(){var _text=this.get_selection();this.wrap_tags('code',false,_text);};this.ipb_sometag=function(){var _text=this.get_selection();this.wrap_tags('sometag',false,_text);};
    Сохраняем. Далее идем в стили, выбираем в опциях стиля "редактировать html фрагменты" (Edit template html) Далее в строке поиска шаблона пишем "quick_reply_box_open (skin_topic)" (без кавычек), нажимаете найти, и у вас появится этот фрагмент. В нем ищете
     

    <td><div class="rte-normal" id="fast-reply_cmd_ipb_code"><img src="style_images/<#IMG_DIR#>/folder_editor_images/rte-code-button.png" alt="{$this->ipsclass->lang['js_rte_lite_code']}" title="{$this->ipsclass->lang['js_rte_lite_code']}"></div></td>
     
    Копируете этот текст и ниже вставляете его же, только заменяя {$this->ipsclass->lang['js_rte_lite_code']} на ваше название кнопки, в моем случае это "Some Tag". И заменяете везде слово code на ваш тэг, у меня sometag. В итоге получится вот такая измененная строка
     

    <td><div class="rte-normal" id="fast-reply_cmd_ipb_sometag"><img src="style_images/<#IMG_DIR#>/folder_editor_images/rte-sometag-button.png" alt="Some Tag" title="Some Tag"></div></td>
     
    Не забудьте залить картинку в папку style_images/<#IMG_DIR#>/folder_editor_images/, где <#IMG_DIR#> это папка со всеми изображениями вашего стиля, с названием, которое вы указали, у меня это rte-sometag-button.png. Сохраняете шаблон и все. Кнопка в быстром ответе готова.
     
    Теперь кнопка в форме расширенного ответа. В принципе делать будем по аналогии, разве, что функции чуток отличаются.
    И так, открываем ваш несжатый файл ips_text_editor.js, который мы до этого копировали. И ищем в нем строки:
     

    /** * STD: * IPB Quote override */ this.ipb_quote = function() { this.wrap_tags_lite( '[quote]', '[/quote]', 0) };
    Опять проделываем операцию копирования и получаем вот это (вместе с тем, что копировали).
     

    /** * STD: * IPB Quote override */ this.ipb_quote = function() { this.wrap_tags_lite( '[quote]', '[/quote]', 0) }; /** * STD: * IPB Quote override */ this.ipb_quote = function() { this.wrap_tags_lite( '[quote]', '[/quote]', 0) };
     
    Заменяем везде в копии слово "quote" на свой тэг, у меня это "sometag". И получаем (вместе с исходной функцией):
     

    /** * STD: * IPB Quote override */ this.ipb_quote = function() { this.wrap_tags_lite( '[quote]', '[/quote]', 0) }; /** * STD: * IPB sometag override */ this.ipb_sometag = function() { this.wrap_tags_lite( '[sometag]', '[/sometag]', 0) };
     
    Далее сжимаем полученное (только в новой функции). Удаляем комментарии, пробелы, переводы строк. У меня получилось вот так:
     

    this.ipb_sometag=function(){this.wrap_tags_lite('[sometag]','[/sometag]',0)};
     
    Теперь открываете файл ./jscripts/ips_text_editor_lite.js в папке с вашим форумом, предварительно сделав резервную копию, и добавляете после
     

    this.ipb_quote=function(){this.wrap_tags_lite('[quote]','[/quote]',0)};
     
    Вашу функцию бб кода:
     

    this.ipb_sometag=function(){this.wrap_tags_lite('[sometag]','[/sometag]',0)};
     
    И в итоге получаем вот такую строку:
     

    this.ipb_quote=function(){this.wrap_tags_lite('[quote]','[/quote]',0)};this.ipb_sometag=function(){this.wrap_tags_lite('[sometag]','[/sometag]',0)};
     
    Сохраняем, и опять заходим в стили. На этот раз набираем в поиске "ips_editor (skin_editors)" (без кавычек). Находим в появившемся шаблоне строки:
     

    <td><div class="rte-normal" id="{$editor_id}_cmd_ipb_code"><img src="{$images_path}rte-code-button.png" alt="{$this->ipsclass->lang['js_rte_lite_code']}" title="{$this->ipsclass->lang['js_rte_lite_code']}"></div></td>
     
    Копируете этот текст и ниже вставляете его же, только заменяя {$this->ipsclass->lang['js_rte_lite_code']} на ваше название кнопки, в моем случае это "Some Tag". И заменяете везде слово code на ваш тэг, у меня sometag. В итоге получится вот такая измененная строка
     

    <td><div class="rte-normal" id="{$editor_id}_cmd_ipb_sometag"><img src="{$images_path}rte-sometag-button.png" alt="Some tag" title="Some tag"></div></td>
     
    Не забудьте залить картинку в папку style_images/<#IMG_DIR#>/folder_editor_images/, где <#IMG_DIR#> это папка со всеми изображениями вашего стиля, с названием, которое вы указали, у меня это rte-sometag-button.png. Сохраняете шаблон и все. Кнопки присутствуют в обоих формах ответа.

    16 downloads

    1 comment

    Updated


×
×
  • Create New...