Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

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


Рекомендованные сообщения

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

что я 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, посмотрите внизу подвала  копки:Мы в социальных сетях

post-29215-0-54711300-1373394254_thumb.png

Ссылка на комментарий
Поделиться на других сайтах


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

<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> вот я так понимаю должно было быть?

Ссылка на комментарий
Поделиться на других сайтах


 

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

<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> вот я так понимаю должно было быть?

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

Ссылка на комментарий
Поделиться на других сайтах


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

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

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

.clear{
position:absolute;
}
 

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

Ссылка на комментарий
Поделиться на других сайтах


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>
 

 

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

Ссылка на комментарий
Поделиться на других сайтах


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

 

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

Ссылка на комментарий
Поделиться на других сайтах

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

 

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

 

убрал public_html

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

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

Ссылка на комментарий
Поделиться на других сайтах


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

 

 

0c510759b7e4.jpg

Ссылка на комментарий
Поделиться на других сайтах

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

 

 

0c510759b7e4.jpg

 

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

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

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

Ссылка на комментарий
Поделиться на других сайтах


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

Ссылка на комментарий
Поделиться на других сайтах

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

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

 

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

Ссылка на комментарий
Поделиться на других сайтах


В смысле оставил ошибку ,чтоб потом если что её вернуть? Пути все не верные.Зачем было создавать папку ,если все картинки элементарно можно было в папку 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>
 

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

Ссылка на комментарий
Поделиться на других сайтах


Ссылка на комментарий
Поделиться на других сайтах

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

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

Ссылка на комментарий
Поделиться на других сайтах


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

  • +1 1
Ссылка на комментарий
Поделиться на других сайтах

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

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

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

 

.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>
 

 

Ссылка на комментарий
Поделиться на других сайтах


 

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

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

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

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

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

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

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

Ссылка на комментарий
Поделиться на других сайтах


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

нужно просто перенести код до закрывающегося </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> 
 

вот скриншот

 

 

post-29215-0-39430200-1373561885_thumb.png

Ссылка на комментарий
Поделиться на других сайтах


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

 

.clear {
      margin-top:-40px
}

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

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

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

Ссылка на комментарий
Поделиться на других сайтах


Создайте аккаунт или войдите в него для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
 Поделиться

  • Сейчас на странице   0 пользователей

    • Нет пользователей, просматривающих эту страницу.
×
×
  • Создать...

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.