• Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
v3.5.2 Latest
Buy Hosting

Where to add custom javascript

Scheduled Pinned Locked Moved General Discussion
5 Posts 3 Posters 3.7k Views
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • marcosM Offline
    marcosM Offline
    marcos
    wrote on last edited by marcos
    #1

    I am using theme lavender and I want to implement facebook-like-box-for-pages in admin theme widget menu.

    To do so, I have to include this facebook Javascript SDK code on my page once, after body tag ( I will use this widget on homepage sidebar ) :

    <div id="fb-root"></div>
    <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=520854318021267&version=v2.0";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
    

    Then, in admin widget menu, I will use home sidebar with html like this:

    <div class="fb-like-box" data-href="https://www.facebook.com/myfanpage" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>
    

    Where to insert this code in my app? Is it public src directory? I prefer to use this code as separate javascript e.g. facebook-like.js , so where to put it and how to require this script in order to be loaded on my home page ?

    1 Reply Last reply
    0
  • trevorT Offline
    trevorT Offline
    trevor Plugin & Theme Dev Anime Lovers GNU/Linux
    wrote on last edited by trevor
    #2

    You can put that in the header.tpl file where it says to add it.
    Personally I would just create a partial template for things like that.

    As for the Facebook Like, you can put it in a sidebar widget and it should work.

    1 Reply Last reply
    0
  • marcosM Offline
    marcosM Offline
    marcos
    wrote on last edited by
    #3

    @trevor thanks for advice. One more question : I created a new partial with name facebook-like.tpl in public/templates/patials directory .
    How to include this partial in header.tpl right after body tag ? I can not find some tutorials how nodebb partials works.

    trevorT 1 Reply Last reply
    0
  • trevorT Offline
    trevorT Offline
    trevor Plugin & Theme Dev Anime Lovers GNU/Linux
    replied to marcos on last edited by trevor
    #4

    To add this facebook-like.tpl partial in the header.tpl you would use <!-- IMPORT -->.
    Add the following in your header.tpl;

    <!-- IMPORT partials/facebook-like.tpl -->

    The developers are constantly updating the documentation and adding new helpful articles and tutorials as time permits. For future references, I suggest you start here for further assistance; https://docs.nodebb.org/
    I hope this helps!

    1 Reply Last reply
    0
  • SteveS Offline
    SteveS Offline
    Steve
    wrote on last edited by
    #5

    I used the iframe code in a widget with good results. Why reinvent the wheel!

    1 Reply Last reply
    1

Copyright © 2023 NodeBB | Contributors
  • Login

  • Don't have an account? Register

  • Login or register to search.
Powered by NodeBB Contributors
  • First post
    Last post
0
  • Home
  • Categories
  • Recent
  • Popular
  • Top
  • Tags
  • Users
  • Groups
  • Documentation
    • Home
    • Read API
    • Write API
    • Plugin Development