Yes you can use them inside the AMD module but keep in mind once you add an event listener on the window object it will be called everytime there is an action:ajaxify.end. If you don't want it triggered after you leave that page you need to turn it off with $(window).off('eventName', myMethod)
Converting a topic into twitter timeline
-
This is a simple widget tutorial to turn a topic into a twitter timeline. The end result will look like this.
First create a topic that will be the home of the twitter widget and record its topic id.
Now go to
/admin/extend/widgets
and place a html widget ontopic.tpl/header
. The standard twitter timeline widget code only works on cold loads so we have to modify it for NodeBB. You can generate the twitter widget at https://twitter.com/settings/widgets, after you copy that code you have to replace the<script>
block with the one provided below.<script> !function(d,s,id){ var js,p=/^http:/.test(d.location)?'http':'https'; var el = d.getElementById(id); if (el) { el.parentNode.removeChild(el); } if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + "://platform.twitter.com/widgets.js"; var fjs = d.getElementsByTagName(s)[0]; fjs.parentNode.insertBefore(js,fjs); } }(document,"script","twitter-wjs"); </script>
Here is the full widget code for NodeBB's twitter timeline. You can copy paste it into your HTML widget and replace every
<topic_id>
with your own topic id.<style> .page-topic-<topic_id> .topic { display: none; } .page-topic .twitter-timeline { display: none !important; width: 100% !important; height: 800px !important; } .page-topic-<topic_id> .twitter-timeline { display: block !important; } </style> <a class="twitter-timeline" href="https://twitter.com/NodeBB" data-widget-id="433016924318883841">Tweets by @NodeBB</a> <script> !function(d,s,id){ var js,p=/^http:/.test(d.location)?'http':'https'; var el = d.getElementById(id); if (el) { el.parentNode.removeChild(el); } if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + "://platform.twitter.com/widgets.js"; var fjs = d.getElementsByTagName(s)[0]; fjs.parentNode.insertBefore(js,fjs); } }(document,"script","twitter-wjs"); </script>
Once you have the widget, you can customize it with data attributes, for more info you can read https://dev.twitter.com/web/embedded-timelines