Форум русской поддержки Joomla!® CMS
05.12.2016, 16:37:23 *
Добро пожаловать, Гость. Пожалуйста, войдите или зарегистрируйтесь.
Вам не пришло письмо с кодом активации?

Войти
   
   Начало   Поиск Joomla 3.0 FAQ Joomla 2.5 FAQ Joomla 1.5 FAQ Правила форума Новости Joomla Реклама Войти Регистрация Помощь  
Страниц: [1]   Вниз
  Добавить закладку  |  Печать  
Автор

Перенос секции HTML шаблона в Joomla шаблон вместе с CSS

 (Прочитано 254 раз)
0 Пользователей и 1 Гость смотрят эту тему.
cjseriy
Новичок
*

Репутация: +1/-0
Offline Offline

Сообщений: 9


« : 27.09.2015, 19:25:36 »


Приветствую.

Есть одностраничный шаблон Joomla и другой шаблон HTML.
Задача вставить одну из секций шаблона HTML в custom HTML module Joomla.
Проблема в том, что там много CSS. Как его легче перенести с HTML шаблона к джумловскому?

Вот код переносимой секции HTML шаблона:
Код:
<section id="about" class="section-content bg1">
<div class="container">
   <div class="row">
      <!-- Section Title -->
      <div class="section-title item_bottom text-center">
         <div>
            <span class="fa fa-user fa-2x"></span>
         </div>
         <h1>About <span>Me</span></h1>
      </div>
      <!-- End Section Title -->
   </div>
   <div class="row">
      <div class="col-md-4 text-center item_bottom">
         <img src="images/photo.jpg" class="img-center img-responsive" alt="My photo"/>
         <!-- YOUR PHOTO -->
         <div class="name-title">
            <h2>Jonathan Doe</h2>
            <!-- Your Name -->
            <h5>UI/UX Designer</h5>
            <!-- Your Designation -->
         </div>
      </div>
      <div class="col-md-4 item_top">
         <p class="quoteline">
            Be who you are and say what you feel, because those who mind don't matter, and those who matter don't mind.
         </p>
         <p>
            Hello, I'm a UI/UX Designer & Front End Developer from Dhaka, Bangladesh. I hold a master degree of Web Design from the St. Patrick University.
         </p>
         <p>
             I currently work at Intel, where I spend most of my time crafting and working on awesome projects. Lorem ipsum dolor sit amet consectetuer Integer eleifend Curabitur id ut. Quisque Aenean ut pede id elit ligula est mollis sapien magna. Urna turpis quis sagittis at ac Sed augue habitant tortor elit. Dolor Quisque et elit aliquam vitae habitant.
         </p>
      <p class="text-right">
      <img src="images/signature.png" alt="signature" />
      </p>
      </div>
      <div class="col-md-4 item_bottom">
        <ul class="fa-ul">
            <li><i class="fa fa-li fa-calendar"></i><strong>Birthdate</strong> : 02/09/1982</li>
            <li><i class="fa fa-li fa-mobile"></i><strong>Phone</strong> : +1 343-234-4343</li>
            <li><i class="fa fa-li fa-envelope-o"></i><strong>Email</strong> : john@example.com</li>
            <li><i class="fa fa-li fa-globe"></i><strong>Website</strong> : www.example.com</li>
            <li><i class="fa fa-li fa-home"></i><strong>Adresse</strong> : 12 Segun Bagicha, 10th Floor,<br>Dhaka 1000, Bangladesh.</li>
         </ul>
         
         <div class="number-counters text-center new-line">
            <div class="counters-item">
               <i class="fa fa-group fa-2x"></i>
               <strong data-to="150">0</strong>
               <!-- Set Your Number here. i,e. data-to="56" -->
               <p>
                  Happy Clients
               </p>
            </div>
            <div class="counters-item">
               <i class="fa fa-flag fa-2x"></i>
               <strong data-to="7">0</strong>
               <!-- Set Your Number here. i,e. data-to="56" -->
               <p>
                  Year Experience
               </p>
            </div>
            <div class="counters-item">
               <i class="fa fa-trophy fa-2x"></i>
               <strong data-to="13">0</strong>
               <!-- Set Your Number here. i,e. data-to="56" -->
               <p>
                  Awards Won
               </p>
            </div>
            <div class="counters-item">
               <i class="fa fa-thumbs-up fa-2x"></i>
               <strong data-to="520">0</strong>
               <!-- Set Your Number here. i,e. data-to="56" -->
               <p>
                  Projects Done
               </p>
            </div>
         </div>
      </div>
   </div>
   <div class="row services">
      <div class="col-md-4">
         <!-- Service -->
         <div class="services-box new-line item_left">
            <h4>Customer Support</h4>
            <div class="services-box-icon">
               <i class="fa fa-smile-o fa-3x"></i>
            </div>
            <div class="service-box-info">
               <p>
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rutrum pellesque imperdiet. Nulla lacinia iaculis nulla.
               </p>
            </div>
         </div>
         <!-- End Service -->
      </div>
      <div class="col-md-4">
         <!-- Service -->
         <div class="services-box new-line item_bottom">
            <h4>Web Design</h4>
            <div class="services-box-icon">
               <i class="fa fa-html5 fa-3x"></i>
            </div>
            <div class="service-box-info">
               <p>
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rutrum pellesque imperdiet. Nulla lacinia iaculis nulla.
               </p>
            </div>
         </div>
         <!-- End Service -->
      </div>
      <div class="col-md-4 clearfix">
         <!-- Service -->
         <div class="services-box new-line item_right">
            <h4>Wordpress Themes</h4>
            <div class="services-box-icon">
               <i class="fa fa-link fa-3x"></i>
            </div>
            <div class="service-box-info">
               <p>
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque rutrum pellesque imperdiet. Nulla lacinia iaculis nulla.
               </p>
            </div>
         </div>
         <!-- End Service -->
      </div>
   </div>                     
</div>
</section>
Записан
darkghost
Практически профи
*******

Репутация: +75/-0
Online Online

Сообщений: 1809



« Ответ #1 : 28.09.2015, 12:42:28 »

выдрать CSS шаблона и добавить в CSS темлпат или же добавить строку для загрузки CSS шаблона
Если же стили перекрываются - добавить свой класс и подправить CSS.
Как понимаете, тут надо смотреть что и к чему. Хорошо бы ссылку - может так будет понятнее и может быстрее будет ответ
Записан
Страниц: [1]   Вверх
  Добавить закладку  |  Печать  
 
Перейти в:  

Powered by SMF 1.1.21 | SMF © 2006, Simple Machines

Joomlaforum.ru is not affiliated with or endorsed by the Joomla! Project or Open Source Matters.
The Joomla! name and logo is used under a limited license granted by Open Source Matters
the trademark holder in the United States and other countries.

LiveInternet