How to Use the New Javascript


So, cna someone please explain how to use this new capability? What goes in the JavaScript Box and what goes on the webpage?


  • thaen
    Posts: 1,028

    I'm copying this from nuadaria's post on the other thread ...


    if(document.getElementsByClassName('wiki-edit').length < 1){
    var siblingDiv = document.getElementsByClassName('wiki-page-container');
    var div = document.createElement('div');
    div.innerHTML = '<div class="wiki-edit"><a class="button" href="'+window.location.href+'/edit">Edit This Page</a></div>';

    siblingDiv[0].parentNode.insertBefore(div, siblingDiv.nextSibling);

    Copy that code exactly, and then paste it in the Campaign Settings -> Advanced -> Custom JavaScript box.

    Then click Save.

    Then go to any Wiki Page in your Campaign, and scroll down to the bottom of the main section, and you'll see the button for "Edit This Page".  You'll probably want to add some CSS to position it, but otherwise, it should work as is.

    You don't need to put anything on the Wiki Pages themselves to make this work.  Part of the power here is similar to the Custom CSS where you make change in one place (the Advanced tab) and it affects (or can affect) everything in the Campaign.

    Does that answer the question?


    Obsidian Portal Developer

  • Keryth987
    Posts: 1,039

    Seems to work. So I just add things java wise there and thats it then?

  • thaen
    Posts: 1,028

    Yeah, just like Custom CSS.  (Let me know if I'm not fully understanding your question?)

    Just noting, "Java" and "JavaScript" are two separate programming languages.  So, if you were googling for some "Java" code to show a popup, that code wouldn't work.  But, if you were googling for some "JavaScript" code to show a popup, that code would work.


    Obsidian Portal Developer

  • Glyph3x
    Posts: 2 edited July 2022

    So could we create a separate HTML page then and call it using JS? For A side nav bar for example, so it doesnt have to have it repasted on each page

    Post edited by Glyph3x on
  • thaen
    Posts: 1,028

    @Glyph3x, yep, this could be used for that.  For that specific example, a side nav bar, we already have the Custom Navigation feature (in the Campaign Settings -> Advanced), which enables you to replace the side nav bar with whatever HTML you want.  Let me know if I'm not making sense.

    Obsidian Portal Developer

  • JOHAN255
    Posts: 1

    Just noting, "Java" and "JavaScript" are two separate programming languages. So, if you were googling for some "Java" code to show a popup, that code wouldn't work. But, if you were googling for some "JavaScript" code to show a popup, that code would work.

  • Jamesmillere
    Posts: 1

    To use a new capability, place the JavaScript code related to the capability in the JavaScript box. This includes declaring variables, defining functions, implementing event listeners, and utilizing APIs or external libraries if necessary. On the any Python webpage, include the JavaScript file using the script tag and create HTML elements that will interact with the capability or display its output. Add event listeners to the appropriate HTML elements, and specify where the output should appear. Test the implementation, considering the specific guidelines or documentation provided for the capability.

Sign In or Register to comment.

September 2023

Read the feature post on the blog
Return to Obsidian Portal

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!