Difference between revisions of "PT Social Media Version 1.0 Install"

From ADF Docs
Jump to: navigation, search
(Manage App Configuration Page)
(Site Configuration)
Line 55: Line 55:
 
Example: The SocialMedia Selector custom element contains two uses of the General Chooser field type, if the General Chooser field type is already installed on the site then the import process will attempt to import another General Chooser but with a new name such as "General Chooser_import_1250003208472." To resolve this issue, open the custom element and assign the field type (General Chooser_import_1250003208472) to the field type with the simple name General Chooser. After reassigning the field type, delete the new imported field from the list of custom field types.
 
Example: The SocialMedia Selector custom element contains two uses of the General Chooser field type, if the General Chooser field type is already installed on the site then the import process will attempt to import another General Chooser but with a new name such as "General Chooser_import_1250003208472." To resolve this issue, open the custom element and assign the field type (General Chooser_import_1250003208472) to the field type with the simple name General Chooser. After reassigning the field type, delete the new imported field from the list of custom field types.
  
=== Site Configuration ===
+
== App Configuration ==
 
The Social Media App uses a custom element to store site specific configurations.  
 
The Social Media App uses a custom element to store site specific configurations.  
  

Revision as of 19:35, 1 May 2012

Back to Social Media

Download

Download the Social Media Application from the Community Site Project or from the SVN Repository.

Extract the zip files into the following directory: /ADF/apps/pt_social_media/

Site Configuration

The Social Media Application is built within the ADF. The ADF 1.5 or greater must be installed in the site to run the Social Media Application, follow the ADF Installation instructions.

