не знаю как вывести сец-сети кнопки в футере и выровнить их окуратно

[zevs]

добрый вечер друзья! С толкнулся с проблемой вернее с двумя. я в этом деле так себе. короче говоря у меня не получается вывести кнопки социальных сетей в футери. выровнить их, а то они криво стоят. но у меня не отображаются они

что я cделал. мои действия:

1. загрузил кнопки в отдельную папку на сервер прописал все отребуты 777

2. вставил вот этот код в фаеле : catalog/view/theme/default/template/common/footer.tpl

3, и прописал путь /store-bag/public_html/image-knopki

 

<div class="clear"></div>
<left>
    <h3>Мы в социальных сетях</h3>
  <a href="https://www.facebook.com/StoreBag.ru"><img src=/image-knopki/facebook.png" target="_blank"> <img style="width: 32px; height: 32px; alt="Мы facebook"></a>
  <a href="http://vk.com/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/vkontakte-32x32.jpg" alt="Мы Вконтакте" hspace="7" vspace="-5"></a>
  <a href="http://www.odnoklassniki.ru/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/odnoclassniki.png" alt="Мы в одноклассниках" hspace="7" vspace="-5"></a>
    </left>
</div>
 

 

4, вот сайт сам http://store-bag.ru/

5, посмотрите внизу подвала  копки:Мы в социальных сетях

[Garri]

эээ...зачем так сложно-то?да и присвоили вы непонятно что и куда

<div class="clear">

    <h3>Мы в социальных сетях</h3>

  <a href="https://www.facebook.com/StoreBag.ru"><img src=/image-knopki/facebook.png" target="_blank"> <img style="width: 32px; height: 32px; alt="Мы facebook"></a>

  <a href="http://vk.com/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/vkontakte-32x32.jpg" alt="Мы Вконтакте" hspace="7" vspace="-5"></a>

  <a href="http://www.odnoklassniki.ru/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/odnoclassniki.png" alt="Мы в одноклассниках" hspace="7" vspace="-5"></a>

</div> вот я так понимаю должно было быть?

[zevs]

 

эээ...зачем так сложно-то?да и присвоили вы непонятно что и куда

<div class="clear">

    <h3>Мы в социальных сетях</h3>

  <a href="https://www.facebook.com/StoreBag.ru"><img src=/image-knopki/facebook.png" target="_blank"> <img style="width: 32px; height: 32px; alt="Мы facebook"></a>

  <a href="http://vk.com/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/vkontakte-32x32.jpg" alt="Мы Вконтакте" hspace="7" vspace="-5"></a>

  <a href="http://www.odnoklassniki.ru/storebag"><img src="http://store-bag.ru/image/cache/data/knopki/odnoclassniki.png" alt="Мы в одноклассниках" hspace="7" vspace="-5"></a>

</div> вот я так понимаю должно было быть?

нечего не изменилось как вы указали и иконки кнопок не отображается 

[Garri]

так я и не предложил решение, я попросту убрал грубые ошибки для начала, а касательно отображения соц-сетей зачем вы велосипед изобретаете есть-же

https://opencartforum.com/files/file/573-perevod-besplatnogo-modulia-my-v-sotcsetiakh/

если для вас не вариант то присвойте хотя-бы

.clear{
position:absolute;
}
 

после откройте фаербаг и посмотрите что да как.

[zevs]

1. загрузил кнопки в отдельную папку на сервер прописал все отрибуты 777

1. в какую именно? скопируйте путь в менеджере ФТП которым пользуетесь

 

>2. вставил вот этот код в фаеле : catalog/view/theme/default/template/common/footer.tpl

2. тут все норм, вставили туда, куда надо, но вопрос открыт по адресу расположения картинок

3, и прописал путь /store-bag/public_html/image-knopki

таким образом не прописываются адреса, это путь на хостинге 

вернее будет так: 

если папка knopki у вас расположена в корне сайта (где папка admin, catalog и др...) , тогда абсолютный путь к картинке будет выглядеть так:

 

 http://store-bag.ru/knopki/КАРТИНКА.jpg
 

но... судя по фаербагу, ваши картинки не только не расположены там где вы указали, но и местоположение каждой почему то отличное: что то типа загружено в папку, а что то просто лежит в корне сайта, а не в папке вами указанной (я как не пытался, так и не нашел картинки ваши, не по указанному в коде пути, ни по примерно- возможным)

