Contact form 7 style плагин. Советы, хаки, секреты

Supports custom styling, which can be easily managed via admin dashboard. Also has predefined templates like Simple Pattern, Valentine’s Day, Christmas that can be activated on your Contact Form 7.

Custom style options:

— color styling,
— custom fonts (google fonts included),
— styling for input fields, text, textarea, labels, submit button, messages, placeholders,
— border-color,
— form background-color,
— form transparent background-color,
— form background-image,
— form container styling,
— form container background-image styling,
— form placeholder opacity styling,
— customized style can be imported / exported
— quick edit option
— support multiple forms with different design
— Style Template Slider on the Contact Form 7 form Settings page
— px,em, % unit selector for all the specified style settings
— possibility to change the syling for the HOVER state of each element
— live preview on changing/adding the new style properties of each element
— possibility to customize error messages, success messages and warning messages
— setting page, where can re-import deleted default templates, deactivate collecting data and / or manipulate the appearance of the «edit style» button on the page where you have your contact form 7 form

Скриншоты

Установка

Upload the entire contact-form-7-style folder to the /wp-content/plugins/ directory
Make sure that Contact Form 7 is installed and activated (an admin notice will check for this)
Activate the plugin through the ‘Plugins’ menu in WordPress

You will find ‘Contact Style’ menu in your WordPress admin panel.

Отзывы

I spent about 2 hours on this plugin, going back and forth, looking through settings options over and over, refreshing over and over again, but after all that time, the plugin worked on 1 form but did nothing on the secondary form. I tried selecting other formats, other designs, tried selecting them so they"d show as "active" multiple times and then refreshing, cleaning my cache, on and on and the second fomr just will not take the plugin or changes made within it no matter what. So, ultimately unless there is some bizarre step that isn"t working, it doesn"t look good to have 1 form that looks modern and 1 that does not and can"t be changed. Very discouraging. It"s a great idea for plugin that is much-needed (CF7 is still a great plugin but looks very outdated and basic) and there simply are no other styling plugins for it that seem to work reliably so back to square one trying to find another plugin.I mean it"s nice that 1 form looks current but the second form that cannot be changed kind of throws a monkey wrench into the mix. Update: I was able to get the plugin to work on two different forms on two separate site pages so that the designs would look the same, but it just took several instances of going back and forth and tweaking and resetting the two different areas of settings that control the layout and look of the form. It works, just requires patience and going back and forth several times and clearing caches and retrying a few times.

Журнал изменений

3.1.8

Release Date: March 6th, 2018

Removed functionality for non sensitive data tracking (not using this feature anymore) and removed status report too

3.1.7

Release Date: March 6th, 2018

Major Fix Fixed I/O process with reducing the json requests from the servers
Fixed the problem where the form was missing some settings when multiple form were selected in the custom style part
Improvement Added settings to hide/show Contact Form 7 Style link

3.1.6

Release Date: November 7th, 2017

Major Fix Fixed slash error and added extra condition to check for response

3.1.5

Release Date: November 6th, 2017

Major Fix Fallback for setups where json file can not be accesed by wp_remote_get

3.1.4

Release Date: November 4th, 2017

Major Fix Background image rendering fixed (added «url()»)

3.1.3

Release Date: November 3rd, 2017

Placeholder elements styling and hover too + preview generate
Opacity settings for placeholders
Updated fonticons
Contact Form 7 «Go To CF7» button to edit form structure
Notifications handling modified
Removed transparent checkbox from font color
Updated plugin file structure for better code management
JSON files for plugin settings
Works with PHP 7
Compatible with WordPress Multisite
Refactored style generator
General bugfixing

3.1.2

Small Fix de-activated the possibility to drag boxes around
Small Fix added possibility to add transparent background
Small Fix added new Force CSS settings possibility to plugin
Small Fix customized styling to remove this issue
Small Fix added possibility to add 0 padding / 0 margin
Possible to add negative margins on custom templates
Possible to add decimal values for «%» and «em» units
Added tooltip on settings page for better understanding
general bugfixing
user interface improvements

