Software

Hop Social Suite

Current Version: 3.4.1
  • EE3
  • EE4
  • EE5
  • EE6
  • EE7
  • Installation for EE 3+

    1. Unzip the folder to a temporary location on your local hard drive.
    2. FTP the files from their local folders to the same locations in your EE install’s /system/user/addons/ folder on the server.
    3. Navigate to Add-ons in your EE control panel and install the add-on. That’s it!

  • Installation for EE 2

    1. Unzip the folder to a temporary location on your local hard drive.
    2. FTP the files from their local folders to the same locations in your EE install’s /system/expressionengine/third_party/ folder on the server.
    3. Navigate to Modules in your EE control panel and install the add-on. That’s it!

  • Authentication


    Twitter

    To get Twitter API credentials, go to https://apps.twitter.com/, login to your account and create a new app. You must have Basic access or up to fetch Tweets through the API: https://developer.twitter.com/en/docs/twitter-api/getting-started/about-twitter-api.


    Facebook

    To get Facebook API credentials, go to https://developers.facebook.com/docs/apps#register, login to your account and add a new app. You need to:

    • Authenticate the App (Business or Individual)
    • Be the admin of your facebook page
    • Follow the instructions to get your Facebook App Token
    Authentication for the Page Access Token
    1. Go to Graph API Explorer.
    2. Select your application in Facebook App.
    3. Select Get User Access Token under User or Page.
    4. Make sure you have the following permissions: pages_show_list, pages_read_engagement, pages_read_user_content.
    5. Click Generate Access Token.
    6. Next to Access Token, choose the page you want an access token for. The access token appears as a new string.
    7. Click icon to see the properties of this access token.
    8. Click Open in Access Token Tool button again to open the Access Token Debugger tool to check the properties.
    9. Click Extend Access Token and you should see This new long-lived access token will never expire: and another Access Toekn.
    10. Click Debug beside the new Access Token.
    11. Paste in the settings from Access Token Debugger -> EE accordingly.
      • App-Scoped User ID -> Facebook User ID
      • App ID -> Facebook App ID
      • Extended Access Token (in the top field) -> Facebook User Token
      The Facebook App Secret can be found in your Facebook App Dashboard under Settings > Basic.
    12. On the EE Hop Social Suite settings screen, click the Exchange for Facebook Page Access Token button to acquire the page access token that can fetch posts from Facebook.

    You’ll need to re-authenticate for the facebook page access token at least once every 2 months by clicking the Exchange for Facebook Page Access Token button. Facebook Documentation Reference


    Instagram

    Since December 4th, 2024, Instagram Basic Display API has been discontinued; Hop Social Suite will now use the new Instagram API to fetch the Instagram feed. Your app should automatically be converted to the new format.

    1. Create an app https://developers.facebook.com/apps/creation/
    2. Select Other in Use cases
    3. Select Business in Type
    4. Select the Business profile in Details
    5. Set up Instagram
    6. Under API setup with Instagram login, click Add account
    7. Log in with the Instagram account you want to pull medias from
    8. Click Generate token
    9. Click Allow in the Authorization Request popup
    10. Click I Understand and copy the Access token to Hop Social Suite > Instagram Access Token
    11. Save settings
    12. Click Refresh Access Token

    Once everything is configured correctly, you’re no longer required to re-authenticate for the Instagram Access Token.

  • Usage

    Choose from the simple implementation or customize more fully using the timeline tag pair.

    Simple

    {exp:hop_social_suite:simple}

    Timeline

    {exp:hop_social_suite:timeline}
  • Examples

    Simple

    {exp:hop_social_suite:simple twitter_search_query="#eecms" limit="10"}
    {exp:hop_social_suite:simple facebook_min="3" facebook_max="5" twitter_min="6" instagram_max="1" limit="20"}

    Timeline

    {exp:hop_social_suite:timeline facebook_min="3" twitter_min="3" instagram_min="3" limit="10"}
        {if no_results}
            No recent social media posts.
        {/if}
        {if count == 1}
            <p>We got {twitter_count} tweets, {facebook_count} facebook posts, and {instagram_count} instagram media items for you.</p>
            <p>Total posts count: {total_results}</p>
        {/if}
        <h3>{social_network} {count}</h3>
        <ul>
            <li>text: {text}</li>
            <li>text_url: {text_url}</li>
            <li>text_no_url: {text_no_url}</li>
            <li>date: {date}</li>
            <li>post_url: {post_url}</li>
            <li>from: {from}</li>
            <li>profile_url: {profile_url}</li>
    
            {if social_network == 'Twitter'}
                <li>screen_name: {screen_name}</li>
    
                <li>retweet_count: {retweet_count}</li>
                <li>reply_count: {reply_count}</li>
                <li>like_count: {like_count}</li>
                <li>quote_count: {quote_count}</li>
                <li>bookmark_count: {bookmark_count}</li>
                <li>impression_count: {impression_count}</li>
                <li>profile_picture: {profile_picture}</li>
                
                <li>retweet_url: {retweet_url}</li>
                <li>favorite_url: {favorite_url}</li>
                <li>reply_url: {reply_url}</li>
            {/if}
            
            {if social_network == 'Facebook'}
                 <li>picture: {picture}</li>
                 <li>picture_hd: {picture_hd}</li>
                 <li>reactions_count: {reactions_count}</li>
                 <li>shares_count: {shares_count}</li>
                 <li>comments_count: {comments_count}</li>
            {/if}
    
            {if social_network == 'Instagram'}
                 <li>thumbnail_url: {thumbnail_url}</li>
                 <li>media_type: {media_type}</li>
                 <li>media_url: {media_url}</li>
            {/if}
        </ul>
        <hr>
    {/exp:hop_social_suite:timeline}
  • Parameters

    These parameters can be used with either the simple or extended timeline implementation.

    twitter_username Retrieve tweets from the specified username. This overrides the default Twitter username setting.

    twitter_search_query Retrieve tweets matching the query. Refer to Twitter’s Advanced Search to understand how to customize your search query. If this option is used, Hop Social Suite will ignore the Twitter default username and twitter_username passed in (if set) in the tag.

    Note the search index has a 7-day limit. In other words, no tweets will be found for a date older than one week.

    twitter_include_rts Include retweets (default: yes) The count always includes the retweets so setting this to ‘no’ may get an insufficient amount of tweets intended.

    limit Specify how many posts in total to display. This overrules all the minimum and maximum settings.

    twitter_mi Specify at least how many tweets should display.

    twitter_max Specify the max number of tweets to display.

    facebook_min Specify at least how many Facebook posts should display.

    facebook_max Specify the max number of Facebook posts to display.

    instagram_min Specify at least how many Instagram posts should display.

    instagram_max Specify the max number of Instagram posts to display.

  • Timeline Tags

    {count} Display count of the current post.

    {social_network} This will display “Facebook” or “Twitter”, depending on the source of the social post.

    {twitter_count}, {facebook_count} and {instagram_count} Display the post counts separately.

    {from} Display the Twitter username or the person/page name.

    {profile_url} Display the Twitter account URL or Facebook person/page URL of the social poster.

    {text} Display the raw text of the social post. URLs will not render as links.

    {text_url} Display the post with URLs as links.

    {text_no_url} Display the post without any URLs.

    {post_url} This is the URL of the post that is coming from the channels. It can be permalink from FB/Instagram or URL of the post from Twitter.

    {date format="%Y-%m-%d"} Date of the social post. The date can be customized using ExpressionEngine date variables.

    {total_results} Display the total number of social posts.

    Twitter only

    {screen_name} Display the Twitter screen name.

    {profile_picture} URL of the Twitter avatar of the person who posted the tweet. Twitter only.

    {retweets_count} Display the number of times the tweet has been retweeted. Twitter only.

    {favorites_count} Display the number of time the tweet has been saved as favorite. Twitter only.

    {retweet_url} Output an intent URL to retweet the post. Twitter only.

    {favorite_url} Output an intent URL to favorite the tweet. Twitter only.

    {reply_url} Output an intent URL to reply to the tweet. Twitter only.

    Facebook only

    {picture} URL of the post image (thumbnail) if there is one.

    {picture_hd} URL of the post image if there is one.

    {reactions_count} Display the number of reactions of the Facebook post.

    {shares_count} Display the number of times the Facebook post has been shared.

    {comments_count} Display the number of comments of that post.

    Instagram only

    {thumbnail_url} URL of the thumbnail for video media.

    {media_type} The media type of the post.

    {media_url} The actual URL to the media included in the post.

  • Updating

    Updating is easy:

    1. Download a new version from this website, and extract on your hard drive.
    2. Upload the new files to their appropriate locations.

  • Uninstalling

    1. Navigate to the Add-Ons > Modules tab in your EE control panel and uninstall the module.
    2. Remove the add-on directory from your EE system folder on the server.

  • Future Goals

    We’re working hard to get the Instagram Graph API integrated so that you can link your Instagram business account.

    We’d like feedback on what other social networks to include as well.

Have a Project for Us?

Request a Proposal