ну а код для кнопки будет скорее иметь такой вид, если вы поместите картинку в расположенную в корне сайта папку knopki :  

<a href="http://vk.com/storebag"><img src="http://store-bag.ru/knopki/vkontakte.jpg" alt="Мы Вконтакте"></a>

ну а после того, как вы правильно пропишете пути до картинок, можно говорить о помощи по выравниванию и т.д (сразу дам совет: загружайте картинки одинакового размера))) и дальнейшая помощь возможно уже не понадобиться

 

 

вот не могу понять вот здесь в ставляю код: /store-bag/public_html/catalog/view/theme/default/template/common/footer.tpl

использую ftp filezilla

не как не отображаеться картинки менял png на jpg

прописывал название картинки так vkontakte-100x100.jpg одно время отображались но слишком большие

а вот так опять не отображаеться vkontakte-32x32.jpg потом так оставил vkontakte.jpg

папка с картинками в корне сайта:  image-knopki/

 

по исправлял код 

 

<div class="clear">
    <h3>Мы в социальных сетях</h3>
  <a href="https://www.facebook.com/StoreBag.ru"><img src="http://store-bag/public_html/image-knopki/facebook-32x32.png" target="_blank"> <img style="width: 32px; height: 32px; alt="Мы facebook"></a>
  <a href="http://vk.com/storebag"><img src="http://store-bag/public_html/image-knopki/vkontakte.jpg" <img style="width: 32px; height: 32px; alt="Мы Вконтакте"></a>
  <a href="http://www.odnoklassniki.ru/storebag"><img src=""http://store-bag/public_html/image-knopki/odnoclassniki.png" alt="Мы в одноклассниках" hspace="7" vspace="-5"></a>
</div>
 

 

чего-то не как . что может быть в чем проблема как думаете .

[zevs]

кодировка  utf-8 без bom

атрибуты 777

больше не знаю проверяю пути под лупой пока нечего не нохожу

[Tom]

Смените лупу! Она врёт!))) http://store-bag/public_html/image-knopki/odnoclassniki.png

 

зачем в этом пути Папка  public_html  ?

[zevs]

Смените лупу! Она врёт!))) http://store-bag/public_html/image-knopki/odnoclassniki.png

 

зачем в этом пути Папка  public_html  ????

 

убрал public_html

поставил так  http://store-bag/image-knopki/odnoclassniki.png

все равно не чего не изиенил

[Tom]

Ну это одному Богу теперь известно чего там в магазине накурасесили!) Если смотреть в файрбаге там не путь до картинки ,а чёрти что.

 

 

[zevs]

Ну это одному Богу теперь известно чего там в магазине накурасесили!) Если смотреть в файрбаге там не путь до картинки ,а чёрти что.

 

 

 

на одноклассникак оставил public_html  чтоб потом не искать если вдруг обратно поставить нужно будет

а на остальных в контакте и фейсбуке убрал.

одна ведь роли не играет они ведь все три не отображается 

[Tom]

В смысле оставил ошибку ,чтоб потом если что её вернуть? Пути все не верные.Зачем было создавать папку ,если все картинки элементарно можно было в папку image/data загрузить и указать путь как           src="image/data/картинка"

[zevs]

В смысле оставил ошибку ,чтоб потом если что её вернуть? Пути все не верные.Зачем было создавать папку ,если все картинки элементарно можно было в папку image/data загрузить и указать путь как           src="image/data/картинка"

image/data - где находиться.

 

вот здесь может быть - /catalog/view/theme/default/image - тут уже закачал картинки и прописывал путь тоже самое

[zevs]

В смысле оставил ошибку ,чтоб потом если что её вернуть? Пути все не верные.Зачем было создавать папку ,если все картинки элементарно можно было в папку image/data загрузить и указать путь как           src="image/data/картинка"

нашел все поставил 

 

<div class="clear">
    <h3>Мы в социальных сетях</h3>
  <a href="https://www.facebook.com/StoreBag.ru"><img src="image/data/facebook.png" alt="Мы facebook" target="_blank">></a>
  <a href="http://vk.com/storebag"><img src="image/data/vkontakte.png" alt="Мы Вконтакте"></a>
  <a href="http://www.odnoklassniki.ru/storebag"><img src="image/data/odnoclassniki.png" alt="Мы в одноклассниках"></a>
</div>
 

но у вы почему то опять двадцать пять

[Tom]

Теперь же есть картинки

 

