Перейти к содержанию
PaLadin

"сохранить Вконтакте", "Мне нравиться Facebook" и т.д. [решено]

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

Добрый день!

Прошу Вас подсказать как добавить кнопки типа "сохранить Вконтакте", "Мне нравиться Facebook" или twitter'а на страницу продукта?

Вконтакт даёт такой код:

<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="http://vkontakte.ru/js/api/share.js?10" charset="windows-1251"></script>

<!-- Put this script tag to the place, where the Share button will be -->
<script type="text/javascript"><!--
document.write(VK.Share.button(false,{type: "round", text: "Сохранить"}));
--></script>

Куда его вставлять?

Очень прошу подробного описания, т.к. полный 0 в вопросе создания сайтов, php и т.д.

З.Ы. в идеале хотел бы получить что-нибудь типа такого:

Изображение

Поделиться сообщением


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

Самоё простое - прописать в файл шаблона - catalog/view/theme/ваша тема/template/product/product.tpl

Например вот так:

<?php
$gx_page = 'http://'.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
$gx_title = $heading_title;
?>
<div id="socialbuttons">
<a href="http://vkontakte.ru/share.php?url=<?php echo $gx_page; ?>ℑ=<?php echo $thumb; ?>" target="vkontakte" rel="nofollow" onClick="window.open('','vkontakte','width=600,height=400')">[img=/catalog/view/theme/androidipad/image_s/vkontakte.png]</a>

<a href="http://twitter.com/home?status=<?php echo $gx_page; ?> <?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/twitter.png]</a>

<a href="http://my.ya.ru/posts_add_link.xml?URL=<?php echo $gx_page; ?>&title=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/yandex.png]</a>

<a href="http://connect.mail.ru/share?share_url=<?php echo $gx_page; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/mailru.png]</a>

<a href="http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=<?php echo $gx_page; ?>&title=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/google.png]</a>

<a href="http://www.google.com/buzz/post?url=<?php echo $gx_page; ?>&message=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/google-buzz.png]</a>

<a href="http://www.blogger.com/blog_this.pyra?t&u=<?php echo $gx_page; ?>&n=<?php echo $gx_title; ?>&a=ADD_SERVICE_FLAG&passive=true&alinsu=0&aplinsu=0&alwf=true&hl=ru&skipvpage=true&rm=false&showra=1&fpui=2&naui=8" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/blogger.png]</a>

<a href="http://www.livejournal.com/update.bml?event=<a href="<?php echo $gx_page; ?>"><?php echo $gx_title; ?></a>&subject=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/livejournal.png]</a>
</div>
Вставляем в любое удобное место. Картинки кнопок должны лежать в соответствующем месте, у меня это, как видите, специальная папочка в папке моей темы оформления. Ну и количество кнопок в этом модуле можно тоже нарастить по аналогии...

Внимание! Приведенный код корректно работает только при включенных SEO-url (или ЧПУ). Без этого будут съедаться все переменные в адресе вашей страницы следующие после символа &... как победить эту проблему без использования javascript-ов я так и не нашел решения... https://opencartforum.com/public/style_emoticons/default/icon_question.gif

Пример смотреть здесь: http://androidipad.ru/smartqt7?from=ocforum

Поделиться сообщением


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

Прикрутилось )))

Супер! Спасибо!

Поделиться сообщением


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

А Как сделать чтоб при нажатиии галочки поделится с друзьями ...отправлялось на стену не только название товара но и фотка

Поделиться сообщением


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

Есть вариант ещё проще - заходиш на сайт регистрируешся и выбираееш свой образ представления, получаеш код, а дальше лепиш куда запланировал...

  • +1 3

Поделиться сообщением


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

Спасибо)

В итоге остановился на этом варианте.

Поделиться сообщением


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

Есть вариант ещё проще - заходиш на сайт регистрируешся и выбираееш свой образ представления, получаеш код, а дальше лепиш куда запланировал...

пасиб...отличный сервис и быстро устанавливается...))

Поделиться сообщением


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

Еще проще яндекс - http://api.yandex.ru/share/

<script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script>
<div class="yashare-auto-init" data-yashareType="button" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj"></div> 

и всё

Поделиться сообщением


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

Еще проще яндекс - http://api.yandex.ru/share/

<script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script>
<div class="yashare-auto-init" data-yashareType="button" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj"></div> 

и всё

согласен...проще... но как-то не красиво... кнопочки простенькие)))) но всё равно спс, буду иметь ввиду...))

