Jump to:

794 Posts in 408 Topics by 304 members

Widgets

SilverStripe Forums » Widgets » Adding external JavaScript/widget

Discuss SilverStripe Widgets.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 749 Views
  • debtfreeslave
    Avatar
    Community Member
    13 Posts

    Adding external JavaScript/widget Link to this post

    Hi

    I am maintaining a Silverstripe 2.3.7 site and am frequently getting request to add in small pieces of code for some small functionality that needs to be implemented. The problem is that the code usually needs to target a specific page, for example - I have been asked to implement Learnpipe

    See exactly what this is
    http://www.learnpipe.ie/

    The people at Learnpipe sent me the following:

    Step 1. To ensure Facebook posts include your logo - insert the following code in the
    <header> section of the template.
    /********************************************/
    I have inserted this in the /templates/Page.ss header
    /********************************************/
    <link rel="image_src" href="http://a2.sphotos.ak.fbcdn.net/hphotos-ak-ash3/
    537010_372006922830724_988906636_n.jpg" width="100">

    This will ensure that all questions that are shared to Facebook are displayed with the correct
    logo. **If this change is NOT made, Facebook will randomly take an image from each page.

    Step 2. Social Q&A widget
    This is the active widget snippet for your college. Place in an appropriate place within the page
    template.
    /*******************************************************************************************************/
    Here's the problem our templates are divided in faculties and then courses but all the computer courses use the same template so in order to target a particular computer course I need to add this java script on the page through the CMS. Initially when i did this the code was just striped I then edited the tiny mce config file to allow JS (extended elements) it stopped stripping but still didn't work. I then tried to use a html page I inserted my JS into the HTML and called it into the page using an iFrame.
    /*******************************************************************************************************/
    <script type="text/javascript" src="http://www.learnpipe.com/javascript/widget/qa/QAInit.js"></
    script>
    <script type="text/javascript">
    var lpQA = lpQA({
    appID:"some_id",
    genQ: "false",
    identifier: "your course code"
    });
    </script>

    Variables explained:
    appID : fixed and valid widget application ID, which is provided by learnpipe.
    identifier: A widget identifier is a unique string which is used to look up/group page questions in the learnpipe
    system. Please pass in the coursecode variable here. The relevant course codes are included in the table
    below.
    genQ: With this option set to “false”, the system treats the page as a course page. With this option “true”, the
    system will enable non course specific questions. Use this option for non-course pages (contact, admissions,
    accommodation, etc.).

    /*******************************************************************************************************/
    The target page imports the page.ss js as below:

    <div>
    <script type="text/javascript" src="http://www.learnpipe.com/javascript/widget/qa/QAInit.js"></script>
    <script type="text/javascript"></script>
    </div>

    And the iframe is the following:

    <p><iframe src="themes/gcd/templates/Includes/LearnpipeBAAFH.html" width="100%" frameborder="0"></iframe></p>

    I didn't design the site so i am not an experienced SS developer but do use your great forums just could'nt find any info on this.
    Ideally I'd like to find a method of targeting individual page with js if this is possible

    Thanks in Advance

    Gem

    749 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.