Центр документации
Карта сайта

Создай визитку сам!


Самоучитель по интеграции дизайна и настройке Amiro.CMS на примере демонстрационной версии пакета Визитка »


Настройка модуля Гостевая книга

На странице «Книга отзывов» у нас установлен тип страницы «Гостевая книга».

На сайте видим оформление «Гостевой книги»:

 

Рисунок 62

 

Гостевая книга настраивается в шаблоне guestbook.tpl.

Сет для формы гостевой книги:

 

<!--#set var="form" value="

<script language="JavaScript" type="text/javascript">

var quotedMessageId = 0;

function CheckFields(form)

{

##if(!id_member)##

if (form.author.value.length < 1) {

alert("%%warn_name%%");

form.author.focus();

return false;

}

##endif##

if (form.subject.value.length < 1) {

alert("%%warn_subject%%");

form.subject.focus();

return false;

}

if (txtEd.contentLength() < 2) {

alert("%%bb_warn_message_length%%");

form.message.focus();

return false;

}

##captcha_script##

if (form.author) {

setCookie('forum_author', form.author.value, '/');

}

return true;

}

function replyToMessage(parentMessageId)

{

if (typeof(document.forms[_cms_document_form]) == 'object') {

var form = document.forms[_cms_document_form];

if (!form.id_update.value) {

form.id_update.value = '';

}

form.id_parent.value = parentMessageId;

var author = getCookie('forum_author');

if (form.author != undefined && form.author.value == '' && author != undefined) {

form.author.value = getCookie('forum_author');

}

if (form.subject.value == '') {

var subject = document.getElementById('su' + (document.getElementById('su' + parentMessageId) ? parentMessageId : quotedMessageId)).innerHTML;

if (subject.indexOf('%%re%%: ') != 0) {

subject = '%%re%%: ' + subject;

}

form.subject.value = subject;

}

if (!form.id_update.value) {

document.getElementById('answer_for').innerHTML = document.getElementById('bba' + parentMessageId).innerHTML;

document.getElementById('answer_for_date').innerHTML = document.getElementById('di' + parentMessageId).innerHTML;

document.getElementById('realAnswer').checked = true;

document.getElementById('span_answer_for').style.display = 'block';

}

txtEd.editorObj.focus();

}

return false;

}

</script>

##script_quote_message##

<br><br>

<a name="forumForm"></a>

<div style="text-align:center">

<form action="##submitter_link##" method="post" name="forum_form" onSubmit="return CheckFields(this);">

<input type="hidden" name="modlink" value="##script_full_link##" />

<input type="hidden" name="action" value="add" />

<input type="hidden" name="id_update" value="" />

<input type="hidden" name="id_parent" value="##id_parent##" />

<span id="bbFormTitle">%%post%%</span>

<table align="center" border="0" cellPadding="0" cellSpacing="5">

<tr>

<td><span id="amiroTEdPreviewHeader" style="text-align:center;display:none"><b>%%bb_preview%%</b><br /></span>&nbsp;</td>

</tr>

<tr>

<td><div id="amiroTEdDivPreview" class="amiroTEdDivPreview" style="width:100%;margin-bottom:3px;display:none"></div>&nbsp;</td>

</tr>

<tr>

<td><span style="display:none" id="span_answer_for">

<input type="checkbox" name="realAnswer" id="realAnswer" />

<label for="realAnswer">%%add_message_as_answer_for%%: <b><span id="answer_for"></span>&nbsp;%%small_from%%&nbsp;<span id="answer_for_date"></span></b></lable>

&nbsp;</span></td>

</tr>

<tr>

<td>%%name%%*:

##if(!id_member)##<input type="text" class="txt" name="author" size="35" value="" />##else####author####endif##</td>

</tr>

<tr>

<td>%%subject%%*:

<input type="text" class="txt" name="subject" size="35" value="##subject##" /></td>

</tr>

<tr>

<td>

<script language="JavaScript" type="text/javascript">

var edLangData = new Array (

'%%bb_bold%%', '%%bb_italic%%', '%%bb_underline%%', '%%bb_quote%%', '%%bb_align_left%%', '%%bb_align_center%%', '%%bb_align_right%%',

'%%bb_justify%%', '%%bb_insert_list%%', '%%bb_insert_link%%', '%%bb_delete_link%%', '%%bb_insert_image%%', '%%bb_font%%', '%%bb_size%%',

'%%bb_color%%', '%%bb_more%%', '%%bb_insert_code%%', '%%bb_indent%%', '%%bb_outdent%%',

'%%bb_preview%%', '%%bb_hide_preview%%', '%%bb_update_preview%%', '%%bb_warn_message_length%%',

'%%bb_warn_invalid_image_url%%', '%%bb_warn_image_url_internal_links_forbidden%%', '%%bb_warn_image_url_external_links_forbidden%%'

);

var txtEd = new amiroTEdit('txtEd', edLangData);