никак не могу добавить кнопку класс с счетчиком с одноклассников... простую без проблем, а вот счетчик никак... вставлю... появляется кнопка, но подсчитывание не происходит + пропадают остальные кнопки социалок...(

Поделиться сообщением


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

...но как-то не красиво... кнопочки простенькие...

Где же они "простенькие"? Вполне "нормально" смотрится. ;)

Изображение

Хотя, "кому - как".

Поделиться сообщением


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

я также как и вы подключил addthis... имел ввиду уandex вариант___))))

Изменено пользователем afwollis
overquote detected!

Поделиться сообщением


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

Вот, ещё вариант, относящийся к facebook:

В файле catalog/view/theme/default/template/product/product.tpl находим строки:

</div>   		
            <?php if ($display_price) { ?>
и перед ними, вставляем эти:

<div style="width: 100%; padding-top:10px;">
            <table>
   			<tr>
              <td><iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo $this->model_tool_seo_url->rewrite(HTTP_SERVER . 'index.php?route=product/product&product_id='.$this->request->get['product_id']); ?>&layout=standard&show_faces=false&width=280&action=like&colorscheme=light&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:270px; height:35px;" allowTransparency="true"></iframe>
              </td>
              </tr>
            </table>
В итоге, получаем вот так:

Изображение

Поделиться сообщением


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

Вот, ещё вариант, относящийся к facebook:....................В итоге, получаем вот так:......

У меня не прикручивается.

Может ещё что надо сделать?

Поделиться сообщением


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

нашел кнопки покрасивее Здесь

Вставьте в шаблон вашего сайта (в то место, где вы хотите видеть иконки) следующий код:

<script type="text/javascript" src="http://site.ru/share42/share42.js"></script>

<script type="text/javascript">share42('site.ru/share42/','','[title]',150,20)</script>

где замените на код ссылки, а [title] замените на код названия статьи.

Расскажите неучу что писать в а что в [title]!

Пожалуйста!

Поделиться сообщением


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

Вот, ещё вариант, относящийся к facebook:.....

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

Изображение

Может это и не кому не интересно, но если кого колышет, то, как ни-будь смогу вымучить и выложить, как я это всё намутил.

Но, а tim21701 - у, The Best - красавчик, форум ожил яркими ответами, закрывающие полностью поставленный вопрос без листания страниц, форума в надежде на чудо.

Так держать!

Поделиться сообщением


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

...выглядит это теперь вот так:...

Прикольно получилось. :) Правда, немного "рябит", но, всё равно... ))

Поделиться сообщением


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

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

Изображение

Может это и не кому не интересно, но если кого колышет, то, как ни-будь смогу вымучить и выложить, как я это всё намутил.

Но, а tim21701 - у, The Best - красавчик, форум ожил яркими ответами, закрывающие полностью поставленный вопрос без листания страниц, форума в надежде на чудо.

Так держать!

Жду :) вариант от tim21701 почему то не получился

PS: собственно интересует где ты взял именно такую красивую кнопочку от face

PS2: Нашел такую кнопку :) не заметил просто на face...теперь вопрос, не знаю как так делают, как сделать что бы одна кнопку, не переносила другую кнопку, на другую строку? Плз ^^ через css или прямо в php

PS3: Усё :) Всё нашел сам :) эх, учусь прям на практике, зато очень эффективно :) сделал с помощью float, правильно?

Изменено пользователем Falcosha

Поделиться сообщением


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

Пишу еще раз, так как очень нужно решить этот вопрос

Как мне кажется , самые красивые кнопки что я нашел это вот эти

Изображение

Находятся они тут share42.com

чтобы их вставить, нужно сделать следующее:

Установка скрипта:

Распакуйте архив со скриптом.

Загрузите папку "share42" на ваш сайт по FTP (при желании папку можно переименовать).

Укажите абсолютный путь до этой папки: , например, http://site.ru/share42/.

Выберите наиболее подходящий тип сайта:

Статический сайт без поддержки PHP

WordPress

Joomla

Прочие CMS

Вставьте в шаблон вашего сайта (в то место, где вы хотите видеть иконки) следующий код:

<script type="text/javascript" src="http://site.ru/share42/share42.js"></script>

<script type="text/javascript">share42('site.ru/share42/','','[title]',150,20)</script>

где замените на код ссылки, а [title] замените на код названия статьи.

150 - расстояние от начала страницы до плавающей панели (в пикселях);

20 - расстояние от верха видимой области страницы до плавающей панели (в пикселях).

Добавьте в файл стилей вашего сайта (файл с расширением .css) следующие стили:

