Меню
Бесплатно
Главная  /  Прошивка  /  Бобовые html modules php name. Создание своего стиля сhrome для модулей

Бобовые html modules php name. Создание своего стиля сhrome для модулей

Мы поверхностно коснулись темы методов вывода контента в теле шаблона. Давайте теперь подробно разберем что это и с чем его едят. Итак, объявления метода jdoc присутствуют в каждом шаблоне Joomla и выводят в тело шаблона (то бишь на страницу сайта) ту или иную информацию. В целом объявление метода выглядит следующим образом

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

1. type - типы элементов вывода.

  • component - как писал выше, выводит основное содержание страницы. Может вызываться только один раз в шаблоне.
  • head - объявляется так же один раз после открывающего тэга . Служит для вывода стилей, скриптов, и метаданных текущей страницы.</li><li><i>message </i><i>- </i> выводит системные сообщения. Объявляется один раз в теле документа (body).</li><li><i>installation </i> - ничего не выводит и представляет собой «инструкцию» для установки.</li><li><i>module - </i>выводит на странице единичный модуль. Количество объявлений не ограничено.</li><li><i>modules </i> - в отличии от предыдущего типа, позволяет выводить в своей позиции не единичое число модулей.</li> </ul><p>Для первых четырех указанных типов достаточно лишь указать их на странице. В случае с типом модуля задача немного усложняется. Для того, чтобы вывести на странице модуль нам нужно сперва создать для него <b>модульную позицию </b> с <a href="/education/gde-hranyatsya-sessii-php-php-sessii-pod-skalpelem-kak-rabotayut-php.html">уникальным идентификатором</a> (название позиции модуля). Это делается при помощи атрибута name=«имя позиции» и обязательным добавлением строки:</p><p> <position>название позиции</position> в файл templateDetails.xml. Описывая название позиции в templateDetails.xml мы обозначаем ее в системе и видим в менеджере модулей. Имена позиций могут быть произвольными, хотя name=«user3» позиция, по-умолчанию используется для отображения верхнего меню. </p><p><b>2. style - описание стиля вывода (mod chrome). </b></p> <p>От указанного стиля зависит <a href="/installation-and-configuration/obzor-inkling-cifrovogo-pera-ot-wacom-cifrovoe-pero-vneshnii-vid-i.html">внешний вид</a> и структура оболочки модуля. Выглядит как</p><p> :<jdoc:include type="modules" name="user1" style="xhtml" /> По-умолчанию заложено несколько стилей вывода модулей: </p><ul><li><i>xhtml - </i> выводит модуль в блоке с заголовком function modChrome_xhtml($module, &$params, &$attribs)<br>{<br> if (!empty ($module->content)) : ?><br> <div class="moduletable<?php echo htmlspecialchars($params->get("moduleclass_sfx")); ?>"><br> <?php if ($module->showtitle != 0) : ?><br> <h3><?php echo $module->title; ?></h3><br> <?php endif; ?><br> <?php echo $module->content; ?><br> </div><br> <?php endif;<br>}</li><li><i>table - </i>выводит модуль в верстке табличной структуры<br> function modChrome_table($module, &$params, &$attribs)<br>{ ?><br> <table cellpadding="0" cellspacing="0" class="moduletable<?php echo htmlspecialchars($params->get("moduleclass_sfx")); ?>"><br> <?php if ($module->showtitle != 0) : ?><br> <tr><br> <th><br> <?php echo $module->title; ?><br> </th><br> </tr><br> <?php endif; ?><br> <tr><br> <td><br> <?php echo $module->content; ?><br> </td><br> </tr><br> </table><br> <?php<br>}</li><li><i>horz - </i>выводит содержимое модуля в ячейке таблицы, горизонтально function modChrome_horz($module, &$params, &$attribs)<br>{ ?><br> <table cellspacing="1" cellpadding="0" width="100%"><br> <tr><br> <td><br> <?php modChrome_table($module, $params, $attribs); ?><br> </td><br> </tr><br> </table><br> <?php<br>}</li><li><i>rounded </i> - выводит модуль в нескольких вложенных блоках для сложного стилевого оформления в виде графических границ (напр. закругленных углов) function modChrome_rounded($module, &$params, &$attribs)<br>{ ?><br> <div class="module<?php echo htmlspecialchars($params->get("moduleclass_sfx")); ?>"><br> <div><br> <div><br> <div><br> <?php if ($module->showtitle != 0) : ?><br> <h3><?php echo $module->title; ?></h3><br> <?php endif; ?><br> <?php echo $module->content; ?><br> </div><br> </div><br> </div><br> </div><br> <?php<br>}</li><li><i>outline </i> - добавляет к блоку модуля предустановленные стили css function modChrome_outline($module, &$params, &$attribs)<br>{<br> static $css=false;<br> if (!$css)<br> {<br> $css=true;<br> jimport("joomla.environment.browser");<br> $doc = JFactory::getDocument();<br> $browser = JBrowser::getInstance();<br> $doc->addStyleDeclaration(".mod-preview-info { padding: 2px 4px 2px 4px; border: 1px solid black; position: absolute; background-color: white; color: red;}");<br> $doc->addStyleDeclaration(".mod-preview-wrapper { background-color:#eee; border: 1px dotted black; color:#700;}");<br> if ($browser->getBrowser()=="msie")<br> {<br> if ($browser->getMajor() <= 7) {<br> $doc->addStyleDeclaration(".mod-preview-info {filter: alpha(opacity=80);}");<br> $doc->addStyleDeclaration(".mod-preview-wrapper {filter: alpha(opacity=50);}");<br> }<br> else {<br> $doc->addStyleDeclaration(".mod-preview-info {-ms-filter: alpha(opacity=80);}");<br> $doc->addStyleDeclaration(".mod-preview-wrapper {-ms-filter: alpha(opacity=50);}");<br> }<br> }<br> else<br> {<br> $doc->addStyleDeclaration(".mod-preview-info {opacity: 0.8;}");<br> $doc->addStyleDeclaration(".mod-preview-wrapper {opacity: 0.5;}");<br> }<br> }<br> ?><br> <div class="mod-preview"><br> <div class="mod-preview-info"><?php echo $module->position."[".$module->style."]"; ?></div><br> <div class="mod-preview-wrapper"><br> <?php echo $module->content; ?><br> </div><br> </div><br> <?php<br>}</li><li><i>none </i> - аналогично не указанному вообще style. Выводит модуль без оформления и заголовка function modChrome_none($module, &$params, &$attribs)<br>{<br> echo $module->content;<br>}</li> </ul><p>Все предустановленные стили располагаются в файле templates/system/html/modules.php. Но мы не ограничены использованием только предоставленных вариантов, а вполне можем создавать свои собственные.</p> <p><b>3. Создание пользовательского mode chrome. </b></p> <p><b><br></b>Итак, предоставленные по умолчанию типы представления модулей не удовлетворяют текущих требований. Нужно добавить свой собственный стиль оформления. В качестве примера выберем достаточно часто повторяющуюся ситуацию. По заданию нужно вместо <h3> поместить заголовок модуля в тэг <span>, который является семантически нейтральным. Так же требуется поместить контентблок модуля в отдельный <div>. Для создания собственного стиля вывода модуля, воспользуемся стандартными средствами. В большинстве шаблонов Joomla существет папка html/ (templates/имя шаблона/html/), используется для так называемой шаблонизации. То есть, если скопировать в эту папку шаблон модуля, то вместо шаблона из директории modules/my_module/tmpl/default будет выводиться файл из templates/имя шаблона/html/my_modules/default. Аналогично шаблонизируются и компоненты. Удобно и практично. В папке html/ Вашего шаблона создадим файл modules.php. Если такой папки в шаблоне нет, то создадим ее. В файл запишем</p><p> <?php<br>function modChrome_modbox($module, &$params, &$attribs) // Вызываем функцию<br>{<br> if (!empty ($module->content)) : /* Проверяем наличие в поиции включенного модуля */?><br> <div class="moduletable<?php echo htmlspecialchars($params->get("moduleclass_sfx")); /* выводим суффикс css класса модуля */ ?>"><br> <?php if ($module->showtitle != 0) : /* проверяем включен ли заголовок модуля */ ?><br> <span class="title"><?php echo $module->title; /* Выводим заголовок */ ?></span><br> <?php endif; ?><br> <div class="modcontent"><br> <?php echo $module->content; /* Выводим содержимое модуля */ ?><br> </div><br> </div><br> <?php endif;<br>}<br>?> Готово. Теперь нужно только указать его в качестве стиля вывода. <jdoc:include type="modules" name="user1" style="modbox"/> Назначаем в нашу позицию модуль и смотрим результат.</p> <p>Элемент em представляет собой отрывок текста с подчеркнутым акцентом. Вы можете использовать его, чтобы обратить внимание читателя на смысл предложения или абзаца. Я расскажу вам, что это обозначает, после , в которой описан элемент em .</p><blockquote><b>Таблица 8-6: </b> Элемент em </blockquote><blockquote><b>Рисунок 8-3: </b> Использование элемента em </blockquote><p>В этом примере я поставил акцент на Я (I) в начале предложения. Если подумать об элементе em , то при произнесении предложения вслух мы рассматриваем вопрос о том, что это предложение является ответом на вопрос. Например, представьте, что я спросил: «Кто любит яблоки и апельсины?» Ваш ответ будет: «Я люблю яблоки и апельсины.» (Когда вы произносите это вслух и ставите акцент на Я, вы даете понять, что вы человек, который любит эти фрукты).</p><p>Но если бы я спросил: «Вы любите яблоки и что еще?» Вы могли бы ответить: «Я люблю яблоки и апельсины (oranges)». В этом случае, акцент будет сделан на последнее слово, подчеркивая, что апельсины являются другим фруктом, который вам нравится. Этот вариант в HTML выглядел бы следующим образом:</p><p>I like apples and <b><em> </b>oranges<b></em> </b>.</p><h3>Определение иностранных слов и технических терминов</h3><p>Элемент i обозначает часть текста, которая имеет иную природу, нежели окружающий контент. Это довольно расплывчатое определение, но общие примеры включают в себя слова из других языков, технические или научные термины и даже мысли человека (в отличие от речи). В описан элемент i .</p><blockquote><b>Таблица 8-7: </b> Элемент i </blockquote><blockquote><b>Рисунок 8-5: </b> Использование элемента s </blockquote><br><img src='https://i2.wp.com/storage.smarly.net/html5/8.5.png' width="100%" loading=lazy><h3>Определение важного текста</h3><p>Элемент strong обозначает отрывок текста, который имеет важное значение. В описан этот элемент.</p><blockquote><b>Таблица 8-9: </b> Элемент strong </blockquote><blockquote><b>Рисунок 8-7: </b> Использование элемента u </blockquote><br><img src='https://i2.wp.com/storage.smarly.net/html5/8.7.png' width="100%" loading=lazy><h3>Добавление мелкого шрифта</h3><p>Элемент small обозначает мелкий шрифт и часто используется для оговорок и уточнений. В представлен элемент small .</p><blockquote><b>Таблица 8-11: </b> Элемент small </blockquote><blockquote><b>Рисунок 8-8: </b> Использование элемента small </blockquote><br><img src='https://i2.wp.com/storage.smarly.net/html5/8.8.png' width="100%" loading=lazy><h3>Добавление верхнего и нижнего индекса</h3><p>Вы можете использовать элементы sub и sup для обозначения верхнего и нижнего индекса, соответственно. Верхние индексы используются для написания слов в некоторых языках, а оба, верхний и нижний индексы, используются в простых математических выражениях. В представлены эти элементы.</p><blockquote><b>Таблица 8-12: </b> Элементы sub и sup </blockquote><blockquote><b>Рисунок 8-9: </b> Использование элементов sub и sup </blockquote><br><img src='https://i0.wp.com/storage.smarly.net/html5/8.9.png' width="100%" loading=lazy> <p>Chrome - это конечная обработка html -кода модуля перед его вставкой в главный шаблон сайта. Существуют несколько предопределенных Chrome-стилей (table, horz, xhtml, rounded, outline), но не всегда то что есть подходит для решения текущих задач.</p> <p>Чтобы определить собственный стиль отображения в шаблоне, нужно создать файл "modules.php" в директории "html". То есть для шаблона с именем "my_template" файл должен располагаться тут - "templates/my_template/html/modules.php".</p> <p>В этом файле вы должны определить функцию с названием "modChrome_STYLE" где STYLE это имя вашего стиля. Эта функция будет принимать три аргумента - $module, &$params и &$attribs как показано ниже:</p> <p>function modChrome_STYLE ($module, &$params, &$attribs) { /* обработка и вывод html-кода модуля */ }</p> <p>В этой функции вы можете использовать любой PHP-код, а так же вам будут доступны все параметры самого модуля, его свойства и любые данные сохраненные в базе данных Joomla. В основном бывают нужны только следующее</p> <ul><li>$module->content - контент самого модуля, непосредственный html-код.</li> <li>$module->title - название модуля, указанное в панели управления в менеджере модулей.</li> <li>$module->showtitle - флаг, показывать название или нет (true или false).</li> </ul><p>Функция modChrome_STYLE - это обыкновенная php-функция, здесь можете использовать абсолютно любой php-код. Ниже приведен пример, если в настройках модуля включено отображение заголовка, то выведется текст заголовка перед контентом модуля.</p> <p>function modChrome_STYLE ($module, &$params, &$attribs) { if ($module->showtitle) { echo "<h2>" .$module->title ."</h2>"; } echo $module->content; }</p> <p>Есть возможность обратиться к любым параметрам модуля. Например, обрамим модуль классом</p> <p><div class="<?php echo $params->get("moduleclass_sfx"); ?>"> <!-- div contents --> </div></p> <p>Так же можно в код позиции добавлять свои атрибуты, которые используются в Chrome. Для этого в тег позиции <jdoc:include /> добавьте собственные атрибуты. Имена дополнительных атрибутов можно указывать произвольные, они все будут передаваться в ассоциативный массив $attribs.</p> <h4>Практический пример Chrome-функции:</h4> <p>function modChrome_custom($module, $params, $attribs) { if (isset($attribs["headerLevel"])) { $headerLevel = $attribs["headerLevel"]; } else { $headerLevel = 3; } if (isset($attribs["background"])) { $background = $attribs["background"]; } else { $background = "blue"; } echo "<div >"; if ($module->showtitle) { echo "<h" .$headerLevel .">" .$module->title ."</h" .$headerLevel .">"; } echo "<div class=".$background.">"; echo $module->content; echo "</div>"; echo "</div>"; }</p> <h4>Практические примеры использования функции "modChrome_custom"</h4> <p><!-- вызов в шаблоне --> <jdoc:include type="modules" name="user1" style="custom" /> <!-- HTML-код на выходе --> <div> <h3><!-- Module title --></h3> <div class="blue"> <!-- Module content --> </div> </div></p> <p><!-- вызов в шаблоне --> <jdoc:include type="modules" name="user1" style="custom" background="green" /> <!-- HTML-код на выходе --> <div> <h3><!-- Module title --></h3> <div class="green"> <!-- Module content --> </div> </div></p> <p><!-- вызов в шаблоне --> <jdoc:include type="modules" name="user1" style="custom" headerLevel="1" background="yellow" /> <!-- HTML-код на выходе --> <div> <h1><!-- Module title --></h1> <div class="yellow"> <!-- Module content --> </div> </div></p> <p>Одно из главнейших достоинств PHP - то, как он работает с формами HTML. Здесь основным является то, что каждый элемент формы автоматически становится доступным вашим программам на PHP. Для подробной информации об использовании форм в PHP читайте раздел . Вот пример формы HTML:</p> <p><b>Пример #1 Простейшая форма HTML </b></p> <p><form action="action.php" method="post"> <p>Ваше имя: <input type="text" name="name" /></p> <p>Ваш возраст: <input type="text" name="age" /></p> <p><input type="submit" /></p> </form></p> <p>В этой форме нет ничего особенного. Это обычная форма HTML без каких-либо специальных тегов. Когда пользователь заполнит форму и нажмет кнопку отправки, будет вызвана страница action.php . В этом файле может быть что-то вроде:</p> <p><b>Пример #2 Выводим данные формы </b></p> <p>Здравствуйте, <?php echo htmlspecialchars ($_POST [ "name" ]); ?> .<br>Вам <?php echo (int) $_POST [ "age" ]; ?> лет. </p> <p>Пример вывода данной программы:</p> <p>Здравствуйте, Сергей. Вам 30 лет.</p> <p>Если не принимать во внимание куски кода с <span><a href="function.htmlspecialchars.php" class="function">htmlspecialchars()</a> </span> и <i>(int) </i>, принцип работы данного кода должен быть прост и понятен. <span><a href="function.htmlspecialchars.php" class="function">htmlspecialchars()</a> </span> обеспечивает правильную кодировку "особых" HTML-символов так, чтобы вредоносный HTML или Javascript не был вставлен на вашу страницу. Поле age, о котором нам известно, что оно должно быть число, мы можем просто <a href="language.types.type-juggling.php#language.types.typecasting" class="link">преобразовать</a> в <span><a href="language.types.integer.php" class="type integer">integer</a> </span>, что автоматически избавит нас от нежелательных символов. PHP также может сделать это автоматически с помощью расширения <a href="ref.filter.php" class="link">filter</a> . Переменные <a href="reserved.variables.post.php" class="classname">$_POST["name"]</a> и <a href="reserved.variables.post.php" class="classname">$_POST["age"]</a> автоматически установлены для вас средствами PHP. Ранее мы использовали суперглобальную переменную <a href="reserved.variables.server.php" class="classname">$_SERVER</a> , здесь же мы точно так же используем суперглобальную переменную <a href="reserved.variables.post.php" class="classname">$_POST</a> , которая содержит все POST-данные. Заметим, что <i>метод отправки </i> (method) нашей формы - POST. Если бы мы использовали метод <i>GET </i>, то информация нашей формы была бы в суперглобальной переменной <a href="reserved.variables.get.php" class="classname">$_GET</a> . Кроме этого, можно использовать переменную <a href="reserved.variables.request.php" class="classname">$_REQUEST</a> , если источник данных не имеет значения. Эта переменная содержит смесь данных GET, POST, COOKIE.</p> <p><b>15 years ago </b></p> <p>According to the HTTP specification, you should use the POST method when you"re using the form to change the state of something on the server end. For example, if a page has a form to allow users to add their own comments, like this page here, the form should use POST. If you click "Reload" or "Refresh" on a page that you reached through a POST, it"s almost always an error -- you shouldn"t be posting the same comment twice -- which is why these pages aren"t bookmarked or cached.</p><p>You should use the GET method when your form is, well, getting something off the server and not actually changing anything. For example, the form for a search engine should use GET, since searching a Web site should not be changing anything that the client might care about, and bookmarking or caching the results of a search-engine query is just as useful as bookmarking or caching a static HTML page. </p> <p><b>2 years ago </b></p> <p>Worth clarifying: </p><p>POST is not more secure than GET. </p><p>The reasons for choosing GET vs POST involve various factors such as intent of the request (are you "submitting" information?), the size of the request (there are limits to how long a URL can be, and GET parameters are sent in the URL), and how easily you want the Action to be shareable -- Example, Google Searches are GET because it makes it easy to copy and share the search query with someone else simply by sharing the URL. </p><p>Security is only a consideration here due to the fact that a GET is easier to share than a POST. Example: you don"t want a password to be sent by GET, because the user might share the resulting URL and inadvertently expose their password.</p><p>However, a GET and a POST are equally easy to intercept by a well-placed malicious person if you don"t deploy TLS/SSL to protect the network connection itself. </p><p>All Forms sent over HTTP (usually port 80) are insecure, and today (2017), there aren"t many good reasons for a public website to not be using HTTPS (which is basically HTTP + Transport Layer Security). </p><p>As a bonus, if you use TLS you minimise the risk of your users getting code (ADs) injected into your traffic that wasn"t put there by you. </p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> </div> </div> </div> <aside class="col-lg-4 col-md-12 col-md-offset-4 col-lg-offset-0" id="right"> <div> </div> <br/> <div> </div> <br/> <div> </div> <br/> <div> </div> <br/> </aside> </div> </div> </div> <div class="popup" id="share"> <div class="perfect-scroll" style="text-align: center"> <div style="margin-bottom: 20px"> <strong> Скачивание сейчас начнётся...</strong> <br> Не забудьте поделиться материалом <br>в социальных сетях с Вашими <br> коллегами </div> <div> <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus" data-counter=""></div> </div> </div> <div class="close-pop pull-right"> <svg width="10px" height="10px" viewBox="0 0 10 10"> <path fillrule="evenodd" d="M 6.41 5C 6.41 5 9.24 7.83 9.24 7.83 9.63 8.22 9.63 8.85 9.24 9.24 8.85 9.63 8.22 9.63 7.83 9.24 7.83 9.24 5 6.41 5 6.41 5 6.41 2.17 9.24 2.17 9.24 1.78 9.63 1.15 9.63 0.76 9.24 0.37 8.85 0.37 8.22 0.76 7.83 0.76 7.83 3.59 5 3.59 5 3.59 5 0.76 2.17 0.76 2.17 0.37 1.78 0.37 1.15 0.76 0.76 1.15 0.37 1.78 0.37 2.17 0.76 2.17 0.76 5 3.58 5 3.58 5 3.58 7.83 0.76 7.83 0.76 8.22 0.37 8.85 0.37 9.24 0.76 9.63 1.15 9.63 1.78 9.24 2.17 9.24 2.17 6.41 5 6.41 5Z"></path> </svg> </div> </div> <section id="views"> <div class="container"> </div> </section> <script type="text/javascript"> $(document).ready( function () { $('.kursiv').readmore({ speed: 75, maxHeight: 84, heightMargin: 16, moreLink: '<a href="#"><span>Показать полностью</span>', lessLink: '<a href="#"><span>Скрыть</span></a>', } ); } ); </script> <style> div.kursiv { margin-bottom: 0; } #razrabotka { margin-top: 30px; } .readmore-js-toggle { font-style: italic; color: #999; display: inline; margin-right: 10px; font-size: 14px; cursor: pointer; border-bottom: 1px dotted #e6e6e6; } </style></section> <footer> <div class="container"> <div class="row"> <div class="col-xs-16 col-sm-4 col-md-3"> <p>© 2024, mkr-novo2.ru, Интернет. Образование. Программы. Прошивки. Установка и настройка. Навигаторы</p> <div class="social"> <a target="_blank" href="https://vk.com/share.php?url=https://mkr-novo2.ru/firmware/bobovye-html-modules-php-name-sozdanie-svoego-stilya-shrome-dlya-modulei.html"> <svg width="32px" height="19px" viewBox="0 0 32 19"> <path fillRule="evenodd" d="M 15.36 18.01C 15.36 18.01 17.24 18.01 17.24 18.01 17.24 18.01 17.81 17.94 18.1 17.64 18.36 17.37 18.35 16.85 18.35 16.85 18.35 16.85 18.32 14.41 19.49 14.05 20.64 13.7 22.12 16.4 23.69 17.45 24.87 18.23 25.77 18.06 25.77 18.06 25.77 18.06 29.97 18.01 29.97 18.01 29.97 18.01 32.16 17.87 31.12 16.21 31.03 16.07 30.51 14.97 28 12.72 25.37 10.35 25.72 10.74 28.89 6.65 30.82 4.16 31.59 2.65 31.35 2 31.12 1.38 29.7 1.54 29.7 1.54 29.7 1.54 24.98 1.57 24.98 1.57 24.98 1.57 24.63 1.52 24.37 1.67 24.12 1.82 23.95 2.16 23.95 2.16 23.95 2.16 23.21 4.09 22.21 5.72 20.11 9.18 19.27 9.36 18.92 9.15 18.12 8.65 18.32 7.14 18.32 6.07 18.32 2.72 18.85 1.32 17.3 0.96 16.79 0.84 16.41 0.76 15.1 0.75 13.41 0.73 11.99 0.76 11.18 1.14 10.64 1.39 10.23 1.96 10.48 1.99 10.79 2.03 11.5 2.18 11.88 2.67 12.36 3.31 12.34 4.74 12.34 4.74 12.34 4.74 12.62 8.68 11.69 9.17 11.06 9.5 10.18 8.82 8.31 5.68 7.35 4.08 6.62 2.3 6.62 2.3 6.62 2.3 6.48 1.97 6.23 1.8 5.93 1.58 5.51 1.51 5.51 1.51 5.51 1.51 1.02 1.54 1.02 1.54 1.02 1.54 0.35 1.56 0.1 1.84-0.12 2.09 0.08 2.62 0.08 2.62 0.08 2.62 3.6 10.57 7.57 14.57 11.22 18.25 15.36 18.01 15.36 18.01 15.36 18.01 15.36 18.01 15.36 18.01Z"/> </svg> </a> <a target="_blank" href="https://connect.ok.ru/offer?url=https://mkr-novo2.ru/firmware/bobovye-html-modules-php-name-sozdanie-svoego-stilya-shrome-dlya-modulei.html"> <svg viewBox="0 0 25 25" width="25px" height="25px"> <path class="st0" d="M12.5,12.7c3.2,0,5.8-2.6,5.8-5.8c0-3.2-2.6-5.8-5.8-5.8C9.3,1,6.7,3.6,6.7,6.8C6.7,10,9.3,12.7,12.5,12.7z M12.5,3.9c1.6,0,2.9,1.3,2.9,2.9c0,1.6-1.3,2.9-2.9,2.9c-1.6,0-2.9-1.3-2.9-2.9C9.6,5.2,10.9,3.9,12.5,3.9z M19.2,13.4 c-0.3-0.7-1.2-1.2-2.5-0.3c-1.6,1.3-4.3,1.3-4.3,1.3s-2.6,0-4.3-1.3c-1.2-1-2.1-0.4-2.5,0.3c-0.6,1.2,0.1,1.7,1.5,2.7 c1.3,0.8,3,1.1,4.1,1.2l-0.9,0.9c-1.3,1.3-2.6,2.6-3.4,3.4c-0.5,0.5-0.5,1.4,0,1.9l0.2,0.2c0.5,0.5,1.4,0.5,1.9,0l3.4-3.4 c1.3,1.3,2.6,2.6,3.4,3.4c0.5,0.5,1.4,0.5,1.9,0l0.2-0.2c0.5-0.5,0.5-1.4,0-1.9l-3.4-3.4l-0.9-0.9c1.1-0.1,2.8-0.4,4.1-1.2 C19.2,15.1,19.8,14.5,19.2,13.4z"/> </svg> </a> <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://mkr-novo2.ru/firmware/bobovye-html-modules-php-name-sozdanie-svoego-stilya-shrome-dlya-modulei.html"> <svg width="26px" height="25px" viewBox="0 0 26 25"> <path fillRule="evenodd" d="M 24.33-0C 24.33-0 1.96-0 1.96-0 1.19-0 0.57 0.62 0.57 1.38 0.57 1.38 0.57 23.62 0.57 23.62 0.57 24.38 1.19 25 1.96 25 1.96 25 14 25 14 25 14 25 14 15.32 14 15.32 14 15.32 10.72 15.32 10.72 15.32 10.72 15.32 10.72 11.54 10.72 11.54 10.72 11.54 14 11.54 14 11.54 14 11.54 14 8.76 14 8.76 14 5.53 15.98 3.77 18.88 3.77 20.27 3.77 21.46 3.88 21.81 3.92 21.81 3.92 21.81 7.3 21.81 7.3 21.81 7.3 19.8 7.3 19.8 7.3 18.22 7.3 17.92 8.04 17.92 9.13 17.92 9.13 17.92 11.54 17.92 11.54 17.92 11.54 21.68 11.54 21.68 11.54 21.68 11.54 21.19 15.32 21.19 15.32 21.19 15.32 17.92 15.32 17.92 15.32 17.92 15.32 17.92 25 17.92 25 17.92 25 24.33 25 24.33 25 25.09 25 25.71 24.38 25.71 23.62 25.71 23.62 25.71 1.38 25.71 1.38 25.71 0.62 25.09-0 24.33-0Z"/> </svg> </a> <a target="_blank" href="https://youtube.com/"> <svg width="26px" height="19px" viewBox="0 0 26 19"> <path fillRule="evenodd" d="M 25.75 14.46C 25.75 14.46 25.5 16.18 24.75 16.93 23.79 17.92 22.72 17.93 22.23 17.99 18.71 18.24 13.43 18.25 13.43 18.25 13.43 18.25 6.89 18.19 4.88 18 4.32 17.89 3.06 17.92 2.11 16.93 1.35 16.18 1.11 14.46 1.11 14.46 1.11 14.46 0.86 12.45 0.86 10.44 0.86 10.44 0.86 8.55 0.86 8.55 0.86 6.54 1.11 4.52 1.11 4.52 1.11 4.52 1.35 2.81 2.11 2.05 3.06 1.06 4.14 1.06 4.63 1 8.15 0.75 13.42 0.75 13.42 0.75 13.42 0.75 13.43 0.75 13.43 0.75 13.43 0.75 18.71 0.75 22.23 1 22.72 1.06 23.79 1.06 24.75 2.05 25.5 2.81 25.75 4.52 25.75 4.52 25.75 4.52 26 6.54 26 8.55 26 8.55 26 10.44 26 10.44 26 12.45 25.75 14.46 25.75 14.46ZM 10.83 5.73C 10.83 5.73 10.83 12.72 10.83 12.72 10.83 12.72 17.62 9.24 17.62 9.24 17.62 9.24 10.83 5.73 10.83 5.73Z"/> </svg> </a> </div> </div> <div class="col-lg-2 col-sm-4 col-xs-16 links"> <h4>mkr-novo2.ru</h4> <a href="/category/internet/">Интернет</a> <a href="/category/multimedia/">Мультимедиа</a> <a href="/category/navigation/">Навигаторы</a> <a href="/category/education/">Образование</a> <a href="/category/at/">ПО</a> <a href="/category/problems/">Проблемы</a> </div> <div class="col-lg-2 col-sm-3 col-xs-16 links"> <h4>О проекте</h4> <a href="/feedback.html">Обратная связь</a> <a href="">О сайте</a> </div> <div class="col-lg-5 col-sm-1 col-xs-16 links"></div> <div class="col-lg-4 col-sm-5 col-xs-16 links"> </div> </div> <div class="row v-center"> <div class="col-md-8 col-xs-16"> <a data-fancybox data-type="iframe" data-src="/feedback.html">Контакты</a> </div> <div class="col-md-8 col-xs-16"> <div class="share pull-right"> <script type="text/javascript" src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js" charset="utf-8"></script> <script type="text/javascript" src="//yastatic.net/share2/share.js" charset="utf-8"></script> <div class="ya-share2" data-services="vkontakte,facebook,odnoklassniki,moimir,gplus" data-counter=""></div> </div> </div> </div> </div> </footer> <a href="#bot" id="to-top"> <svg width="50px" height="50px" viewBox="0 0 50 50"> <circle cx="25.00" cy="25.00" r="25.00" fill="rgb(0,0,0)" opacity="0.37"/> <path fillRule="evenodd" d="M 33.94 24.46C 33.94 24.46 25.89 16.3 25.89 16.3 25.32 15.73 24.41 15.73 23.84 16.3 23.84 16.3 15.79 24.46 15.79 24.46 14.88 25.38 15.52 26.97 16.81 26.97 16.81 26.97 20.43 26.97 20.43 26.97 21.23 26.97 21.88 27.62 21.88 28.43 21.88 28.43 21.88 32.51 21.88 32.51 21.88 33.71 22.83 34.68 24.01 34.68 24.01 34.68 25.72 34.68 25.72 34.68 26.9 34.68 27.86 33.71 27.86 32.51 27.86 32.51 27.86 28.43 27.86 28.43 27.86 27.62 28.5 26.97 29.31 26.97 29.31 26.97 32.92 26.97 32.92 26.97 34.21 26.97 34.85 25.38 33.94 24.46Z" fill="rgb(241,241,241)"/> </svg> </a> <div class="overlay"></div> <div class="popup" id="password"> <div class="perfect-scroll"> <h2>Восстановление пароля <div class="close-pop pull-right"> <svg width="10px" height="10px" viewBox="0 0 10 10"> <path fillRule="evenodd" d="M 6.41 5C 6.41 5 9.24 7.83 9.24 7.83 9.63 8.22 9.63 8.85 9.24 9.24 8.85 9.63 8.22 9.63 7.83 9.24 7.83 9.24 5 6.41 5 6.41 5 6.41 2.17 9.24 2.17 9.24 1.78 9.63 1.15 9.63 0.76 9.24 0.37 8.85 0.37 8.22 0.76 7.83 0.76 7.83 3.59 5 3.59 5 3.59 5 0.76 2.17 0.76 2.17 0.37 1.78 0.37 1.15 0.76 0.76 1.15 0.37 1.78 0.37 2.17 0.76 2.17 0.76 5 3.58 5 3.58 5 3.58 7.83 0.76 7.83 0.76 8.22 0.37 8.85 0.37 9.24 0.76 9.63 1.15 9.63 1.78 9.24 2.17 9.24 2.17 6.41 5 6.41 5Z"/> </svg> </div> </h2> <div class="recover-success"> <form action="/recovery/request" data-method="post" method="post" class="recover_form"> <p>Введите вашу электронную почту, чтобы восстановить пароль!</p> <div class="input-wrp"> <input name="email" type="text" placeholder="Введите ваш e-mail"> </div> <input type="submit" data-disable-with="Отправить..." class="btn green" value="Отправить"> </form> </div> <div class="auth-form_error" style="padding-top: 10px"></div> </div> </div> <script> $('.user.one').click(function (e, ob) { $('.user').removeClass('active-user'); $('.user.one').addClass('active-user'); $('#user_type').val('1'); e.stopPropagation(); } ); $('.user.two').click(function (e, ob) { $('.user').removeClass('active-user'); $('.user.two').addClass('active-user'); $('#user_type').val('2'); e.stopPropagation(); } ); $('.user.three').click(function (e, ob) { $('.user').removeClass('active-user'); $('.user.three').addClass('active-user'); $('#user_type').val('3'); e.stopPropagation(); } ); function clearErrors() { $('.auth-form_error').each(function () { $(this).html(''); } ); } $('body').on('click', '.open-login-form', function (e) { $('#register, .overlay').removeClass('visible-pop'); $('#login, .overlay').addClass('visible-pop'); e.preventDefault(); } ); $('body').on('click', '.open-pass-form', function (e) { $('#register, .overlay').removeClass('visible-pop'); $('#password, .overlay').addClass('visible-pop'); e.preventDefault(); } ); $('.login_form') .on('ajax:beforeSend', function (event, xhr, settings) { clearErrors(); } ) .on('ajax:complete', function (event, xhr, status) { } ) .on('ajax:success', function (event, data, status, xhr) { if (data.status == 0) { $('.auth-form_error').html(data.text + '<br>'); } else { $('.open-register').html(data.text); var delay = 1000; window.location.href = url = window.location.href + "?login=ok"; location.replace(url); setTimeout('window.location.reload(true);', delay); } } ).on('ajax:error', function (event, xhr, status, error) { } ); $('.recover_form') .on('ajax:beforeSend', function (event, xhr, settings) { clearErrors(); } ) .on('ajax:complete', function (event, xhr, status) { } ) .on('ajax:success', function (event, data, status, xhr) { console.log(data); if (data.status == 0) { $('.auth-form_error').html(data.text + '<br>'); } else { $('.recover-success').html('<div class="success" >' + data.text + '</div>'); } } ).on('ajax:error', function (event, xhr, status, error) { } ); $('.registration_form') .on('ajax:beforeSend', function (event, xhr, settings) { var emailError = $('#emailError'); var passwordError = $('#passwordError'); var passwordVerify = $('#passwordVerifyError'); var userTypeError = $('#userTypeError'); var emailExist = $('#emailExist'); emailError.html(''); passwordError.html(''); passwordVerify.html(''); userTypeError.html(''); emailExist.hide(); } ) .on('ajax:complete', function (event, xhr, status) { } ).on('ajax:success', function (event, data, status, xhr) { // insert the failure message inside the "#account_settings" element //console.log(data); if (data.status == 0) { //$('.reg-info').html('<div class="error">' + data.text + '</div>'); if (data.text.email) { var emailError = $('#emailError'); var emailExist = $('#emailExist'); console.log(data.text.email); if (data.text.email == 'Найдена совпадающая со значением запись') { console.log('alert'); emailExist.show(); } else { emailError.html('<i class="icon-error"></i><div class="error_note_wrapper">' + '<div class="error_note">' + '<span class="error_note_text">' + data.text.email + '</span></div></div>'); } } if (data.text.password) { var passwordError = $('#passwordError'); console.log(data.text.password); passwordError.html('<i class="icon-error"></i><div class="error_note_wrapper">' + '<div class="error_note">' + '<span class="error_note_text">' + data.text.password + '</span></div></div>'); } if (data.text.passwordVerify) { var passwordVerify = $('#passwordVerifyError'); console.log(data.text.passwordVerify); passwordVerify.html('<i class="icon-error"></i><div class="error_note_wrapper">' + '<div class="error_note">' + '<span class="error_note_text">' + data.text.passwordVerify + '</span></div></div>'); } if (data.text.captcha) { var captcha = $('#captchaError'); console.log(data.text.captcha); captcha.html('<i class="icon-error"></i><div class="error_note_wrapper">' + '<div class="error_note">' + '<span class="error_note_text">' + data.text.captcha + '</span></div></div>'); } if (data.text.userType) { var user_type = $('#userTypeError'); console.log(data.text.userType); user_type.html('<i class="icon-error"></i><div class="error_note_wrapper">' + '<div class="error_note">' + '<span class="error_note_text">' + data.text.userType + '</span></div></div>'); } } else { $('.reg-success').html(data.text); var delay = 2000; window.location.href = url = window.location.href + "?reg=ok"; location.replace(url); setTimeout('window.location.reload(true);', delay); } } ).on('ajax:error', function (event, xhr, status, error) { } ); </script> <div class="popup" id="premium-pop"> </div> <link rel="stylesheet" href="/videouroki/res/lightslider/lightslider.min.css"> <link rel="stylesheet" href="/videouroki/res/perfectScrollbar/perfect-scrollbar.css"> <link rel="stylesheet" href="/videouroki/assets/font-awesome/css/font-awesome.min.css"> <link rel="stylesheet" href="/assets/vendor/fancybox/jquery.fancybox.min.css"> <script src="/videouroki/res/perfectScrollbar/perfect-scrollbar.jquery.min.js"></script> <script src="/js/rails.js"></script> <script src="/videouroki/res/lightslider/lightslider.min.js"></script> <script src="/videouroki/res/jquery.validate.min.js"></script> <script src="/videouroki/res/autosize-master/autosize.min.js"></script> <script src="/videouroki/js/tabs.js"></script> <script src="/videouroki/js/select.js"></script> <script src="/videouroki/js/global.js?2109"></script> <script src="/videouroki/js/views.js"></script> <script src="/videouroki/plugin/notify/notify.min.js"></script> <script src="/videouroki/plugin/notify/notify-metro.js"></script> <script src="/videouroki/js/lazyload.min.js"></script> <script src="/assets/vendor/fancybox/jquery.fancybox.min.js"></script> <script type="text/javascript"> $(document).ready( function () { // new LazyLoad(); } ) </script> <!--[if gte IE 9]><script type="text/javascript" src="/videouroki/assets/ckeditor-mini/ckeditor.js"></script><![endif]--> <script type="text/javascript" src="/videouroki/js/readmore.js"></script></body> </html>