Mynewsdesk JSAPI Channels

This documentation includes a Quick Start that helps you to get started with your implementation. If you need more specified details look at the methods listed in left bar navigation.

Quick startNavigation 

First step is to get your Partner API-Key by signing up as a Partner.

Next you can create a new Channel in your partner account and define a appropriate search term that match the content you will display at your website. After a few minutes your channel will start collecting new material based on your channel settings.

Listing and viewing pressreleases from your channel

Follow the steps below to create a list of pressreleases from your channel.

Include JavaScript

Include the Mynewsdesk JavaScript file code below in your HTML page. The JavaScript have to be included in all pages where you use Mynewsdesk JSAPI. 

<script type="text/javascript" src="http://www.mynewsdesk.com/jsapi.js"></script>

Load channels JSAPI

Initialize the Mynewsdesk load method inside a script block with the channel feature and version specified. Include your private API-key and the id of the channel you will display material from (you can find both in your partner account). The callback is the name of the function to run when the channel API is loaded.

Javascript load feature
<script type="text/javascript" language="JavaScript">
mynewsdesk.load({
    feature: "channels",
    version: "1",
    api_key: "INSERT_YOUR_API_KEY",
    channel_id: "INSERT_YOUR_CHANNEL_ID",
    callback: myCallbackFunction
});
</script>

List material from Channel

Before we start with the list method call we need a element where we should place the content from Mynewsdesk JSAPI.

HTML element container

HTML element where the content from the request will be rendered. 

<div id="list_content_holder">
    Loaded HTML will replace this content
</div>
Javascript callback function

When the Channel feature is loaded, your callback function will be executed. In this example the callback function is defined as "myCallbackFunction" and within the function myCallbackFunction you can access all Channel methods.

The example below loads all Pressreleases within the channel and places the content in an element with id "list_content_holder". The setting "view_template_url" is your html page where you will show the full content of the pressrelease.

Below is an example callback function that execute the list method that updates content inside HTML element with id list_content_holder. 

<script type="text/javascript" language="JavaScript">
function myCallbackFunction(){
    mynewsdesk.channels.list("pressreleases", "list_content_holder",{
        view_template_url: "view_pressreleases.html"
    });
}
</script>
A complete code example
<html>
    <head>
    <title>List pressreleases</title>
    <script type="text/javascript" src="http://www.mynewsdesk.com/jsapi.js"></script>
    <script type="text/javascript" language="JavaScript">
        mynewsdesk.load({
            feature: "channels",
            version: "1",
            api_key: "INSERT_YOUR_API_KEY",
            channel_id: "INSERT_YOUR_CHANNEL_ID",
            callback: myCallbackFunction
        });
        function myCallbackFunction(){
            mynewsdesk.channels.list("pressreleases", "list_content_holder",{
                view_template_url: "view_pressreleases.html"
            });
        }
    </script>
    </head>
    <body>
        <div id="list_content_holder">
            Loaded HTML will replace this content
        </div>
    </body>
</html>

You will now have a working list of Press Releases rendered to a HTML element at your webpage.

View material from Channel

To view material you create a separate HTML page with the same name that you have used as template url for the list method (view_pressreleases.html) where you display the full content of the material. You will have to include the JavaScript file above and include the load of the channel feature.

When all required scripts are loaded you call the view method instead of the list method.

View method

Below we execute the view method and display the content in an HTML element with id view_content_holder. The view method will automatically load the correct id for the clicked news item from the list view based on the id and type_of_media.

JavaScript view method
<script type="text/javascript" language="JavaScript">
function myCallbackFunction(){
    mynewsdesk.channels.view("view_content_holder");
}
</script>
A complete code example
<html>
    <head>
    <title>View pressrelease</title>
    <script type="text/javascript" src="http://www.mynewsdesk.com/jsapi.js"></script>
    <script type="text/javascript" language="JavaScript">
        mynewsdesk.load({
            feature: "channels",
            version: "1",
            api_key: "INSERT_YOUR_API_KEY",
            channel_id: "INSERT_YOUR_CHANNEL_ID",
            callback: myCallbackFunction
        });
        function myCallbackFunction(){
            mynewsdesk.channels.view("view_content_holder");
        }
    </script>
    </head>
    <body>
        <div id="view_content_holder">
            Loaded HTML will replace this content
        </div>
    </body>
</html>

CSS (StyleSheet)

