[Помогите] Редактирование footer, помогите новичку!

Тема в разделе "OpenCart", создана пользователем Кирилл21, 23 июл 2014.

  1. Кирилл21

    Кирилл21

    Регистрация:
    23 дек 2013
    Сообщения:
    12
    Симпатии:
    0
    Всем доброго времени суток!
    Просьба сильно не пинать, может и глупые вопросы задаю но сколько инет не рыл - ответа найти не могу, и додуматься тоже мозгов не хватает в этом плане!) По этому прошу помощи.
    Постараюсь описать все по-подробнее.
    Имеется магазин на opencart 1.5.5.1 ( www.toner-cheb.ru ) шаблон tecart

    Проблема 1.
    В нижней части сайта (footer) вместо стандартного, того что сейчас там, хочу сделать чтото наподобие этого:

    [​IMG](не могу вставить изображение из яндекс диска, вот ссылка: https://disk.yandex.ru/client/disk|slider/disk/Безымянный.png )
    Я пытаюсь это сделать таким образом:
    Беру 2 файла: header.tpl и footer.tpl (соответственно из header.tpl хочу взять чтото подобие "горизонтальной полосы" только без ссылок и вставить ее в нужное место в header.tpl
    Беру код верхнего меню из header
    Код:
    <div id="menu">
       <ul>
            <li>
            </li>
       </ul>
    </div>

    Захожу в footer
    изначально он имеет такой вид:
    Код:
    <div style="clear:both"></div>
    <script type="text/javascript"><!--
      $(".pagination a:contains('\>\|')").text("▶▶");
      $(".pagination a:contains('\|\<')").text("◀◀");
      $(".pagination a:contains('\>')").text("▶");
      $(".pagination a:contains('\<')").text("◀");
    //--></script>
    </div>
    <div class="footer-wrap">
    <div id="footer">
      <?php if ($informations) { ?>
      <div class="column">
        <h3><?php echo $text_information; ?></h3>
        <ul>
          <?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
          <?php } ?>
        </ul>
      </div>
      <?php } ?>
      <div class="column">
        <h3><?php echo $text_service; ?></h3>
        <ul>
          <li><a href="<?php echo $contact; ?>"><?php echo $text_contact; ?></a></li>
          <li><a href="<?php echo $return; ?>"><?php echo $text_return; ?></a></li>
          <li><a href="<?php echo $sitemap; ?>"><?php echo $text_sitemap; ?></a></li>
        </ul>
      </div>
      <div class="column">
        <h3><?php echo $text_extra; ?></h3>
        <ul>
          <li><a href="<?php echo $manufacturer; ?>"><?php echo $text_manufacturer; ?></a></li>
          <li><a href="<?php echo $voucher; ?>"><?php echo $text_voucher; ?></a></li>
          <li><a href="<?php echo $affiliate; ?>"><?php echo $text_affiliate; ?></a></li>
          <li><a href="<?php echo $special; ?>"><?php echo $text_special; ?></a></li>
        </ul>
      </div>
      <div class="column">
        <h3><?php echo $text_account; ?></h3>
        <ul>
          <li><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a></li>
          <li><a href="<?php echo $order; ?>"><?php echo $text_order; ?></a></li>
          <li><a href="<?php echo $wishlist; ?>"><?php echo $text_wishlist; ?></a></li>
          <li><a href="<?php echo $newsletter; ?>"><?php echo $text_newsletter; ?></a></li>
        </ul>
      </div>
    </div>
    
    добавляю свою полосу из header:
    Код:
    <div style="clear:both"></div>
    <script type="text/javascript"><!--
      $(".pagination a:contains('\>\|')").text("▶▶");
      $(".pagination a:contains('\|\<')").text("◀◀");
      $(".pagination a:contains('\>')").text("▶");
      $(".pagination a:contains('\<')").text("◀");
    //--></script>
    </div>
    <div id="menu">
       <ul>
            <li>
            </li>
       </ul>
    </div>
    <div class="footer-wrap">
    <div id="footer">
      <?php if ($informations) { ?>
      <div class="column">
        <h3><?php echo $text_information; ?></h3>
        <ul>
          <?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
          <?php } ?>
        </ul>
      </div>
      <?php } ?>
      <div class="column">
        <h3><?php echo $text_service; ?></h3>
        <ul>
          <li><a href="<?php echo $contact; ?>"><?php echo $text_contact; ?></a></li>
          <li><a href="<?php echo $return; ?>"><?php echo $text_return; ?></a></li>
          <li><a href="<?php echo $sitemap; ?>"><?php echo $text_sitemap; ?></a></li>
        </ul>
      </div>
      <div class="column">
        <h3><?php echo $text_extra; ?></h3>
        <ul>
          <li><a href="<?php echo $manufacturer; ?>"><?php echo $text_manufacturer; ?></a></li>
          <li><a href="<?php echo $voucher; ?>"><?php echo $text_voucher; ?></a></li>
          <li><a href="<?php echo $affiliate; ?>"><?php echo $text_affiliate; ?></a></li>
          <li><a href="<?php echo $special; ?>"><?php echo $text_special; ?></a></li>
        </ul>
      </div>
      <div class="column">
        <h3><?php echo $text_account; ?></h3>
        <ul>
          <li><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a></li>
          <li><a href="<?php echo $order; ?>"><?php echo $text_order; ?></a></li>
          <li><a href="<?php echo $wishlist; ?>"><?php echo $text_wishlist; ?></a></li>
          <li><a href="<?php echo $newsletter; ?>"><?php echo $text_newsletter; ?></a></li>
        </ul>
      </div>
    </div>
    полоса появляется, но растягивается на по ширине всего сайта а на весь экран!
    [​IMG]( не могу вставить изобрадение из яндекс диска, вот ссылка: https://disk.yandex.ru/client/disk|slider/disk/Снимок.PNG )
    хотя сверху полоса идет пнпо ширене самого сайта... предполагаю, что ширина берется из ширины футера в stylesheet.css, но ведь параметры самого меню там уже прописаны...
    Кстати говоря, с этим же stylesheet.css связан и второй вопрос:

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

    Заранее большое спасибо всем откликнувшимся
     
  2. texxnik

    texxnik

    Регистрация:
    5 июн 2014
    Сообщения:
    19
    Симпатии:
    3
    в браузере есть такая замечательная кнопка "Исследовать элемент" вызывается левой кнопкой мыши и соответственно Исследовать элемент.
    сразу поймешь как работает разделение на колонки в footer. очень много станет понятно
     
  3. Кирилл21

    Кирилл21

    Регистрация:
    23 дек 2013
    Сообщения:
    12
    Симпатии:
    0
    прощу прощения за назойливость. Очень остро стоит вопрос о stylesheet.css
    Пытаюсь прописать свои стили - не видит их( можете подсказать, как именно их прописывать? есть текст, перед которым ставится решетка (#) а есть перед которым ставится точка (.текст)
    И еще в описании стиля меню, стоят знаки в начала:" /* " а в конце " */ " что это значит?
    Огромное спасибо
     
  4. zvizdunov

    zvizdunov

    Регистрация:
    31 май 2014
    Сообщения:
    105
    Симпатии:
    33
    Чтобы работал css стили нужно прописать в html где именно и как именно они будут работать.
    Есть классы и селекторы, а также правили их применений, если элемент используется один раз, то это селектор "#" (id), если более одного, то это класс "." (class)
    Чтобы текст в css файле воспринимался именно как текст, а не как правило таблицы стилей, то этот текст комментируется - зеключается между знаками /* */
    Вы не с того начали, хотите писать свои таблицы стилей - учите css и html учебников предостаточно.
    Ваши вопросы имеют общий характер и проще сесть и сделать, чем ответить на все из них.
    Редактирование и написание html и css - это четко прописанные правила и стандарты, нельзя самому что-то придумать и разведка боем тут не подходит.
    Нужно начинать с азов.