#share42 {

position: fixed;

z-index: 1000;

margin-left: -70px; /* смещение панели влево от края контента */

padding: 6px 6px 0;

background: #FFF;

border: 1px solid #E9E9E9;

-webkit-border-radius: 4px;

-moz-border-radius: 4px;

border-radius: 4px;

}

* html #share42 {display: none}

#share42:hover {

background: #F6F6F6;

border: 1px solid #D4D4D4;

-webkit-box-shadow: 0 0 5px #DDD;

-moz-box-shadow: 0 0 5px #DDD;

box-shadow: 0 0 5px #DDD;

}

#share42 a {opacity: 0.5}

#share42:hover a {opacity: 0.7}

#share42 a:hover {opacity: 1}

#share42 img {margin: 0 !important; padding: 0 !important; border: none !important;}

Готово.

Я новичок, и не понимаю, что сюда нужно вставлять

Распишите пожалуйста подробно!!!!!

Поделиться сообщением


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

C:\WebServers\home\bars\www\catalog\view\theme\6color\template\product\product.tpl

вставляю туда

<script type="text/javascript" src="//yandex.st/share/share.js" charset="utf-8"></script>

<div class="yashare-auto-init" data-yashareL10n="ru" data-yashareType="button" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,friendfeed,moikrug"></div>

а у меня появляются иконки в низу сайта а не под товаром см. скин

post-14180-0-47883400-1320425697_thumb.jpg

Поделиться сообщением


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

все понел как! решено )

Поделиться сообщением


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

Вот мне нравится! Пришел, попросил помощи, что-то сделал, написал "получилось" и все! Хорошо, что тему не попросил закрыть. И таки бывают.

Ребята, я той же проблемой. Нет кнопки, хотя все делал как описано и на сайте и вконтакте.

Шапка сайта - это ж в header.tpl?

Поделиться сообщением


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

Шапка сайта - это ж в header.tpl?

Да

Поделиться сообщением


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

Самоё простое - прописать в файл шаблона - catalog/view/theme/ваша тема/template/product/product.tpl

Например вот так:

<?php
$gx_page = 'http://'.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
$gx_title = $heading_title;
?>
<div id="socialbuttons">
<a href="http://vkontakte.ru/share.php?url=<?php echo $gx_page; ?>ℑ=<?php echo $thumb; ?>" target="vkontakte" rel="nofollow" onClick="window.open('','vkontakte','width=600,height=400')">[img=/catalog/view/theme/androidipad/image_s/vkontakte.png]</a>

<a href="http://twitter.com/home?status=<?php echo $gx_page; ?> <?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/twitter.png]</a>

<a href="http://my.ya.ru/posts_add_link.xml?URL=<?php echo $gx_page; ?>&title=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/yandex.png]</a>

<a href="http://connect.mail.ru/share?share_url=<?php echo $gx_page; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/mailru.png]</a>

<a href="http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=<?php echo $gx_page; ?>&title=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/google.png]</a>

<a href="http://www.google.com/buzz/post?url=<?php echo $gx_page; ?>&message=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/google-buzz.png]</a>

<a href="http://www.blogger.com/blog_this.pyra?t&u=<?php echo $gx_page; ?>&n=<?php echo $gx_title; ?>&a=ADD_SERVICE_FLAG&passive=true&alinsu=0&aplinsu=0&alwf=true&hl=ru&skipvpage=true&rm=false&showra=1&fpui=2&naui=8" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/blogger.png]</a>

<a href="http://www.livejournal.com/update.bml?event=<a href="<?php echo $gx_page; ?>"><?php echo $gx_title; ?></a>&subject=<?php echo $gx_title; ?>" target="_blank" rel="nofollow">[img=/catalog/view/theme/androidipad/image_s/livejournal.png]</a>
</div>
Вставляем в любое удобное место. Картинки кнопок должны лежать в соответствующем месте, у меня это, как видите, специальная папочка в папке моей темы оформления. Ну и количество кнопок в этом модуле можно тоже нарастить по аналогии...

Внимание! Приведенный код корректно работает только при включенных SEO-url (или ЧПУ). Без этого будут съедаться все переменные в адресе вашей страницы следующие после символа &... как победить эту проблему без использования javascript-ов я так и не нашел решения... icon_question.gif

Пример смотреть здесь: http://androidipad.ru/smartqt7?from=ocforum

 

Спасибо очень помогли ! 

Поделиться сообщением


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

Для публикации сообщений создайте учётную запись или авторизуйтесь

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

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

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

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