Control Panel Overview

The next step is to setup the appearance of your widget as well as the message it will convey.

Widget Settings

You have two layout options - Default or Custom. Choose Custom to explore the options.

widget_settings

The Custom design colors allow you to make the social buttons match the exact color scheme of your website's design. You can customize the color of the text, background and border.

CSSFor users fluent in CSS, you can input custom CSS code for further customization of your SocialDiscounts widget.

Store Front Widget

This is the place where you edit the subject that invites users to share your store on social media and notifies them of the discount they will get. Customize the subject and the text in the editor below to suit your store and audience.

Configuring your discounts

The Discount tab lets you determine what kind of discount your customers will get when interacting with your social buttons.

discount

Action

This is where you will find all of the actions you can enable for customers to use - Facebook share and like, as well as Twitter follow or tweet.

Discount

This field allows you to change your discount calculation from Percentage to Fixed amount.

Sort Order

This allows you to adjust the placement of each social button - for example if you want your Twitter follow discount to be first, the sort order should be 1.

Description

The description gives you a way to add text below the social buttons and personalize your offer even more.

Facebook options

The Facebook tab allows you to tweak the discounts related to liking and sharing on Facebook.

facebook1

First, you can enable or disable your Facebook discounts. Next, you need to configure your Facebook App ID and App Secret, which can be taken from the Facebook developers' website.

Select social buttons

This field allows you to select which actions your customers will be able to take to get a discount - like, share, or both.

facebook2

Scrolling down in the options, you see the fields that allow you to configure the URLs.

Like Page

You can set the button to the current URL of your Facebook profile page, or set a custom URL to be liked when a customer clicks the social button in your website.

Share URL

You can set the button to the current URL of your Facebook profile page, or set a custom URL to be shared when a customer clicks the social button in your website.

Caption

Customize the caption of the shared link name appearing below the Shared link. Don't worry if you leave the field blank - it will be automatically filled with the URL of the link.

Description

Customize the description of the shared link name appearing below the Shared link. Don't worry if you leave the field blank - it will be automatically filled with the URL of the link.

facebook3

The bottom of the Facebook tab offers customization for the Share and Like social buttons in your website.

Button Design

You have 4 pre-set designs including Standard UI, Metro UI, Rounded UI or no design, which is a plain Share text.

CSSFor users fluent in CSS, you can input custom CSS code for further customization of your SocialDiscounts widget.

Facebook share button name

You can customize the text on the social button itself. It can be changed to anything you think will work better for your store (example: Pay it forward).

Picture

Attach a URL of an image you want to add to the Facebook post that a customer shares.

Twitter options

The last tab for setting up SocialDiscounts is for adjusting Twitter options.

Enable the Twitter sharing status to begin modifying the rest of the settings.

Twitter Consumer Key and Secret

After you create a Twitter app from www.dev.twitter.com, details will be shown along with your Consumer Key and Consumer Secret.

Instructions for setting up your Twitter App:

  1. Log into the Twitter Developers section.
  2. If you don't already have an account, you can login with your normal Twitter credentials
  3. Go to "Create an app"
  4. Fill in the details of the application you'll be using to connect with the API
  5. Your application name must be unique. If someone else is already using it, you won't be able to register your application until you can think of something that isn't being used.
  6. Click on Create your Twitter application
  7. Make sure to add your website URL and http://yourdomain.com/index.php?route=module/socialdiscounts/ as your Callback URLs
  8. Details of your new app will be shown along with your consumer key and consumer secret
  9. If you need access tokens, scroll down and click Create my access token.

The page will then refresh on the "Details" tab with your new access tokens. You can recreate these at any time if you need to.

By default, your apps will be granted for read-only access. To change this, go to the Settings tab and change the access level required in the "Application Type" section.

twitter_app

ImportantDon't forget to enter your website URL and http://yourdomain.com/index.php?route=module/socialdiscounts/ in the Callback URLs field in your Application Details.

twitter_new

Select Social Bbuttons

You can either let your customers tweet or follow your Twitter profile to get a discount. Or you can use both.

Share URL

Choose whether you want to share the current URL or a custom one. If you select the Share custom URL option, you will see a field where you can enter it.

Twitter Hashtag

This is very important for this particular social platform, because it extends the reach of the specific post beyond the followers you or your customer have. Make it count.

User to Follow

Set which Twitter profile your customers should follow to get the discounts.

Tweet Message

Define the exact message you want your customers to tweet to their followers.