Custom DataView - Twitter Timeline

XModPro Custom Development

DataViewTwitter

The custom DataView Twitter Timeline allows you to display a twitter feed in your XMod Pro Templates.

Usage

To use this custom dataview within your XMod Pro templates, simply add the REGISTER tag to the first line of the XMod Pro Template:

<%@ Register TagPrefix="mc" Namespace="MooreCreative.Views.Twitter" Assembly="MooreCreative.Views.Twitter" %>

You can then add the DataView to the template with the following syntax:

<mc:TwitterView 
    Username="USERNAME" 
    ConsumerKey="CONSUMERKEY" 
    ConsumerSecret="CONSUMERSECRET"
    Count="10" 
    Retweets="true" 
    Replies="true" 
 />

Control Properties

  • Username - Twitter username
  • ConsumerKey - Twitter API consumer key
  • ConsumerSecret = Twitter API consumer secret
  • Count = Number of items to show
  • Retweets = ”false|true” – Show retweets
  • Replies = “false|true” – Show replies

Available Template Tokens

  • id
  • text
  • created_at
  • user_screen_name
  • user_profile_image_url
  • user_name
  • source
  • retweet_count
  • favorite_count
  • favorited
  • retweeted
  • truncated

Style

The following CCS Classes are available style to the default example Template: - .twitter-timeline - .twitter-timeline p - .tweet - .tweet-author - .tweet-author img - .tweet-text
- .tweet-time - .tweet-actions a

To Complete Initial Setup, YOU MUST UPDATE USERNAME, CONSUMERKEY, CONSUMERSECRET in the mc:TwitterView control.

Useful Twitter help and informatoin links:

Twitter Data Demo

Custom DataView Twitter Timeline

Available Tokens

  • id
  • text
  • created_at
  • user_screen_name
  • user_profile_image_url
  • user_name
  • source
  • retweet_count
  • favorite_count
  • favorited
  • retweeted
  • truncated

Useful links:

Twitter Datasource Info

MC Custom DataView for XMod Pro - Twitter Timeline

The Custom DataView Twitter Timeline allows users to display a twitter feed in your DotNetNuke pages.
 
Benefits & Features: We developed this custom datasource for Twitter so that we could use XModPro-managed code to display a feed of tweets. This can be used as-is for a long or short column of recent tweets, or it can be combined with jQuery and CSS in a social widget, slider, etc. Remember, because it's XMod Pro, you can easily edit and customize your module setup as needed!
  • Easy to Use - Just plug in your Twitter handle and the Consumer Key/Secret from your Twitter account. Once you setup with your account and keys, it will display your tweets in decending timeline order. This is a read-only, efficient datasource, intended to retrieve your tweets quickly, easily and cleanly.
  • Reads in Records like a Database! Read Twitter posts (tweets) into XMod Pro just like any other data source. Set display count variable to read top 1, top 5 or 10, unlimited tweets, etc.
  • Data is Page Rendered – Unlike traditional feed and twitter modules which use a client-side script to fetch and load info, this Twitter Custom DataView for XMod Pro renders the text content as part of the page data just like other data/records, not after page load. This gives the page full Google search credit for the indexed content.
  • Fully Customizable Design & Layout – You have control over the full layout code, structure, setup of hyperlinks, and twitter common actions reply, retweet, or favorite links. Full design control over XMod Pro template code and CSS to make your feed match your website.
  • Multiple Data Tokens Available - See the full list below for items such as Retweet Count, Favorite Count, etc. Can display profile images and usernames in tweet feeds and more!
  • Works with many standard XMP functions such as pagination, xmod:select for filtering/if-case-else actions. Can be combined with show/hide actions and CSS to display some records, all records, scrolling lists of records... it's up to your imagination!

 
This Kit & Code Are Made For XMod Pro

Made For XMod Pro

This Kit / Code works in XMod Pro and is a collection of Forms, Templates and Feeds that together create a solution or module for DNN. This code will not work without XMod Pro 3+ installed in your DNN instance. If you do not already have a licensed copy of XMod Pro, go get one!
Get XMod Pro now from The DotNetNuke Store

Notes & Instructions

Remember, we are continuing to update and enhance the control with new features from your requests and from our ongoing use of the control in client projects. Be sure to let us know your suggestions and requests!

To use this custom dataview within your XMod Pro templates, simply add the REGISTER tag to your template for the MooreCreative Views Twitter library, then follow instructions for customization and options within the new data view, mc:TwitterView.

The Module Kit installer will setup an XMod Pro template as a starter example for you to work from.

Usage Notes:

Tokens available for use within in the XMod Pro template (ItemTemplate)
  • id
  • text
  • created_at
  • user_screen_name
  • user_profile_image_url
  • user_name
  • source
  • retweet_count
  • favorite_count
  • favorited
  • retweeted
  • truncated
Useful links regarding setup of Twitter Timeline & Feeds:

Installation Options:

You have two options on how to install and begin using the module kit:
  • Option 1. Install Manually
    With the provided .ZIP file of contents, you will find the necessary XMod Pro template and form code that you can copy and paste into new forms and templates that you create within the XMod Pro Control Panel. Additionally, if there are associated images and JavaScript files you will find these in the .ZIP as well.
  • Option 2. Use the Kit Module Installer
    The kit module installer allows you to use the standard DotNetNuke module install process to install the XMod Pro forms and template files as well as create the example database table necessary.
    • To use the kit installer, simply install it in the same manner as a standard module.
    • Then, place the module on a page
    • follow the instructions displayed on the module and click a button to complete installation
    • the completion of the installation process will remove the temporary kit installer module from the page and your DNN instance
    • you are now ready to specify the template, forms, etc within a module of XMod Pro like normal