Перейти до змісту
Домент ipb-board.ru продається.

Контактной Формы

Ciko
Ciko
в 3.4.x

Рекомендовані відповіді

Опубліковано
  • Адміністратор

Screenshot_1.png

Админ Панель-Внешний вид-Ваш стиль-Глобальные-globalTemplate ищем: 

<head>

После добавить: 

<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--><!--[if lt IE 9]>    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->

Админ Панель-Внешний вид-Ваш стиль-Глобальные-globalTemplate добавить куда вам будет хорошо: 

<div class="contact">
    <form action="#">
        <fieldset>					
            <div class="row">
                <section class="col col-2">
                    <label class="input">
                        <i class="fa fa-append fa-user"></i>
                        <input type="text" placeholder="Имя" required>
                    </label>
                </section>
                <section class="col col-2">
                    <label class="input">
                        <i class="fa fa-append fa-envelope-o"></i>
                        <input type="email" placeholder="E-mail" required>
                    </label>
                </section>
            </div>
            <section>
                <label class="input">
                    <i class="fa fa-append fa-tag"></i>
                    <input type="text" placeholder="Тема">
                </label>
            </section>               
            <section>
                <label class="textarea">
                    <i class="fa fa-append fa-comment"></i>
                    <textarea rows="4" placeholder="Сообщение" required></textarea>
                </label>
            </section>             
            <button type="submit" class="button">Отправить</button>
        </fieldset>						
    </form>
</div>

Админ Панель-Внешний вид-Ваш стиль-css-ipb_styles.css добавить у самый или как вам будет удобно взять и создать свой css-файл 

.contact {
  max-width: 467px;
  min-width: 320px;
  margin: 0 auto;
  background: rgba(255,255,255,0.9);
  box-shadow: 0 0 8px rgba(0,0,0,.3);
}
.contact * {
  outline: none;
  border: 0;
  background: none;
}
form fieldset {
  display: block;
  padding: 25px 30px;
}
form .row {
  margin: 0 -15px;
}
form .col-2 {
  width: 50%;
}
form .col {
  float: left;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}
form .row:after {
  content: '';
  display: table;
  clear: both;
}
 form section {
  margin-bottom: 20px;
}
form .input, form .textarea, form .radio, form .checkbox, form .button {
  position: relative;
  display: block;
}
form .fa-append {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 29px;
  height: 29px;
  padding-left: 3px;
  border-left: 1px solid #e5e5e5;
  font-size: 15px;
  line-height: 29px;
  text-align: center;
  color: #ccc;
}
.fa {
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa-user:before {
  content: "\f007";
}
.fa-envelope-o:before {
  content: "\f003";
}
.fa-tag:before {
  content: "\f02b";
}
.fa-comment:before {
  content: "\f075";
}
form .input .fa-append + input, form .textarea .fa-append + textarea {
  padding-right: 46px;
}
form .input input, form .textarea textarea {
  display: block;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  width: 100%;
  height: 39px;
  padding: 8px 10px;
  outline: none;
  border: 2px solid #e5e5e5;
  border-radius: 0;
  background: #fff;
  font: 13px/19px 'Open Sans', Helvetica, Arial, sans-serif;
  color: #404040;
  appearance: normal;
  -moz-appearance: none;
  -webkit-appearance: none;
  transition: border-color 0.3s;
  -o-transition: border-color 0.3s;
  -ms-transition: border-color 0.3s;
  -moz-transition: border-color 0.3s;
  -webkit-transition: border-color 0.3s;
}
form .textarea textarea {
  height: auto;
  resize: none;
  overflow:auto;
}
form .input:hover input,
form .textarea:hover textarea,
form .checkbox:hover i {
   border-color: #00BDAB;
}
form .input input:focus,
form .textarea textarea:focus,
form .checkbox input:focus + i {
	border-color: #009688;
}
form .button {
  float: right;
  height: 39px;
  overflow: hidden;
  margin-left: 20px;
  padding: 0 20px;
  outline: none;
  border: 0;
  background-color: #009688;
  font: 300 13px/39px 'Open Sans', Helvetica, Arial, sans-serif;
  text-decoration: none;
  color: #fff;
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -webkit-transition: opacity 0.2s;
}
form .button:hover {
  opacity: 1;
}
@media screen and (max-width: 470px){
	.col, .col-2 { float: none !important; width: 100% !important;}
}
Опубліковано

А реально ли сделать, чтоб была отдельная страница для этой формы связи, то есть например переходишь по ссылке Пример: www.сайт.ру/svaz и там будет эта форма связи?

Опубліковано

Почиму и нет реально

А как сделать, не подскажете? думаю многим понадобится такая штука =)

Опубліковано
  • Автор
  • Адміністратор

Ета допилнительно нужно писать php файли при переходел наприклад: ipb-board.com/kontus
Потом виложу FAQ

Опубліковано

Ета допилнительно нужно писать php файли при переходел наприклад: ipb-board.com/kontus

Потом виложу FAQ

Хорошо, спасибо!

    •
    • Подобається 1
    Опубліковано
    • Автор
    • Адміністратор

    Ну ета добавить в саму страницу
     

    <div class="contact">    <form action="#">        <fieldset>					            <div class="row">                <section class="col col-2">                    <label class="input">                        <i class="fa fa-append fa-user"></i>                        <input type="text" placeholder="Имя" required>                    </label>                </section>                <section class="col col-2">                    <label class="input">                        <i class="fa fa-append fa-envelope-o"></i>                        <input type="email" placeholder="E-mail" required>                    </label>                </section>            </div>            <section>                <label class="input">                    <i class="fa fa-append fa-tag"></i>                    <input type="text" placeholder="Тема">                </label>            </section>                           <section>                <label class="textarea">                    <i class="fa fa-append fa-comment"></i>                    <textarea rows="4" placeholder="Сообщение" required></textarea>                </label>            </section>                         <button type="submit" class="button">Отправить</button>        </fieldset>						    </form></div>

    А сам css код добавить в ipb_style.css в самий ныз
    И еще не забуть
     

    <head>

    Вставить после:
     

    <!--[if lt IE 9]>    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
    •
    • Подобається 1
    Опубліковано

    Мой код в php был такой 

    <?php define( 'IPB_THIS_SCRIPT', 'public' );require_once( '../initdata.php' ); require_once( IPS_ROOT_PATH . 'sources/base/ipsRegistry.php' );require_once( IPS_ROOT_PATH . 'sources/base/ipsController.php' ); $title = 'Название страницы';$content = <<<BLK <div class="contact"><form action="#"><fieldset>                    <div class="row"><section class="col col-2"><label class="input"><i class="fa fa-append fa-user"></i><input type="text" placeholder="Имя" required></label></section><section class="col col-2"><label class="input"><i class="fa fa-append fa-envelope-o"></i><input type="email" placeholder="E-mail" required></label></section></div><section><label class="input"><i class="fa fa-append fa-tag"></i><input type="text" placeholder="Тема"></label></section> <section><label class="textarea"><i class="fa fa-append fa-comment"></i><textarea rows="4" placeholder="Сообщение" required></textarea></label></section> <button type="submit" class="button">Отправить</button></fieldset>                        </form></div> BLK; $registry = ipsRegistry::instance();$registry->init();$output = $registry->output; $output->setTitle($title);$output->addContent($content);$output->sendOutput();

    Для публікації повідомлень створіть обліковий запис або авторизуйтесь

    https://ipb-board.com/topic/155-kontaktnoy-formy/
    Перейти до списку тем