The design of your implementation will be configured at the website where you use the JSAPI. Mostly the implementation will look good if you have a well designed stylesheet at your website. But sometimes you need to add some minor styles to get it looks proper. You can take a look at the example website for the styles and classes or just start explore the rendered code with Firebug or your favorite tool.

Example CSS

We have created a simple CSS with the most basic styles that you can add to your existing stylesheet as a start. This simple CSS is just some configuration for the headers in list where the source name and date are displayed. You will also have some basic font settings and it will remove the default bullets in list.

Simple start CSS
/*both list material and view material*/
span.source{
    text-transform:uppercase;
}
span.date{
    padding-left:10px;
    font-style:italic;
}
/*List material (element with id=list_content_holder)*/
#list_content_holder ul{
    margin:0;
    padding:0;
    list-style-type:none;
}
#list_content_holder h2 span.header{
    font-size:14px;
    display:block;
}
#list_content_holder h2 span{
    font-size:12px;
}
/*View material (element with id=view_content_holder)*/
#view_content_holder h1{
    font-size:18px;
}

Demo implementationNavigation 

We have created a simple example implementation of the Channel JSAPI, take a look and get inspired. The code is free to download and your are free to modify the code for your purposes.

Mynewsdesk example implementation of Channel JSAPI

Get your Mynewsdesk API-KeyNavigation 

You have to sign-up for a free Partner Account to get your API-key and start

Load Channels Feature JavaScriptNavigation 

Before you can use the JavaScript Channel API you have to load the feature from Mynewsdesk and define a callback function where you access the Channel API methods.

Required parameters

feature
The feature to load, use channels
version
The version of the API, use 1
api_key
Your API key that your will find in your partner account
channel_id
The id of the Channel that you will fetch data from, you find this in your partner account at the channel.
callback
The callback function that will be executed when the feature is loaded and where you access the API methods.

Optional parameters

charset
Choose your charset, default is utf-8
Load channels example
<script type="text/javascript" src="http://www.mynewsdesk.com/jsapi.js"></script>
<script type="text/javascript" language="JavaScript">
    mynewsdesk.load({
        feature: "channels",
        version: "1",
        api_key: "INSERT_YOUR_API_KEY",
        channel_id: "INSERT_YOUR_CHANNEL_ID",
        callback: myCallbackFunction
    });
    function myCallbackFunction(){
        mynewsdesk.channels.view("view_content_holder");
    }
</script>

Channel List methodNavigation 

With the list method you will be able to list material from a Channel. Just one type_of_media or mix it all together.

Required parameters

type_of_media
Type of media to display in the list as a string or if more than one an array.
Example: "news"
Example: ["pressreleases","news","blog_posts","images", "videos", "events", "documents", "contact_people"]
element_id
DOM element id where the content should be added.

Optional parameters

view_template_url
URL to the page where the full content of the material will be displayed.
callback
You can define you own function to handle the result from the request. The object that came as argument to the callback function looks like this:
{element: "elementid",html: "<h1>Html code returned for the list action</h1>"}
List example
mynewsdesk.channels.list("type_of_media", "element_id",{
    view_template_url: "view_pressreleases.html"
});
List example with callback and multiple type_of_medias 
mynewsdesk.channels.list(["pressreleases","news"], "my_element_id",{
    callback: "doIt"
});
function doIt(result){
    document.getElementById(result.element).innerHTML = result.html;
}

Channel View methodNavigation 

With Channel View method you can display the full content of material from your channel.

Required parameters

element_id
The DOM element id where the content should be added.

Optional parameters

type_of_media
The type of media to display, If not any type_of_media is defined it will automatically load type_of_media from QueryString (passed in the URL from the list method). If the type_of_media is specified and the item_id is missing in querystring it will default renders the latest material for the choosen type_of_media.
item_id
Id for the material to view. If no item_id is defined it will automatically loads item_id from querystring (passed from the list method). If type_of_media is defined but no item_id specified the latest material in the choosen type_of_media will be rendered.
callback
You can define you own function to handle the result from the request. The object that came as argument to the callback function looks like this:
{element: "elementid",html: "<h1>Html code returned for the list action</h1>"}
View example dynamic from querystring parameters
mynewsdesk.channels.view("element_id");
View example based on a specific type_of_media
mynewsdesk.channels.view("my_element_id",{
    type_of_media: "news"
});
View example based on a specific type
mynewsdesk.channels.view("my_element_id",{
    type_of_media: "news"
});