3.1.1

Major Fix for custom styles
Styling issue on buttons
CSS generator core upgraded

3.1.0

New Feature Error, confirmation, success message customization added
New Feature Added settings field, where you can activate or deactivate the «edit custom style» button
modified settings page field generation, now it will remove every hidden field to improve page load
New predefined templates available
for reliability and speed
User interface improvements
general bugfixing

3.0.5

Major Fix Headers already sent
Major Fix SSL security fix for Google Fonts
Parse error: syntax error, unexpected T_STATIC
general bugfixing

3.0.4

Major Fix Fixed CSS editor «\» multiplier removed
Collection data functionality to prevent fatal error for various server setups
Prevent existing style data loss based on a new versioning system functionality
Publish or Update Style button
New feature — System Status page with the possibility to ask for help from the Contact Form 7 Style team by email
New feature — Settings page — Install predefined templates or Allow collection data
General bugfixing

3.0.3

Major Fix JQuery conflict with Siteorigin Page Builder and Visual Composer

3.0.2

New feature — generate cf7 form preview buttons added when creating new custom style
Improvements — preview generations on various user interactions

3.0.1

New feature — width and height styling properties for radio elements
New feature — width and height styling properties for checkbox elements
Improvements — general bugfixing

3.0.0

UI rework, update, redesign
New feature — Live Preview on all element changes with the actual Contact Form 7 form where the styling is applied
New feature — Hover state design for all elements
New feature — Style Selector Slider on Contact Form 7 Settings page, for quick style selection
New feature — Introduced new unit selector
New feature — Introduced new background-image add-on
New feature — Introduced new styling properties
New feature — Introduced fieldset, dropdowns, radio, checkbox
Improvements — Bugfixing, running process, code updates
Improvements — Modified Custom Styling logic and add it to new settings page
Improvements — Message boxes behaviour
Improvements — autocomplete styling where possible

2.2.8

Optimize responsive view for predefined templates on mobile devices
Added Invitora WordPress Theme compatibility
Added support for special characters and fixed bugs

2.2.7

Improvements for reliability and speed
Enhanced plugin stability and fixed bugs
Added Bretheon Premium WordPress Theme compatibility

2.2.6

Added Avada Theme compatibility
Added Bridge — Creative Multi-Purpose WordPress Theme compatibility
Added Flatco — Multipurpose & Responsive WordPress Theme compatibility
Improve CSS Editor UI

2.2.5

2.1

New feature — Google fonts preview when edit the style
New feature — List all styles thumbnail preview for predefined templates

2.0.1

Admin panel minor adjustments

2.0

New UI Admin settings options
Use custom post type for individual style set up
Multiple cf7 forms can have their own style
Style can be activated only for certain cf7 forms
All google fonts available for use
Styling improvement for theme twentyfifteen, twentyfourteen
New settings available
Possibility to change certain settings for the «custom style» styles
Style filtering by categories for easier use
Possibility to save your settings and import / export the generated «custom style»
Donate option for support the plugin’s continued development and better user support

1.1.1

Added plugin update notification in plugin template selection panel

1.1.0

Added Valentine’s Day templates for 2014.
Fixed Xmas Red header and footer position
Added Custom Style submenu for styling the templates

В своих wordpress проектах я очень часто использую плагин contact form 7 . Он очень удобный, гибкий и обладает множеством плюсов, однако как и в большинстве бесплатных плагинов в нем есть свои «болезни». И одна из них — малое количество хуков и, как следствие трудная настройка contact form 7 полей, элементов ит.п. Поэтому далее я распишу как можно изменить внешний вид сообщений в contact form 7 при отправке формы …

Отключаем стандартные contact form 7 стили

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

Для этого, в файле functions.php добавляем следующий код:

Удаляем все стили

add_filter("wpcf7_load_css", "__return_false");

add_filter ("wpcf7_load_css" , "__return_false" ) ;

Теперь, когда старые стили удалены, можно сверстать/взять новые css стили сообщений (например ) и прикрутить их к contact form 7. Для примера, я уже имею свои готовые стили alert-ов и буду использовать их:

