Создание шаблонов Joomla | страница 6

На первую страницу

Hagen Graf

GNU/GPL

hagen@cocoate.com

http://www.cocoate.com

0.1

… Описание

index.php

templateDetails.xml

template_thumbnail.png

css/template.css


CSS файл: В одном шаблоне можно использовать несколько CSS файлов. Название CSS файла и метод его создания не имеют особого значения. Хотя существуют стандартные описания различных элементов CSS. Для нашего тестового шаблона мы используем файл /templates/joomla150_book/css/template.css (Листинг 2).


Графика, Картинки: здесь можно разместить графические файлы, необходимые для шаблона. Во время инсталляции, Установщик шаблонов копирует их в директорию /images. Имя и путь к файлу при этом выглядят так: /templates/joomla150_book/images/[user-defined image files].



Первый запуск

После того, как мы создали структуру директории [ПутьКJoomla!]/templates/, наш шаблон появится в соответствующей секции административной части Joomla! (Extensions | Template). Теперь его можно использовать как шаблон по умолчанию.




Рис. 2: Структура директории и файлы шаблона Joomla150_book




Рис. 3: Новый шаблон в менеджере шаблонов


Если вы загрузите свой сайт в веб обозревателе, вы увидите новый шаблон. К сожалению, он пока пуст. Теперь нам предстоит интегрировать контент в шаблон элемент за элементом.




Рис. 4: Вид в веб обозревателе


Внедрение модуля Joomla!