Steps

  • Make sure the ADF is setup and running on the site. If the ADF is not setup, then follow the instructions for ADF Installation.
  • Open the sites 'ADF.cfc' (See Site Configuration (ADF.cfc) for more info) file (located in your site's /_cs_apps/ directory) in a text editor. Locate the Load the ADF Application into application space comment in the file. Add (or uncomment) the following command under the comment section:
loadApp("ptSocialMedia");

Styles

There are several out of the box style options for the Social Media application. Most of the styles are defined in the following style sheets located in the /style directory within the ADF Social Media App directory:

  • socialmedia.css

You have two options: you can either load them into your Base Plus One (recommended) or your can load them into the Social Media Template you create.

Note: the classes and styles defined for the Social Media app are targeted tightly for the layout generated by the Social Media application and should not interfere with your site styles. However, it is a good idea to give these styles sheets higher precedence in your style definitions.

Import Custom Elements

The Social Media App has several Custom Components defined within CommonSpot. These components are available in the Social Media's "exported-objects" folder located at the root of the Social Media application directory (e.g. /ADF/apps/pt_social_media/exported-objects/)

To import these objects, you will need to be an administrator for your site.

Import

Create a "PT Social Media Elements" category and import all portions of each component in the order listed.

Import Custom Elements:

  1. SocialMedia Selector (SocialMedia-Selector-Custom-Element.zip)
  2. Facebook Pages (Facebook-Pages-Custom-Element.zip)
  3. Twitter Accounts Keywords (Twitter-Accounts-Keywords-Selector-Custom-Element.zip)
  4. WordPress Blogs (WordPress-Blogs-Custom-Element.zip)
  5. YouTube Channels (YouTube-Channels-Custom-Element.zip)
  6. ptSocialMedia Configuration (ptSocialMedia-Configuration-Custom-Element.zip)

Verify Imports

The imported components' render handlers and custom field types must be verified. During the import process, the render handler and custom field types paths may have been changed to reflect the current site's path.

Review and update these paths to reference the ADF path. In most cases, this will just require to be unlocked and a change in the path from the site name to 'ADF'. Check the paths for the custom field types that were imported with the custom elements by unlocking them and fixing the explicit paths to point to "/ADF/extensions/".

If the custom elements that are imported contain custom field types that are already in the site, the naming convention for the custom field type will be unique. To resolve this, unlock the field types and elements, and reassign the element field type to the pre-existing field type.

Example: The SocialMedia Selector custom element contains two uses of the General Chooser field type, if the General Chooser field type is already installed on the site then the import process will attempt to import another General Chooser but with a new name such as "General Chooser_import_1250003208472." To resolve this issue, open the custom element and assign the field type (General Chooser_import_1250003208472) to the field type with the simple name General Chooser. After reassigning the field type, delete the new imported field from the list of custom field types.

App Configuration

The Social Media App uses a custom element to store site specific configurations.

Most of these configuration fields will not need to be modified from their default values. Although, there are a few fields that the values will need to be customized for your specific install of the application. These fields are be listed below.

Configuration Fields

There are several configuration fields:

General Config Tab

  1. ui_theme - The Social Media app utilizes jQueryUI Themes for styling of buttons, etc. There are some pre-installed themes that come with the ADF in the Thirdparty folder.

Facebook API Tab

  1. apiFacebookAppID - The App ID you receive when you register your App on Facebook
  2. apiFacebookAPIKey - The API Key you receive when you register your App on Facebook
  3. apiFacebookAppSecret - The App Secret you receive when you register your App on Facebook
- Facebook App Registration Instructions

WordPress API Tab

  1. wordPressServiceURL - URL of Blog Index page
  2. wordPressServiceImage - A service image for Blog Index page
  3. apiWordPressFeedSuffix - Suffix for the WordPress Blog RSS feed. ie. '?feed=rss2' or '/feed/' depending how your WordPress site is configured
  4. apiWordPressContentWordLimit - Maximum number of words rendered from the blog post content. Default: 100. Use 0 (zero) to display all.

Note: The other API fields in the configuration element (not listed here) should NOT need to be modified from their default values unless one of the social media services changes their data feed format or feed URL and/or URL parameters.

Subsites

A specific subsite for social media pages is optional. The Social Media Feed page which in most cases will be a public facing page (or pages) can live anywhere on your site. But for this install we will create a socialmedia subsite for this page.

It is highly recommended to have a Web Admin subsite that contains a Social Media subsite that will contain the Management pages for for administrators. This allows security to be setup for the subsite to allow only administrators access for the webadmin subsite.

Your site may already have a webadmin subsite. The steps under 'Web Admin will add a socialmedia subsite into the webadmin subsite.

Social Media

  1. Create a new subsite under the site root called socialmedia.

Web Admin

  1. Create a new subsite under the site root called webadmin.
  2. Create a new subsite under webadmin called socialmedia.
  3. Configure the /webadmin/socialmedia/ subsite Content Security to give 'No Rights' to 'Anonymous Users' and 'Authenticated Users'.
  4. Configure the /webadmin/socialmedia/ subsite Content Security to give permissions to the group of administrators who will manage the Forums.

Templates

Social Media Template - Optional

The Social Media template will be used to render Social Media pages.

Note: A Social Media templates are not critical for this application. A Social Media feeds page can be added to any page based on any template with a large main content column.

  1. Create a CommonSpot page called 'Social Media' from the Base Plus One template. (The subsite for this is not critical but it may be a good idea to create a subsite called 'socialmedia').
  2. Submit and activate the page.
  3. Save the page as a template.
  4. Submit the template for public use.

Web Admin Template - Optional

The Web Admin template will be used to render web admin management pages.

  1. Create a CommonSpot page called 'Web Admin' from the Base Plus One template. (The subsite for this is not critical but it may be a good idea to create a subsite called webadmin).
  2. Submit and activate the page.
  3. Save the page as a template.
  4. Submit the template for public use.

Admin Pages

CCAPI Configuration

The Social Media Application uses the ADF CCAPI to populate each of the social media service custom element records with moderation data. The CCAPI needs to be configured for the site and forums application.

First, follow the steps to set up the CCAPI Config file for the site. Once that configuration is complete, follow the steps below to set up the CCAPI config for the Photo Gallery application. Make sure to update the wsVars section with the correct URLs and username/password.

  1. Create a new page called 'ccapiSocialMedia'. Recommend creating this page in the /webadmin/socialmedia/ subsite.
  2. Add each of the following Forums elements to the page:
    1. Facebook Pages
    2. Twitter Accounts Keywords
    3. WordPress Blogs
    4. YouTube Channels
  1. For each element that was added, click on the element indicator and go to 'more...'. Select 'Name' from the menu.
  2. In the Element Name field, enter the appropriate name for each element:
    1. ccapiFacebookPages
    2. ccapiTwitterAccountsKeywords
    3. ccapiWordPressBlogs
    4. ccapiYouTubeChannels
  1. Publish this page and view in read mode.
  2. Edit the 'ccapi.cfm' file for the site and add the following xml blocks into the <elements> section:
    1. an example 'ccapi.cfm' file is in the pt_social_media > site-files > _cs_apps > config folder
<FacebookPages>
  <pageID>#####</pageID>
  <subsiteID>##</subsiteID>
  <elementType>custom</elementType>
  <controlName>ccapiFacebookPages</controlName>
</FacebookPages>
<TwitterAccountsKeywords>
  <pageID>#####</pageID>
  <subsiteID>##</subsiteID>
  <elementType>custom</elementType>
  <controlName>ccapiTwitterAccountsKeywords</controlName>
</TwitterAccountsKeywords>
<WordPressBlogs>
  <pageID>#####</pageID>
  <subsiteID>##</subsiteID>
  <elementType>custom</elementType>
  <controlName>ccapiWordPressBlogs</controlName>
</WordPressBlogs>
<YouTubeChannels>
  <pageID>#####</pageID>
  <subsiteID>##</subsiteID>
  <elementType>custom</elementType>
  <controlName>capiYouTubeChannels</controlName>
</YouTubeChannels>

To populate the <pageID> and <subsiteID> tags, view the 'source' code for the 'ccapiSocialMedia' page that was just created.

Identify the following line in the source code and enter this numeric value into the <subsiteID> tag:

     var jsSubSiteID = ##;

Identify the following line in the source code and enter this numeric value into the <pageID> tag:

     var jsPageID = ####;

Manage App Configuration Page

The Social Media Configuration Page will be used to manage the ptSocialMedia Configuration custom element. Follow these steps to configure the datasheet and page for adding the configuration settings.

Steps

  1. Create a new page called 'Configuration Manager' in the /webadmin/socialmedia/ subsite.
  2. In the main content of the page, add a Custom Script element.
  3. Enter the explicit module path for:
    • /ADF/apps/pt_social_media/customcf/manage_configuration_header.cfm
  4. Publish the page.

Create Social Media Configuration Record

We are creating a single Social Media Configuration element record to be used within the application.

  1. Click the Add Configuration button
  2. Submit the form to create a configuration record.

Doing this will save the default field values in the configuration record of the custom element.

You can also update the following fields:

  1. General Config Tab
    1. ui_theme
  2. Facebook API Tab
    1. apiFacebookAppID
    2. apiFacebookAPIKey
    3. apiFacebookAppSecret
  3. WordPress API Tab
    1. wordPressServiceURL
    2. wordPressServiceImage
    3. apiWordPressFeedSuffix
    4. apiWordPressContentWordLimit

See the Site Configuration wiki page for more information on the fields and the correct values.

Reset the ADF for the server and site.

Manage Social Media Page with Multiple Datasheets

Social Media Stream Debug Page - Optional

Social Media Stream Pages

For this install we will only create one main social media stream page. But many pages can be created throughout your site to meet your specific needs using this same method. For example, a separate page could be created for each of the social media services (ie. YouTube Channels page) or pages could be created for specific social media accounts.