Отключение скриптов

Возвращаемся в functions.php файл и добавляем следующий код:

Регистрируем новый скрипт cf7

if (! function_exists("wpcf7_do_enqueue_scripts")) { function wpcf7_do_enqueue_scripts() { if (wpcf7_load_js()) { $in_footer = true; if ("header" === wpcf7_load_js()) { $in_footer = false; } wp_enqueue_script("contact-form-7", get_theme_file_uri("NEW_PATH"), array("jquery"), WPCF7_VERSION, $in_footer); } } add_action("wp_enqueue_scripts", "wpcf7_do_enqueue_scripts", 9); }

if (! function_exists ("wpcf7_do_enqueue_scripts" ) ) {

function wpcf7_do_enqueue_scripts () {

if (wpcf7_load_js () ) {

$in_footer = true ;

if ("header" === wpcf7_load_js () ) {

$in_footer = false ;

wp_enqueue_script ("contact-form-7" , get_theme_file_uri ("NEW_PATH" ) , array ("jquery" ) , WPCF7_VERSION , $in_footer ) ;

add_action ("wp_enqueue_scripts" , "wpcf7_do_enqueue_scripts" , 9 ) ;

В коде выше, мы перезаписываем нативный скрипт contact form плагина на наш и подключаем его через функцию wp_enqueue_script . Кстати, если вы начинающий (или нет) разработчик и хотите узнать больше о встроенных функция в WordPress, то возможно вам будет интересна .

NEW_PATH — путь до нового js файла в теме, который нужно скопировать из wp-content/plugins/contact-form-7/includes/js/scripts.js

Зачем подключать новый скрипт?

Все просто. При отправке формы, сообщения/их статус «подтягиваются» через AJAX, т.е грубо говоря contact form после submit возвращает какой-то кусок html кода, который каждый раз перезаписывается, и естественно отслеживать постоянно на триггерах, когда обновится форма — неправильно. Можно конечно динамически отслеживать DOM через MutationObserver , но и он имеет свои определенные недостатки. Гораздо проще перезаписать главный скрипт cf7 плагина и уже внутри изменить js код под свои нужды.

Меняем внешний вид

Далее осталось только открыть скопированный js файл и внести нужные изменения. В моем случае, необходимо только добавлять/удалять классы для сообщений в зависимости от статуса — spam / mail_sent / mail_failed и т.д. Для этого в методе var ajaxSuccess = function(data, status, xhr, $form) { в case выборке просто манипулируем нужными классами. В итоге при отправке формы, получаем красивые стилизованные сообщения:

Популярный плагин Contact form 7 не отличается особой красотой своей стандартной формы, по этому для многих пользователей встает вопрос, как изменить внешний вид. Именно этим мы сейчас и займемся, я попытаюсь дать вам универсальный вариант, который подойдет для любого сайта.

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

Для начала нам нужен и файлу style.css, его можно найти во вкладке «Внешний вид»/»Редактор». По умолчанию, именно нужный файл вам и откроется. Рекомендую открыть несколько вкладок в браузере:

Вкладка Contact Form 7 для правки формы.
Страницу на сайте с формой обратной связи.
Редактор с открытым файлом CSS.

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

Добавляем классы к форме Contact Form 7.

Когда мы откроем форму для правки мы увидим примерно следующую картину:

Такая форма обратной связи будет выглядеть примерно так:

Скучно, не пропорционально, скажем прямо не красиво.

Для изменения внешнего вида формы нужно немного поработать со стилями, но для начала добавим несколько классов в шаблон формы. Для этого открываем форму для правки (как на картинке выше) и дописываем следующие классы:

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

Классы добавлены, пока ничего не изменилось, следующим шагом будет определение id формы.

Определяем ID формы на странице.

Для начала нужно понять что одна и та же форма будет иметь разные id на разных страницах сайта, так устроен плагин, он добавляет дополнительный параметр при каждом вызове формы. Сейчас разберем поподробнее.

Для правки формы нужно ее добавить на страницу или в запись, в необходимом месте, то-есть вставить шорткод. После этого переходим на эту страницу и кликаем по форме правой кнопкой мыши и выбираем пункт «Просмотреть код» это для браузера Chrome, если у вас другой, то там примерно такой же текст.

В открывшемся коде ищем начало нашей формы, выглядит это так:

Именно это и будет id формы. Возвращаясь назад, покажу какой id имеет эта же форма на другой странице.

Как видим, идентификатор отличается всего несколькими цифрами. По этому для начала нужно определиться на какой странице будет расположена форма, а уж затем приступать к правке стилей.

Ну что, очередной шаг сделан, мы определили id, прописали наши классы, теперь приступим непосредственно к изменению внешнего вида.

Стилизация формы Contact Form 7, работа с файлом style.css

Забегая вперед скажу что предложенный мной вариант навряд покажется вам идеальным. Дело в том что каждый кто читает эти строки хочет видеть свою форму именно такой какой он ее представляет. Я не телепат, и не смогу угодить всем, но постараюсь дать вам наводку где и в каком месте искать информацию и что изменять. Так что простите сразу за возможное разочарование, панацеи нет, придется и вам немного поработать.

Изменяем цвет фона, отступы, шрифт формы.

После проделанной работы переходим к стилям. Сперва изменим (если это нужно) фоновый цвет формы, подгоним наши отступы, подберем необходимый шрифт и цвет текста. Все эти настройки будем проводить заранее зная ID. Как его узнать, мы рассматривали выше.

Сперва обратимся к файлу style.css, добавим первые правила для ID формы (добавлять нужно в самом низу файла), в моем случае это wpcf7-f172-p34-o1, вам же нужно подставить ваш идентификатор:

#wpcf7-f172-p34-o1 {
margin: 5px;
padding: 10px;
background: #B3AFAF;
font-family: Georgia, «Times New Roman», Times, serif;
color: #000;
}

Теперь разберем все подробнее:

Вначале займемся отступами. Внешние отступы (от края до начала формы) - margin: 5px, внутренние отступы (от начала формы до внутренних элементов) -padding: 10px.
Заливка формы или ее фон определяется свойством background: #B3AFAF, цвет можете подбирать какой угодно, просто заменив значение.
Определяемся с семейством шрифта, если менять не хотите можно не прописывать это правило (font-family: Georgia, «Times New Roman», Times, serif).
Цвет текста определяет свойство color, которое сейчас стоит в черном цвете (color: #000).

С данными параметрами можете экспериментировать сами, подбирать отступы, цвета и шрифты. Для этого нужно лишь изменить значение, сохранить новый вариант, обновить страницу и посмотреть изменения. Не бойтесь экспериментов, тут вы не сможете поломать ничего, в крайнем случае стили просто не сработают и вы легко все исправите как было.

Определяем отступы между полями, изменяем рамку.

Переходим к нашим полям, добавим отступов:

#wpcf7-f172-p34-o1 p{
margin:5px;
}

Это отступы по краям полей, что бы текст и блоки не сливались в одно целое.

Следующим этапом будут рамки, я дам свой вариант, а вы сможете найти в сети множество вариантов которые вам понравятся и заменить их.

#wpcf7-f172-p34-o1 input,textarea {
border: 3px double #000;
}

О рамках немного подробнее. Значение в 3px это ширина рамки, double двойное использование (если не нужно, можно удалить это слово), #000 цвет рамки так же можете подобрать свой.

Меняем ширину полей и их расположение.

Name-cf {
float:left;
padding: 2px;
}
.name-cf input {
width: 270px;
}
.thems-cf input {
width: 100%;
}
.clear-cf {
clear: both;
}
.text-cf textarea {
width: 100%;
}

Теперь разберем все поподробнее:

Первый класс к которому мы обратимся name-cf он принадлежит полям с именем и емейлом. Для них задаем отступ в 2px (padding: 2px ) и обтекание (float:left ), что бы выровнять два поля в один ряд.
Далее подправим ширину полей задав им оптимальный (для моего шаблона) размер в 270px (.name-cf input { width: 270px; } ). Если у вас поля все еще в одну строчку или же слишком маленький размер, подберите свой вариант.
Поле с названием темы сделаем на всю ширину формы, так как текста там может быть больше (.thems-cf input { width: 100%;}). Если вы хотите свое, точное значение укажите его в пикселях.
Следующий блок который мы добавили к форме предназначен для отмены обтекания (.thems-cf input {width: 100%; } ).
Так же как и в предыдущем случае, поле с текстом сообщения делаем на всю ширину (text-cf textarea {width: 100%;} ).

Можно обновить файл стилей и посмотреть на изменения, если нужно, подогнать размеры под ваши нужды.

Выравниваем кнопку «Отправить» по центру, изменяем фон и ширину.

Переходим к нашей кнопке, выровняем по центру и добавим фон:

Submit-cf {
width: 200px; /*ширина блока*/
height: 25px; /*высота*/
margin: 0 auto; /* Отступ слева и справа */
}
.submit-cf input {
width: 200px;
background:#96B195;
}

Традиционно объясняю что к чему:

Первым правилом мы определяем ширину и высоту блока в котором будет размещена кнопка и ставим ее по центру формы.
Вторым правилом задаем цвет фона кнопки (background:#96B195, если не указать будет такого же цвета как и все остальные поля), устанавливаем ширину кнопки (width: 200px , желательно что бы была такого же размера, как ширина блока, что бы кнопка не двигалась в стороны).

Сохраняем наши настройки и смотрим что у нас получилось:

Соглашусь далеко не шик, но зато адекватно смотрится в целом, ниже форма по умолчанию, думаю эффект очевиден. В любом случае мы научились изменять внешний вид формы Contact Form 7 .

Надеюсь для вас статья была полезной, если же что-то не так или возникли проблемы оставьте свой комментарий и я постараюсь ответить (подправить).

С помощью плагина Сontact form 7 быстро создается форма обратной связи на wordpress сайте. Форма обратная связь очень частое явление, она присутствует на многих коммерческих сайтах. Плагин contact form 7 совершенно бесплатный и на русском языке, что делает работу с ним удобной и быстрой. Он не новый, но пользуется своей популярностью и сейчас.

Обратная связь на WordPress

Веселый у нас народ, а главное честный...к чему это я. Недавно узнал как одна фирма попросила «контору по созданию и раскрутке сайтов» добавить им форму обратной связи на главную страницу. Данный прием является очень хорошим ходом для привлечения новых запросов от клиентов и пользуется своей популярностью.

Заплатили за такую форму, вы сейчас упадете, 40 000 рублей. Именно такую сумму озвучили и, что самое интересное, с ними согласились и все оплатили. Речь не идет про супер форму, в которой присутствует много всплывающих окон, варианты выбора из списка и другие навороты. Все простенько и скромненько. Москва есть Москва).

Кстати, вот такую форму на рисунке со всеми фишками с нуля, мне заплатили 15 000 рублей. В ней присутствует три варианта отправки формы, заполненные поля с выбором и другие мелкие прибамбасы. Данная форма сделана с нуля, аналогов конечно много, но именно такая присутствует только на одном сайте.

Кстати, если вы не хотите устанавливать дополнительный плагин на сайт по каким то причинам, есть способ добавить форму обратной связи на wordpress без плагинов. Такой пример я наводил . Только с добавлением кода, без никаких плагинов.

Contact form 7: Настройка

Не будем усложнять задачу, с помощью плагина contact form 7 можно быстро и без труда добавить на сайт wordpress простую форму обратной связи. Она не будет сильно подгружать сервер, работает без сбоев и проблем. Заходим в Плагины — Добавить новый и пишем в поиске его название. После того, как вы его скачали и установили, слева в админке появится новая строчка contact form 7.

Заходим в админку сайта, Плагины.
Пишем в поиске contact form 7.
Устанавливаем и настраиваем.

Заходим в нее и добавляем новую форму. Перед созданием самой формы, вам предложить выбрать язык, русский язык присутствует, его и выбираем. Первая вкладка «Шаблон формы». В ней происходит добавление новый полей в форму. Сверху присутствую разные кнопки для вставки новых полей. Нажимаем, выбираем и добавляем к себе на форму по очереди поля, которые вам нужны.

Я покажу вам вариант самой стандартной формы, которую можно использовать на большинстве сайтов. Если некоторые строчки вам не нужны, их можно убрать.

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

Все поля не обязательные для заполнения. Если нужно сделать некоторые поля обязательным для заполнения contact form 7, просто пишите (обязательно) в необходимый пункт и все будет работать. Пример показан на рисунке ниже.

Чтоб не переписывать данные из картинки, показываю пример всего кода для вставки. Скопируйте в свою форму и сохраните настройки. На второй вкладке «Письмо» можно (нужно) указать почтовый ящик, куда будут приходить все запросы.

Ваше имя (обязательно)

Ваш e-mail (обязательно)

Опишите Вашу проблему...

Телефон (обязательно)

Вашеимя(обязательно)

[ text* your - name ]

Вашe - mail (обязательно)

[ email* your - email ]

ОпишитеВашупроблему. . .

[ textarea your - message ]

Телефон(обязательно)

[ tel tel - 378 ]

[ file file - 143 ]

[ quiz quiz - 740 class : blank _ 3"Сколько будет? 7+5=?|12" ]

[ submit "Отправить" ]

После того, как вы все сделали и сохранили, плагин покажет вам одну строчку шорткода, это и есть сама форма. Ее нужно вставить в любое место на сайте, где должна появиться готовая форма. Обычно вставку делают через виджеты в сайдбар. Вы подумали это конец?) не совсем.

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

Я не добавлял в таблицу стилей новые классы и так далее. Можно и так найти уже созданные стили данной формы и добавить в нее свои. Для этого нужно воспользоваться плагином для браузера FireBug и вы легко сможете добавить свои стили в вашу форму. Добавить можно все, что угодно...все зависит от вашей фантазии.Какие свойства используются для изменения шрифта можно .

wp-content/plugins/contact-form-7/modules

Вот в этой папке есть два файла (textarea.php) и (text.php). В них и находятся стили для формы, которые можно изменять и добавлять новые свои. Например, если нужно изменить длину ячейки, в файле (textarea.php) есть строчка: $atts["cols"] = $tag->get_cols_option ("27");Цифра 27 как раз и отвечает за длину ячейки.

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

После установки плагина Contact Form 7 и вывода формы на страницу, она выглядит примерно так.

Согласитесь, не очень выразительно. Но её вид можно легко поправить.

Если вы умеетe изменять/добавлять стили CSS, вероятно, вы захотите начать со стилизации полей .

Wpcf7 input, .wpcf7 input, .wpcf7 textarea { /* здесь стили: цвет, фон, шрифт, размер, границы и др. */ }

Затем, чтобы усилить сочетание с вашей темой, можно поправить стили для всей формы .

Wpcf7 { /* здесь стили: цвет, фон, шрифт, размер, границы и др. */ }

Как задать стиль только для конкретного поля? Предположим, вы хотите изменить стили для необязательного поля ‘Тема ‘, которое присутствует в форме по умолчанию после активации плагина.

Всего лишь нужно добавить ID для нужного поля в шаблоне формы.

Тема [ text your-subject id:fb-subject ]

После чего можно прописывать свои стили CSS.

#fb-subject { /* здесь стили: цвет, фон, шрифт, размер, границы и др. */ }

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

Вот еще плагин Form Styles For Contact Form 7 с простыми, но симпатичными предустановленными стилями .

Простая и чистая форма контактов — Contact Form Clean and Simple — с разметкой Bootstrap, Google капчей и спам-фильтрами . Кстати, обратите внимание, довольно популярный плагин.

Если вы поищете самостоятельно в интернете, уверен, вы найдете многочисленные шаблоны и стили для Contact Form 7.

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

Возможно, будет полезно почитать: