Как можно добавить кнопку WHATSAPP в форум? Что бы отображался толко в мобильном теме?

Например : http://whatsapp-sharing.com

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

Куда ставить код?

Внешний вид > Управление стилями и шаблонами > Управление шаблонами в Mobile

 

globalTemplate

здесь?

topicViewTemplate

 

 

я добавил сюда

 

 

но результатов нет

Глобальные - shareLinks

я добавил

 

Глобальные - shareLinks

 

 

 

<a href="whatsapp://send" data-text="Oxumağınızı tövsiyə edirəm:" data-href="" class="wa_btn wa_btn_s" style="display:none">Paylaş</a>

 

 

 

<script type="text/javascript">if(typeof wabtn4fg==="undefined"){wabtn4fg=1;h=document.head||document.getElementsByTagName("head")[0],s=document.createElement("script");s.type="text/javascript";s.src="http://www.******.com/public_html/forums/public/js/whatsapp-button.js";h.appendChild(s);}</script>

 

но результатов нет

Все правильно Вы вставляли: шаблон topicViewTemplate в слой <div id='shareStrip'>, там где кнопки facebook и twitter.

 

Т.е. со вставкой всё правильно, у Вас неправильно указан путь к скрипту - откуда взялось /public_html/ ?

 

И еще - кнопка появиться только в мобильнике (проверяется по useragent), т.е. если на ПК в браузере выбрать мобильный скин, кнопки не будет.

Изменено 14 марта 201511 г пользователем Viktar83

Мне надо чтобы отобразить толко на мобильном версии.

Мне надо чтобы отобразить толко на мобильном версии.

Будет на мобильной. Все правильно:

Внешний вид > Управление стилями и шаблонами > Управление шаблонами в Mobile > topicViewTemplate

 

Только путь к файлу js правильно укажите (смотря куда у Вас форум установлен):

http://www.******.com/forums/public/js/whatsapp-button.js

или

http://www.******.com/public/js/whatsapp-button.js

Изменено 14 марта 201511 г пользователем Viktar83

Да все сделал как вы сказали и результат есть. Но как можно кнопку сдвинуть чуть вниз?

 

надо что то здесь изменит. но что?

wa_btn_s{font-size:12px;background-size:16px;background-position:5px 2px;padding:3px 6px 3px 25px}

Изменено 15 марта 201511 г пользователем DrBarcode

А можно ли вообще сделать кнопку точно так же как фейс и твит?

я сделал вот так (взял код от кнопки твиттер и изменил):

 

Внешний вид > Управление стилями и шаблонами > Управление шаблонами в Mobile>>> topicViewTemplate

 

<if test="canShare:|:!$forum['disable_sharelinks'] AND $this->settings['sl_enable']">
	<div id='shareStrip'>
		<a class='button secondary' id='share_facebook_trigger' href='#'>{$this->lang->words['share']} <img src="{$this->settings['public_dir']}style_extra/sharelinks/facebook.png" /></a>

		<a class='button secondary' id='share_twitter_trigger' href='#'>{$this->lang->words['share']} <img src="{$this->settings['public_dir']}style_extra/sharelinks/twitter.png" /></a>

                       <a class='button secondary' id='share_whatsapp_trigger' data-text='Share WHATSApp:' href='whatsapp://send'>{$this->lang->words['share']} <img src="{$this->settings['public_dir']}style_extra/sharelinks/WhatsApp.png" /></a>

 

и результат:

 

В роди все ок. но не работает ((

 

Что не так сделал?

Не работает, потому что Вы изменили class кнопки. А этот класс менять нельзя, так как функции в js файле используют именно его.

 

Собственно, содержимое файла whatsapp-button.js (см. также вложение)

whatsapp-button.js.txt

 

waShBtn=function(){this.isIos===!0&&this.cntLdd(window,this.crBtn)},waShBtn.prototype.isIos=navigator.userAgent.match(/Android|iPhone/i)&&!navigator.userAgent.match(/iPod|iPad/i)?!0:!1,waShBtn.prototype.cntLdd=function(win,fn){var done=!1,top=!0,doc=win.document,root=doc.documentElement,add=doc.addEventListener?"addEventListener":"attachEvent",rem=doc.addEventListener?"removeEventListener":"detachEvent",pre=doc.addEventListener?"":"on",init=function(e){("readystatechange"!=e.type||"complete"==doc.readyState)&&(("load"==e.type?win:doc)[rem](pre+e.type,init,!1),!done&&(done=!0)&&fn.call(win,e.type||e))},poll=function(){try{root.doScroll("left")}catch(e){return void setTimeout(poll,50)}init("poll")};if("complete"==doc.readyState)fn.call(win,"lazy");else{if(doc.createEventObject&&root.doScroll){try{top=!win.frameElement}catch(e){}top&&poll()}doc[add](pre+"DOMContentLoaded",init,!1),doc[add](pre+"readystatechange",init,!1),win[add](pre+"load",init,!1)}},waShBtn.prototype.addStyling=function(){var s=document.createElement("style"),c="body,html{padding:0;margin:0;height:100%;width:100%}.wa_btn{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkViZW5lXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTZweCIgaGVpZ2h0PSIxNnB4IiB2aWV3Qm94PSIwIDAgMTYgMTYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE2IDE2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxnPg0KCQk8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRkZGRiIgZD0iTTguMTI5LDAuOTQ1Yy0zLjc5NSwwLTYuODcyLDMuMDc3LTYuODcyLDYuODczDQoJCQljMCwxLjI5OCwwLjM2LDIuNTEyLDAuOTg2LDMuNTQ5bC0xLjI0LDMuNjg4bDMuODA1LTEuMjE5YzAuOTg0LDAuNTQ0LDIuMTE2LDAuODU0LDMuMzIxLDAuODU0YzMuNzk1LDAsNi44NzEtMy4wNzUsNi44NzEtNi44NzENCgkJCVMxMS45MjQsMC45NDUsOC4xMjksMC45NDV6IE04LjEyOSwxMy41MzhjLTEuMTYyLDAtMi4yNDQtMC4zNDgtMy4xNDctMC45NDZsLTIuMTk4LDAuNzA1bDAuNzE1LTIuMTI0DQoJCQljLTAuNjg2LTAuOTQ0LTEuMDktMi4xMDMtMS4wOS0zLjM1NGMwLTMuMTU1LDIuNTY2LTUuNzIyLDUuNzIxLTUuNzIyczUuNzIxLDIuNTY2LDUuNzIxLDUuNzIyUzExLjI4MywxMy41MzgsOC4xMjksMTMuNTM4eg0KCQkJIE0xMS4zNTIsOS4zNzljLTAuMTc0LTAuMDk0LTEuMDItMC41NS0xLjE3OC0wLjYxNUMxMC4wMTQsOC43LDkuODk4LDguNjY2LDkuNzc1LDguODM3QzkuNjUyLDkuMDA3LDkuMzAxLDkuMzksOS4xOTMsOS41MDUNCgkJCUM5LjA4OCw5LjYxNyw4Ljk4NCw5LjYyOSw4LjgxMiw5LjUzM2MtMC4xNzEtMC4wOTYtMC43My0wLjMtMS4zNzgtMC45MjNjLTAuNTA0LTAuNDg0LTAuODM0LTEuMDcyLTAuOTMtMS4yNTINCgkJCWMtMC4wOTUtMC4xOCwwLTAuMjcxLDAuMDkxLTAuMzU0QzYuNjc3LDYuOTI4LDYuNzc4LDYuODA1LDYuODcsNi43MDZjMC4wOTEtMC4xLDAuMTI0LTAuMTcxLDAuMTg3LTAuMjg2DQoJCQljMC4wNjItMC4xMTUsMC4wMzgtMC4yMTgtMC4wMDMtMC4zMDhDNy4wMTIsNi4wMjMsNi42OTQsNS4xNDYsNi41NjEsNC43OUM2LjQyOCw0LjQzNCw2LjI4LDQuNDg2LDYuMTc3LDQuNDgyDQoJCQlDNi4wNzUsNC40NzksNS45NTgsNC40NTksNS44NDEsNC40NTZDNS43MjQsNC40NTEsNS41MzMsNC40ODcsNS4zNjYsNC42NTdjLTAuMTY3LDAuMTctMC42MzcsMC41NzYtMC42NjksMS40MzkNCgkJCXMwLjU2NSwxLjcyMiwwLjY0OCwxLjg0MWMwLjA4NCwwLjEyMSwxLjE0LDEuOTkxLDIuODk3LDIuNzYyYzEuNzU2LDAuNzcsMS43NjYsMC41MzQsMi4wODgsMC41MTgNCgkJCWMwLjMyMi0wLjAxOCwxLjA1NS0wLjM4NiwxLjIxNS0wLjc4OWMwLjE2Mi0wLjQwNSwwLjE3Ni0wLjc1NSwwLjEzNS0wLjgzMUMxMS42MzksOS41MjEsMTEuNTIzLDkuNDc1LDExLjM1Miw5LjM3OXoiLz4NCgk8L2c+DQo8L2c+DQo8L3N2Zz4NCg==);border:1px solid rgba(0,0,0,.1);display:inline-block!important;position:relative;font-family:Arial,sans-serif;letter-spacing:.4px;cursor:pointer;font-weight:400;text-transform:none;color:#fff;border-radius:2px;background-color:#5cbe4a;background-repeat:no-repeat;line-height:1.2;text-decoration:none;text-align:left}.wa_btn_s{font-size:12px;background-size:16px;background-position:5px 2px;padding:3px 6px 3px 25px}.wa_btn_m{font-size:16px;background-size:20px;background-position:4px 2px;padding:4px 6px 4px 30px}.wa_btn_l{font-size:16px;background-size:20px;background-position:5px 5px;padding:8px 6px 8px 30px}";return s.type="text/css",s.styleSheet?s.styleSheet.cssText=c:s.appendChild(document.createTextNode©),s},waShBtn.prototype.crBtn=function(){var b=[].slice.call(document.querySelectorAll(".wa_btn"));iframe=new Array;for(var i=0;i<b.length;i++){var parent=b.parentNode,t=b.getAttribute("data-text"),u=b.getAttribute("data-href"),o=b.getAttribute("href"),at="?text="+encodeURIComponent(t);t&&(at+="%20"),at+=encodeURIComponent(u?u:document.URL),b.setAttribute("href",o+at),b.setAttribute("target","_top"),iframe=document.createElement("iframe"),iframe.width=1,iframe.height=1,iframe.button=b,iframe.style.border=0,iframe.style.overflow="hidden",iframe.border=0,iframe.setAttribute("scrolling","no"),iframe.addEventListener("load",function(){this.contentDocument.body.appendChild(this.button),this.contentDocument.getElementsByTagName("head")[0].appendChild(theWaShBtn.addStyling());var meta=document.createElement("meta");meta.setAttribute("charset","utf-8"),this.contentDocument.getElementsByTagName("head")[0].appendChild(meta),this.width=Math.ceil(this.contentDocument.getElementsByTagName("a")[0].getBoundingClientRect().width),this.height=Math.ceil(this.contentDocument.getElementsByTagName("a")[0].getBoundingClientRect().height)},!1),parent.insertBefore(iframe,b)}};var theWaShBtn=new waShBtn;

 

Поэтому: или пробовать переписать функцию (но все равно должен использоваться уникальный id класса) или менять css прямо в этом файле whatsapp-button.js или удалить в нем свойства css для .wa_btn и потом прописать такие же, как и для button secondary, или переопределить свойства через !important. Собственно, надо смотреть, как лучше и как будет работать.

 

Но факт такой: .wa_btn нужен для работы скрипта, а его css прописаны в whatsapp-button.js