http://store-bag.ru/image/data/odnoclassniki.png

 

http://store-bag.ru/image/data/vkontakte.png

 

http://store-bag.ru/image/data/facebook.png

[zevs]

Теперь же есть картинки

 

http://store-bag.ru/image/data/odnoclassniki.png

 

http://store-bag.ru/image/data/vkontakte.png

 

http://store-bag.ru/image/data/facebook.png

все получилось  спасибо тебе дружище .

как бы мне выровнеть его , честно сказать я не знаю ширину как подровнять

[Tom]

Ширину чего ?

[zevs]

Ширину чего ?

вот  скриншот  куда хотелбы передвинуть кнопки 

как можно это реализовать

[Tom]

А что мешает теперь их туда стилями загнать?

[zevs]

А что мешает теперь их туда стилями загнать?

css не очень хорошо знаю.

[zevs]

А что мешает теперь их туда стилями загнать?

например так:

вставив в стили : 

 

.clear {
width: 300px;
margin:auto;
position: relative;
left: -320px;
top: -40px
}
 

ну и при необходимости поиграться отступами

хотя это скорее костыли, чем правильная верстка)))

по идее нужно обернуть нижний блок в див, задать ему фиксированный размер и потом уже прописывать классы, иначе при различном разрешении блоки ниже футера будут "плавать"

а ведь можно выровнять не прибегая к css ( мне так удобнее было-бы, чтоб после обновления движка например намного легче скопировать и вставить в шаблон  все изменения)

вырвнить сам блог div

подскажите как правильно подправить тут :

 

<div class="clear" align="left" -320px; height: -40px;">
 

 

сам блог

<div class="clear" align="left" -320px; height: -40px;">
    <h3>Мы в социальных сетях</h3>
  <a rel="nofollow" href="https://www.facebook.com/StoreBag.ru" target="_blank"><img src="image/data/facebook.png" title="Мы в Facebook" alt="Мы facebook"></a>
  <a rel="nofollow" href="http://vk.com/storebag" target="_blank"><img src="image/data/vkontakte.png" title="Наша страница ВКонтакте" alt="Мы Вконтакте"></a>
  <a rel="nofollow" href="http://www.odnoklassniki.ru/storebag" target="_blank"><img src="image/data/odnoclassniki.png" alt="Мы в одноклассниках"></a>
</div>
 

 

[zevs]

 

а ведь можно выровнять не прибегая к css ( мне так удобнее было-бы, чтоб после обновления движка например намного легче скопировать и вставить в шаблон  все изменения)

вырвнить сам блог div

подскажите как правильно подправить тут :

для начала внести код кнопок соцсетей в пределы <div id="container">....</div>

я вроде уже Вам ответил, что нужно обратить внимание сначала на верстку , а потом на стили, не важно куда они внесены в сам код или вынесены отдельно

я обернул как вы написали : <div id="container">....</div>

блог сдвинулся в право как надо, но вверх нет . хотелось-бы его прижать к верхней линии.

[zevs]

вот блин....не оборачивать в див надо, а внести))) он уже присутствует в вашем коде страницы

нужно просто перенести код до закрывающегося </div> а не после него)))

 

а поднять: margin-top  в помощь

 

p.s. никогда не любил вносить стили в общий код, обычно это делается при временной верстке, для удобства редактирования "все в одном"...а потом все равно все выношу в отдельный файл стилей... не понять мне вот этих "танцев с бубном" если вопрос уже был решен

я вставил так:

 

<div id="container" align="left" left: -320px; top: -40px;">
<div class="clear">
    <h3>Мы в социальных сетях</h3>
  <a rel="nofollow" href="https://www.facebook.com/StoreBag.ru" target="_blank"><img src="image/data/facebook.png" title="Мы в Facebook" alt="Мы facebook"></a>
  <a rel="nofollow" href="http://vk.com/storebag" target="_blank"><img src="image/data/vkontakte.png" title="Наша страница ВКонтакте" alt="Мы Вконтакте"></a>
  <a rel="nofollow" href="http://www.odnoklassniki.ru/storebag" target="_blank"><img src="image/data/odnoclassniki.png" alt="Мы в одноклассниках"></a>
  </div>
</div> 
 

вот скриншот

 

 

[zevs]

в файл стилей: 

 

.clear {
      margin-top:-40px
}

непреодолимое ощущение дежа-вю....

о заработало. спасибо огромное тебе.

мечты сбываются газпром