<?xml version="1.0" encoding="UTF-8" ?> <chapter id="using-quanta-3-2"> <chapterinfo> <title>Использование Quanta</title> <authorgroup> <author><firstname>Robert</firstname> <surname>Nickel</surname> <affiliation> <address><email>robert@artnickel.com</email></address> </affiliation> </author> <author><firstname>András</firstname> <surname>Mantia</surname> <affiliation> <address><email>amantia@kde.org</email></address> </affiliation> </author> <othercredit role="reviewer"><firstname>Christopher</firstname> <surname>Hornbaker</surname> <affiliation> <address><email>chrishornbaker@earthlink.net</email></address> </affiliation> <contrib>Рецензент</contrib> </othercredit> <othercredit role="reviewer"><firstname>Fabrice</firstname> <surname>Mous</surname> <affiliation> <address><email>fabrice@kde.nl</email></address> </affiliation> <contrib>Рецензент</contrib> </othercredit> <othercredit role="translator"><firstname>Николай</firstname><surname>Шафоростов</surname><affiliation><address><email>shafff@ukr.net</email></address></affiliation><contrib>Перевод на русский</contrib></othercredit> </authorgroup> </chapterinfo> <title>Использование Quanta</title> <para>Эта глава описывает части &quantaplus;, с которыми вы чаще всего можете встретиться. Хорошее знание их поможет вам работать быстрее. </para> <sect1 id="toolbars-howto-3-2"> <title>Панели инструментов</title> <para>Как упоминалось ранее, управление панелями инструментов происходит через меню <guimenu>Панели инструментов</guimenu>. Здесь будет описываться их использование, их создание описано <quote><link linkend="creating-toolbars-3-2">здесь</link>.</quote> </para> <para>Если вы щёлкните на значке, произойдёт одно из трёх действий: тег будет добавлен в документ (с закрывающей частью, если она есть); откроется окно, предлагающее ввести обязательные атрибуты тега; будет произведено действие с файлами (проекта). Если вы мучаетесь, набирая часто один и тот же тег, вы можете добавить его в одну из панелей инструментов (или создать для этого новую). Для подробностей см. <xref linkend="dtep-intro-3-2"/>. </para> <para>Настроить панели инструментов можно через их контекстное меню, из которого можно <guilabel>Добавить действие</guilabel>, <guilabel>Создать панель инструментов</guilabel>. Пункт <guilabel>Настроить панели инструментов</guilabel> откроет диалог, в котором можно выбрать. какие действия будут видны на панелях инструментов. </para> <para>Меню действия панели инструментов, кроме описанных выше, будет содержать пункты <guilabel>Удалить действие</guilabel> и <guilabel>Изменить действие</guilabel>. </para> <para>Панели инструментов и действия можно также настроить через <menuchoice><guimenu>Настройка</guimenu><guimenuitem>Настроить панели инструментов...</guimenuitem></menuchoice> и <menuchoice><guimenu>Настройка</guimenu><guimenuitem>Настроить действия...</guimenuitem></menuchoice>. </para> <para>Действия, определяемые пользователем, описаны в <xref linkend="user-actions"/>. </para> <para>Окно свойств тега: <mediaobject> <imageobject> <imagedata fileref="taginputex.png" format="PNG"/> </imageobject> <caption><para>Пример диалога свойств тега.</para></caption> </mediaobject> </para> <para>На снимке экрана — окно свойств тега ссылки. Обратите внимание на вкладки <guilabel>Общие</guilabel>, <guilabel>Core and i18n</guilabel>, <guilabel>События</guilabel>, <guilabel>Фокус</guilabel>, они содержат остальные атрибуты, которые может иметь тег ссылки (и не только). Заполните все нужные вам атрибуты и нажмите ОК. </para> </sect1> &quanta-projects; <sect1 id="templates-3-2"> <title>Шаблоны</title> <para>Шаблоны есть каркасы документов, куски сценариев и файлы, на которые можно вставить ссылку. Шаблоны в &quantaplus; — стандартная файловая структура со специальной организацией и интерфейсом. Вы можете копировать, переместить, просто поставить ссылку в структуру шаблонов для быстрого доступа к файлам. </para> <para>Шаблоны хранятся во вложенный каталогах. Каждый тип шаблона имеет свои действия. Также есть возможность передавать некоторые значения, например размер изображения, для упрощения написания тегов. </para> <para>Цель шаблонов — сделать вашу работу более продуктивной и динамической. Также, косвенно, это позволит вам не беспокоится о загрузке файлов (шаблонов, на которые была установлена ссылка) на сервер — они будут загружены вместе с остальными файлами проекта. Если вы хотите помочь, обратитесь к странице <ulink url="http://quanta.sourceforge.net/main1.php?contfile=needs">Help Wanted</ulink>. </para> <important> <para>Некоторые шаблоны, поставляемые с &quantaplus; могут использоваться только при определённых условиях. </para> </important> <sect2 id="template-types-3-2"> <title>Типы шаблонов</title> <para>&quantaplus; поддерживает несколько типов шаблонов: </para> <para> <simplelist> <member>Двоичные</member> <member>Шаблоны документов</member> <member>Заготовки текста</member> <member>Шаблоны сайтов</member> </simplelist> Примеры каждого из них идут в поставке с &quantaplus;. </para> <variablelist> <varlistentry> <term>Двоичные шаблоны</term> <listitem> <para>Это могут картинки, &PDF;, ролики на flash и т.д. Такие файлы обычно включаются в документы посредством ссылок, либо встраиванием (например, изображения - через <sgmltag class="starttag">img src=/src/url</sgmltag>). Примеры двоичных шаблонов можно найти в дереве глобальных шаблонов. Для подробностей см. <xref linkend="qit-3-2"/>. </para> </listitem> </varlistentry> <varlistentry> <term>Шаблоны документов</term> <listitem> <para>Обычно более специфичные шаблоны размещаются глубже в подкаталогах. Это помогает лучше организовать их структуру, что приведёт к ускорению вашей работы. К шаблонам можно обращаться через дерево шаблонов. Для подробностей см. <xref linkend="qit-3-2"/>. </para> </listitem> </varlistentry> <varlistentry> <term>Заготовки текста</term> <listitem> <para>Отличается от предыдущего типа тем, что не обязательно создавать новый документ, а просто вставить часто используемый текст в текущий. Это может быть что угодно - от маленького комментария и до полного кода меню на JavaScript. Примеры заготовок можно найти в дереве глобальных шаблонов. Для подробностей см. <xref linkend="qit-3-2"/>. </para> </listitem> </varlistentry> <varlistentry> <term>Шаблоны сайтов</term> <listitem> <para>Представляют собой архив с деревом каталогов и шаблонов в них. </para> </listitem> </varlistentry> </variablelist> </sect2> <sect2 id="template-scope-3-2"> <title>Действие шаблонов</title> <para>Шаблоны доступны по активности той или иной <link linkend="quanta-workspaces-3-2">рабочей области</link>; </para> </sect2> <sect2 id="creating-templates-3-2"> <title>Создание шаблонов</title> <sect3 id="creating-document-templates"> <title>Создание шаблонов документов</title> <para>Создайте структуру документа (&XML;, &HTML;, DocBook, &etc;.) и выберите в меню <menuchoice> <guimenu>Файл</guimenu> <guimenuitem>Сохранить как шаблон</guimenuitem> <guimenuitem>Сохранить как локальный шаблон (шаблон проекта)</guimenuitem> </menuchoice>. </para> <para>После этого шаблоны <emphasis>не</emphasis> будут отображаться в структуре проекта (на панели слева), но вы их сможете найти на вкладке шаблонов в каталоге "Шаблоны проекта". </para> </sect3> <sect3 id="creating-text-templayes"> <title>Создание заготовок текста</title> <para>Выделите текст и выберите пункт меню <menuchoice> <guimenu>Файл</guimenu> <guimenuitem>Сохранить как шаблон</guimenuitem> <guimenuitem>Сохранить выделение в локальный шаблон (шаблон проекта)...</guimenuitem> </menuchoice>. Либо просто перетащите выделение на дерево шаблонов. </para> </sect3> <sect3 id="creating-binary-templates"> <title>Создание двоичных шаблонов</title> <para>Перенесите двоичный файл в папку шаблонов, или создайте на него символическую ссылку. </para> </sect3> <sect3 id="creating-site-templates"> <title>Создание шаблонов сайтов</title> <para>На служебных панелях <guilabel>Файловая система</guilabel> или <guilabel>Файлы проекта</guilabel> в контекстном меню папки выберите <guilabel>Создать шаблон сайта...</guilabel>, выберите для него имя и сохраните. По умолчанию вам будет предложено сохранить его в папку шаблонов проекта, но, конечно, вы можете сохранить его в локальной или глобальной папке шаблонов. </para> </sect3> </sect2> <sect2 id="using-templates-with-projects-3-2"> <title>Использование шаблонов в проекте</title> <para>Шаблоны в проектах помогут вам лучше сосредоточится на основной задаче. Вы можете создать заголовки, завершающие части документов, вставлять их динамически через &PHP;, или просто ссылаться на них. </para> <para>При создании проекта вы можете выбрать копирование в ваш проект всех глобальных и пользовательских шаблонов. Вы можете выбрать место для хранения шаблонов, например сервер, или локально. При добавлении ссылки на файл, не являющийся шаблоном проекта, вам будет предложено копировать его в шаблоны проекта. Это предотвратит возможность появления нерабочих ссылок — файл закачается на сервер автоматически с остальными файлами проекта. </para> </sect2> <sect2 id="managing-templates-3-2"> <title>Управление шаблонами</title> <para>Дерево шаблонов, на соответствующей вкладке, основано на файлах каталогов <filename class="directory">$<envar>TDEDIR</envar>/share/apps/quanta/templates</filename> и <filename class="directory"> $<envar>HOME</envar>/.trinity/share/apps/quanta/templates</filename>. В каждом из них может быть <link linkend="template-types-3-2">четыре типа шаблонов</link>. </para> <para>Для установки режима каждого из каталогов, в контекстном меню вкладки шаблонов (на панели слева) выберите <guimenuitem>Свойства</guimenuitem>: <mediaobject> <imageobject> <imagedata fileref="template-rmb.png" format="PNG"/> </imageobject> <caption><para>Окно свойств</para></caption> </mediaobject> </para> <variablelist> <varlistentry> <term><guilabel>Тип</guilabel></term> <listitem> <para>Выпадающий список с тремя типами файлов, упоминаемыми выше. Будет неактивным (серого цвета), если вы выбрали <guilabel>Унаследовать родительский атрибут</guilabel>. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Унаследовать родительский атрибут</guilabel> (<sgmltag class="starttag">foo</sgmltag>)</term> <listitem> <para>Включено по умолчанию и работает нормально для всех подкаталогов иерархии (кроме корневого). Если это включено для корневого каталога, это приведёт к деактивации шаблонов в нём, а также подкаталогов, которые не установлены явны. Для некорневого каталога, <sgmltag class="starttag">blah</sgmltag> будет говорить что-то типа <literal>заготовка текста</literal>. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Обрамление текстом</guilabel></term> <listitem> <para>Определяет текст, который будет обрамлять шаблоны в данном каталоге. Это могут быть общие заголовки/концовки. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Предварительный текст</guilabel></term> <listitem> <para>Текст, вставляемый непосредственно перед содержанием шаблонов. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Завершающий текст</guilabel></term> <listitem> <para>Текст, вставляемый непосредственно после содержания шаблонов. </para> </listitem> </varlistentry> </variablelist> <!--<para> The properties for a template file looks a bit different: <mediaobject> <imageobject> <imagedata fileref="template-file-rmb.png" format="PNG"/> </imageobject> <caption><para>Properties dialog.</para></caption> </mediaobject> </para>--> <para>Через контекстное меню, вы можете управлять шаблонами. </para> </sect2> </sect1> <sect1 id="vpl-3-2"> <sect1info> <title><application>Визуальное позиционирование</application></title> <authorgroup> <author><firstname>Nicolas</firstname> <surname>Deschildre</surname> <affiliation> <address><email>nicolasdchd@ifrance.com</email></address> </affiliation> </author> <othercredit role="reviewer"><firstname>Christopher</firstname> <surname>Hornbaker</surname> <affiliation> <address><email>chrishornbaker@earthlink.net</email></address> </affiliation> <contrib>Рецензент</contrib> </othercredit> <othercredit role="translator"><firstname>Николай</firstname><surname>Шафоростов</surname><affiliation><address><email>shafff@ukr.net</email></address></affiliation><contrib>Перевод на русский</contrib></othercredit> </authorgroup> </sect1info> <title><application>Визуальное позиционирование</application></title> <sect2 id="vpl-views-3-2"> <title>Режимы &VPL;</title> <para><application>Визуальное позиционирование</application> (&VPL;), или <acronym>WYSIWYG</acronym> - What You See Is What You Get (что видишь, то и получаешь) позволяет вам редактировать &HTML; или &XHTML; следя за изменениями на лету. Как и в вашем любимом редакторе, вы можете щёлкнуть на документе, после чего появится курсор и вы сможете вводить текст, вставлять картинки, форматировать текст и т.д. &VPL; поможет вам создавать хорошие web-страницы без особых знаний языков разметки. </para> <para>&quantaplus; предлагает два режима &VPL;: <guilabel>Визуальный редактор</guilabel> и <guilabel>Совмещённый редактор</guilabel> (<guilabel>Визуальный редактор и редактор кода</guilabel>), которые можно переключить через меню <guimenu>Вид</guimenu>. Первый сменяет <guilabel>редактор кода</guilabel> на <guilabel>визуальный</guilabel>, а второй разделяет окно редактирования на две части: <guilabel>редактор кода</guilabel> и <guilabel>визуальный</guilabel>. </para> <para><guilabel>Визуальный редактор</guilabel> работает так: документ загружается как обычная страница &HTML; или &XHTML; и появляется курсор. Затем вы можете изменять его, и, после переключения в <guilabel>Редактор кода</guilabel>, вы увидите изменения, сделанные вами. </para> <note> <para>При редактировании в <guilabel>визуальном редакторе</guilabel> документа, содержащего &PHP;, вы увидите небольшой значок, представляющий код &PHP;. Вы не сможете редактировать его в этом режиме. </para> </note> <para>Второй режим такой же как и первый, за исключением того, что вы можете сразу увидеть изменения в коде, сделанные при редактировании в <guilabel>Визуальном редакторе</guilabel>, или наоборот, увидеть наглядно изменения в отображении документа при редактировании его в <guilabel>Редакторе кода</guilabel>. При этом курсоры в обоих редакторах синхронизируются. Этот режим можно загрузить клавишей <keycap>F9</keycap>, а если он уже загружен, нажатие этой клавиши приведёт к переходу фокуса с одной части на другую. </para> <para>Интервалы обновления <guilabel>Визуального редактора</guilabel> и <guilabel>Редакторе кода</guilabel> настраиваются. Перейдите в <menuchoice><guimenu>Настройка</guimenu> <guimenuitem>Настроить Quanta...</guimenuitem> </menuchoice>. Выберите вкладку <guimenu>Визуальное позиционирования</guimenu>. Если у вас мощный компьютер, можете сделать интервал обновления меньше. </para> <mediaobject> <imageobject> <imagedata fileref="vplsourceview.png" format="PNG"/> </imageobject> <caption><para>Режим <guilabel>Совмещённого редактора</guilabel>.</para></caption> </mediaobject> </sect2> <sect2 id="vpl-editing-3-2"> <title>Визуальное редактирование</title> <sect3 id="doc-prop-dia-3-2"> <title>Окно свойств</title> <para>Теперь, предположим вы хотите изменить заголовок вашей страницы. Для этого выберите <menuchoice> <guimenu>Сервис</guimenu> <guimenuitem>Свойства документа</guimenuitem></menuchoice>. С помощью этого средства вы сможете изменить <quote>невидимые</quote> в <guilabel>Визуальном редакторе</guilabel> теги. Этот диалог также запускается при создании нового документа при включённом режиме <guilabel>Визуального редактора</guilabel>. В нём вы можете изменить: </para> <variablelist> <varlistentry> <term><guilabel>Заголовок</guilabel></term> <listitem> <para>Заголовок документа. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Теги Meta</guilabel></term> <listitem> <para>Теги Meta позволяют записывать информацию о документе. например ключевые слова для поисковиков, информация об обновлениях. Для первого нужно ввести в поле <quote>name</quote> <quote>keywords</quote> и в поле <quote>content</quote> - <quote>слово1 слово2</quote>. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Правила CSS</guilabel></term> <listitem> <para><guilabel>Правила CSS</guilabel> - новый способ описания форматирования страницы. Вы можете добавлять и удалять <guilabel>правила CSS</guilabel> нажатием кнопок внизу. Кроме того можно заполнить такие поля, как <guilabel>Meta</guilabel>. Редактирование <guilabel>правил CSS</guilabel> ещё не реализовано. </para> </listitem> </varlistentry> <varlistentry> <term><guilabel>Внешняя таблица стилей CSS</guilabel></term> <listitem> <para>Нажмите кнопку<guilabel>Обзор</guilabel> и выберите файл стиля. </para> </listitem> </varlistentry> </variablelist> </sect3> <sect3 id="vpl-editor-3-2"> <title><guilabel>Визуальный редактор</guilabel></title> <para>Вы можете использовать курсор как и в вашем любимом редакторе, перемещая его стрелками (и всё же в некоторых случаях вы не сможете переместить курсор в необходимое вам место), вводить/вставлять и удалять/вырезать выделенный текст. </para> <para>Теперь мы подошли к вставке тегов. Вы можете вставлять изображения, аплеты, форматировать текст, например делать его полужирным, используя панели инструментов. Помните, что вставка определённого тега не удаляет такой же, если он уже есть. </para> <note> <para>Некоторые кнопки на панелях инструментов будут недоступны, например <guilabel>Мастер таблиц</guilabel>, <guilabel>Быстрый список</guilabel>. Они будут работать в визуальном режиме позже, т.к. их реализация требует времени. Вместо них вы можете использовать панели инструментов <guilabel>Таблицы</guilabel> и <guilabel>Списки</guilabel>. </para> </note> <para>Чтобы изменить тег (будь то изображение, аплет и т.д.), переключитесь в <guilabel>Дерево атрибутов</guilabel> через <menuchoice><guimenu>Вид</guimenu> <guisubmenu>Служебные панели</guisubmenu></menuchoice>. Щёлкните на теге, который вы хотите изменить, или на объекте, содержащем его. <guilabel>Дерево атрибутов</guilabel> отображает имя текущего тега, также как и список его родителей и атрибутов. На текущий момент визуальный режим не поддерживает т.н. &XHTML;+<acronym>MathML</acronym>, но вы всё же сможете изменять пространства имён (namespaces) в этом режиме. Просто нажмите на поле <guilabel>Значение</guilabel> и введите что хотите. Чтобы получить доступ к родителю текущего тега, выберите его в <guilabel>дереве атрибутов</guilabel>. </para> <para>Для удаления тега мы будем использовать <guilabel>Дерево атрибутов</guilabel>. Вы заметили два маленьких крестика в верхнем правом углу? Первый удаляет только текущий тег и, если спецификация &HTML;/&XHTML; не разрешает чтобы дочерние элементы удаляемого тега были без него, дочерние теги и т.д. Второй крестик удалит тег вместе с его содержимым (текстом между начальным и закрывающим тегами) без каких-либо поверок, так что будьте осторожны! </para> </sect3> </sect2> </sect1> </chapter>