Внедрение модуля Joomla! проводится с помощью команд, встроенных в HTML код. Это могут быть и старые команды Joomla! 1.0.x или Mambo 4.5.x, или новые команды patTemplate. Класс patTemplate служит для дифференцирования PHP и HTML кода. Для интеграции в шаблон различных элементов, Joomla! использует объект типа jdoc. Если, вместо тега , вы вставите в заголовок файла index.php следующую строку, в окне веб обозревателя при загрузке вашего сайта корректно отобразятся иконка сайта, заголовок страницы и символ источника новостей (Newsfeed symbol):</p><br><p><head></p><p><jdoc:include type="head" /></p><p></head></p><br><br><image href="#any2fbimgloader5"><br><p>Рис. 5: Иконка сайта и заголовок страницы</p><br><p>Если вы откроете исходный код этой страницы, то заметите, что Joomla! копировала все метаданные, введенные через панель администратора в HTML код. В дополнение к этому источники RSS также были интегрированы в страницу в виде тегов ссылок, отображаемых как символы источников новостей (Newsfeeds) в веб обозревателях, поддерживающих данную технологию (Firefox, Opera и т.д.).</p></div> <!-- Yandex.RTB R-A-5585048-7 --> <div id="yandex_rtb_R-A-5585048-7" class="rkl"><div class="rasporka"></div></div> <script> window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ "blockId": "R-A-5585048-7", "renderTo": "yandex_rtb_R-A-5585048-7" }) }) </script> </section> <section> <nav class="bottom-nav clr text-center ignore-select"> <ul class="pagination"> <li class=""> <a class="page-link" rel="prev" href="/r/74006?p_=5">« </a> </li> <li class=""> <a class="page-link" href="/r/74006?p_=5">5</a> </li> <li class="active"> <span class="page-link">6</span> </li> <li class=""> <a class="page-link" href="/r/74006?p_=7">7</a> </li> <li class=""> <a class="page-link" rel="next" href="/r/74006?p_=7"> »</a> </li> </ul> </nav> <div class="text-center"> <label for="reader-pagination-page mt-1"> Перейти на страницу </label> <select name="page" class="js-reader-pagination__page-select" data-target-path="/r/74006" > <option value="1" >1</option> <option value="2" >2</option> <option value="3" >3</option> <option value="4" >4</option> <option value="5" >5</option> <option value="6" selected>6</option> <option value="7" >7</option> <option value="8" >8</option> <option value="9" >9</option> <option value="10" >10</option> <option value="11" >11</option> <option value="12" >12</option> <option value="13" >13</option> <option value="14" >14</option> <option value="15" >15</option> <option value="16" >16</option> <option value="17" >17</option> </select> </div> </section> </div> </main> </div> <div class="sect sect-popular sect-related ignore-select"> <div class="sect-header fx-row fx-middle"> <div class="sect-title fx-1"> <i class="fa fa-puzzle-piece"></i> Книги, похожие на Создание шаблонов Joomla </div> </div> <div class="sect-content"> <div class="relbooks-block"> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/95602" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Эротические рассказы Рунета. Том 1 - Неизвестный Автор</div> <div class="top-subtitle">Порно</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/uploads/books/images/68/681c211de09fe1598cdf7c57b7b439c773cc9a2e.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/61062" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Забавы в домашнем кругу - Неизвестный Автор</div> <div class="top-subtitle">Порно</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/build/no_cover.f2a76ebc.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/62756" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Лолиты - Неизвестный Автор</div> <div class="top-subtitle">Порно</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/build/no_cover.f2a76ebc.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/203381" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Поиграли в доктора... - Неизвестный Автор</div> <div class="top-subtitle">Порно</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/build/no_cover.f2a76ebc.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/52647" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Удаленная работа на компьютере: как работать из дома комфортно и эффективно - Роман Александрович Клименко</div> <div class="top-subtitle">Интернет</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/uploads/books/images/24/24f4b1eab39fe96d4dc9c0ee4f0c53bac29aff84.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/126274" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Интернет для ржавых чайников - Любовь Трофимовна Левина</div> <div class="top-subtitle">Околокомпьютерная литература</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/uploads/books/images/44/444c14b368e1398ee79df2fa9eaa0613dd54aa66.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/152912" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Безопасность и анонимность работы в Интернете. Как защитить компьютер от любых посягательств извне - Алексей Анатольевич Гладкий</div> <div class="top-subtitle">Интернет</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/uploads/books/images/db/db32ca3bab2ebd373630a218241690d61c2a8a99.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> <div class="relbook-item"> <a class="top-in img-resp-vert" href="/b/168781" > <div class="top-desc fx-col fx-center anim"> <div class="top-title">Интернет вещей. Новая технологическая революция - Мачей Кранц</div> <div class="top-subtitle">О бизнесе популярно</div> </div> <img class="book_image lazyload" title="Читать онлайн Создание шаблонов Joomla - Неизвестный Автор" data-src="/uploads/books/images/76/76f9d9ef66786324335d2cb38124ecf1824f683e.jpg" alt="Создание шаблонов Joomla - Неизвестный Автор"> <i class="lazyload-spinner"></i> </a> </div> </div> </div> </div> </article> </div> </div> </div> </main> <aside class="sidebar"> <div class="side-box search-wrap"> <form id="quicksearch" method="get" action="/p"> <div class="search-box"> <input id="story" name="text" minlength="3" placeholder="Поиск по сайту..." type="text" autocomplete="off"> <button type="submit" class="search-btn"><span class="fa fa-search"></span></button> </div> </form> </div> <ul class="side-box side-nav to-mob"> <li><a href="/books">Книги</a> <ul class="subcat"> <li><a href="/c/55">Боевики</a></li> <li><a href="/c/21">Военное</a></li> <li><a href="/c/6">Детская литература</a></li> <li><a href="/c/74">Классика</a></li> <li><a href="/c/50">ЛитРПГ</a></li> <li><a href="/c/36">Любовная фантастика</a></li> <li><a href="/c/4">Любовные романы</a></li> <li><a href="/c/47">Попаданцы</a></li> <li><a href="/c/35">Постапокалипсис</a></li> <li><a href="/c/5">Приключения</a></li> <li><a href="/c/63">Триллеры</a></li> <li><a href="/c/1">Фантастика</a></li> <li><a href="/c/31">Фэнтези</a></li> </ul> </li> </ul> </aside> </div> <footer class="footer"> <div class="footer-in wrap-center"> <div class="footer-one fx-row"> <div class="footer-col footer-col-desc"> <div class="footer-col-title title"> 2025 Литфонд | Читать книги онлайн </div> </div> <div class="footer-col"> <div class="footer-col-title title">Контакты</div> <ul class="footer-col-content"> <li>Для связи и правообладателям: <a href="mailto:libs.pbn@gmail.com">libs.pbn@gmail.com</a> </li> </ul> </div> </div> </div> </footer> </div> </div> <script src="/build/runtime.68aa92de.js" defer></script><script src="/build/site.38e640f9.js" defer></script> <!-- Yandex.Metrika counter --> <script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date(); for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }} k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://cdn.jsdelivr.net/npm/yandex-metrica-watch/tag.js", "ym"); ym(94963560, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/94963560" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> </body> </html>