txtEd.allowedImages = new Array (##allowed_images##);

txtEd.createEditor(600, 250, 'message', '', false, 'amiroTEdDivPreview');

txtEd.setUseNoindex(##noindex_external_links##);

txtEd.editorModeCode = "document.getElementById('amiroTEdPreviewHeader').style.display = 'none';";

if (location.toString().indexOf('#') > -1) {

savePreviousOnLoadEvent();

addOnLoadEvent(function(){setTimeout('txtEd.editorObj.focus()',300)});

}

</script>

</td></tr>

##if(EXTENSION_TWIST_PREVENTION_GUESTBOOK)##<tr><td colSpan="2">##captcha_row##</td></tr>##endif##

<tr><td align="center"><input type="submit" class="btn" value="%%bb_preview%%" name="preview" onClick="return txtEd.previewButtonOnClick(this)" />

<input type="submit" class="btn" value="%%post%%" name="send" /></td></tr>

<tr><td><sub>%%required_fields%%</sub></td></tr>

</table>

</form>

##if(!id_member)##

<script language="JavaScript" type="text/javascript">

<!--

var author = getCookie('forum_author');

if (author) {

document.forms[_cms_document_form].author.value = getCookie('forum_author');

}

-->

</script>

##endif##

"-->

 

Здесь:

%%author%% - языковая переменная «Имя»

<input type="text" class="txt" name="author" size="35" value="" />- текстовое поле для ввода имени

%%subject%% - языковая переменная «Заголовок»

<input type="text" class="txt" name="subject" size="35" value="##subject##" /> - текстовое поле для ввода заголовка сообщения

<script language="JavaScript" type="text/javascript">

var edLangData = new Array (

'%%bb_bold%%', '%%bb_italic%%', '%%bb_underline%%', '%%bb_quote%%', '%%bb_align_left%%', '%%bb_align_center%%', '%%bb_align_right%%',

'%%bb_justify%%', '%%bb_insert_list%%', '%%bb_insert_link%%', '%%bb_delete_link%%', '%%bb_insert_image%%', '%%bb_font%%', '%%bb_size%%',

'%%bb_color%%', '%%bb_more%%', '%%bb_insert_code%%', '%%bb_indent%%', '%%bb_outdent%%',

'%%bb_preview%%', '%%bb_hide_preview%%', '%%bb_update_preview%%', '%%bb_warn_message_length%%',

'%%bb_warn_invalid_image_url%%', '%%bb_warn_image_url_internal_links_forbidden%%', '%%bb_warn_image_url_external_links_forbidden%%'

);

var txtEd = new amiroTEdit('txtEd', edLangData);

txtEd.allowedImages = new Array (##allowed_images##);

txtEd.createEditor(600, 250, 'message', '', false, 'amiroTEdDivPreview');

txtEd.setUseNoindex(##noindex_external_links##);

txtEd.editorModeCode = "document.getElementById('amiroTEdPreviewHeader').style.display = 'none';";

if (location.toString().indexOf('#') > -1) {

savePreviousOnLoadEvent();

addOnLoadEvent(function(){setTimeout('txtEd.editorObj.focus()',300)});

}

</script> - вывод на экран блока для редактирования и отправки сообщения

<input type="submit" class="btn" value="%%bb_preview%%" name="preview" onClick="return txtEd.previewButtonOnClick(this)" /> - кнопка «предварительный просмотр».

<input type="submit" class="btn" value="%%post%%" name="send" /> - кнопка «отправить»

Для изменения размеров блока редактирования сообщения необходимо в сете <!--#set var="form" value=" найти отрывок:

txtEd.createEditor(600, 250, 'message', '', false, 'amiroTEdDivPreview');

Первые два параметра – это размер по ширине и высоте соотвественно, уменьшим блок по высоте:

txtEd.createEditor(600, 150, 'message', '', false, 'amiroTEdDivPreview');

На сайте отобразится следующий результат:

 

Рисунок 63

 

Изменим стиль закраски строк с сообщениями на #fcd3c6.

Сет для оформления списка сообщений <!--#set var="item_row" value="

 

Оформление заголовка

 

<div style="background: #f5f5f5; height: 28px; padding: 0px 10px;">

<div style="float: left;">

<h2>##subject##<span id="su##id##" style="display:none">##_subject##</span></h2>

</div>

</div>

 

Поменяем цвет бекграунда для заголовка:

 

<div style="background: #fcd3c6; height: 28px; padding: 0px 10px;">

<div style="float: left;">

<h2>##subject##<span id="su##id##" style="display:none">##_subject##</span></h2>

</div>

</div>

 

Стиль оформления сообщения, на которое дается ответ можно изменить в файле стилей common.css, стиль по умолчанию выглядит так:

 

BLOCKQUOTE.edQuote {

border: 1px dotted gray;

background: #ееееее;

padding: 5px;

}

 

Изменим стиль следующим образом:

 

BLOCKQUOTE.edQuote {

border: 1px dotted gray;

background: #fcd3c6;

padding: 5px;

}

 

На сайте отобразиться:

 

Рисунок 64

 

Версия для печати

Установка и настройка Руководство пользователя Интеграция дизайна Разработчикам (API)
 2000 – 2019 © Amiro.CMS Все права защищены.