The program displays an Instagram badge on your webpage. 

Click and drag the badge to the location on the web page where you want it to appear.

You cannot resize the badge, because making it smaller than its actual size will truncate it, and making it larger will create excess surrounding white space.

To resize the badge, return to the configuration options for your widget and choose a smaller or larger display style. You can do this by double clicking the badge in the program. When the Create New Widget window reopens, click another display style, highlight the code, copy it (CTL+C) as before and then click Insert at the bottom of the Create New Widget window.

Click Preview to view your widget.

Import the Twitter widget from the Content Catalog. Make sure you are signed in to Twitter - if not you will be prompted to do so. 

The Twitter Settings page opens with the Widgets dialog. Click Create new on the top right of the panel. 

To create a widget that displays a Twitter feed on your web page, click on the User timeline tab to configure a user widget.

In the Options field, enter the Twitter username, this could be your own or another Twitter feed.

Complete the remaining Options fields to choose the height of the widget, the theme shade, and specify the web address of the site(s) where you will be embedding the widget. Your choices will be displayed in the Preview panel.

When you're happy with the selection click on the Create Widget button. 

Now back in your web document you'll see that a widget placeholder has been created. Drag the placeholder into position and then click Preview to see the widget in action.

To create a widget that displays your favorite tweets on your webpage in real time, click the Favourites tab. 

Note: You have to have previously chosen at least one favorite tweet before you can create this widget.

Fill in the favourites username and the other options as descibed above in step 3. Then follow steps 4 and 5 as above to create the widget.

To create a widget that displays lists of tweets on your webpage, click the List tab. 

Note: You have to have previously created and named at least one tweet list before you can create this widget.

Fill in the list name and the other options as descibed above in step 3. Then follow steps 4 and 5 as above to create the widget. 

The program displays a placeholder for your Twitter button widget. 

Click and drag the placeholder to the location on the web page where you want it to appear.

You cannot resize the widget, because making it smaller than its actual size will truncate it, and making it larger will create excess surrounding white space.

To resize a Twitter button widget, return to the configuration options for your widget and choose a smaller or larger display style. You can do this by double clicking the placeholder on your web page in the program. When the Create New Widget: Twitter Goodies window reopens, click another button display style then click Insert at the bottom of the Create New Widget: Twitter Goodies window.

Click Preview to view your widget.

Note: When you click the Twitter Follow Me button while previewing your page, you will only see the Follow button on your home page if you have signed out of Twitter.

Import the Social Networking widgets folder from the Content Catalog. 

The Facebook Plug-ins page opens in the Create New Widget: Facebook Social Plug-ins window.

Choose from the following type of social plugin:

• The Like Button allows users to share pages from your site back to their Facebook profile
• The Send Button allows your users to easily send your content to their Facebook friends
• The Comments plugin lets users comment on any piece of content on your site
• The Activity Feed shows users what their friends are doing on your site through likes and comments
• The Recommendations plugin gives users personalized suggestions for pages on your site they might like
• The Like Box enables users to like your Facebook page and view its stream directly from your website
• The Login Button shows profile pictures of the user's friends who have already signed up for your site in addition to a login button
• The Registration plugin allows users to easily sign up for your website with their Facebook account
• The Facepile plugin shows the Facebook profile pictures of the user's friends who have already signed up for your site
• The Live Stream plugin lets your users share activity and comments in real-time as they interact during a live event

Note: To use the Login, Facepile and Comments plug-ins, your site must first have an application ID. You can get an application ID at registering your site. Once you have inserted the plugin placeholder into your Designer Pro or Web Designer page, choose Web Properties from the Utilities menu and in the Placeholder tab code, replace APP_ID in the script with your application ID.

In your chosen plugin's customization settings, enter your URL/domain name, width and height and display criteria for the relevant plugin and click the Get Code button.

The plugin code dialog displays iframe and XFBML code for the plugin. Click in the code you want and press Ctrl and C on your keyboard to copy it.

The Facebook Badges page opens in the Create New Widget: Facebook Widgets window.

When prompted, log in to your Facebook account. 

The Create New Widget: Facebook Widgets window displays a default preview of the badge type you selected. You can change this if you like by selecting a new badge type in the Badges menu on the left-hand side.

To create a Profile badge displaying your photo and information about you, click the Create a New Badge in the top right corner of the window to display customization settings.

Choose a layout and click on the items you want to include in your badge.

A preview is displayed on the right of the window.

Click Save.

If you want to make changes, click Edit this Badge to the right of the badge information and change and save your edits.

In the 'Choose Where to Add the Badge' button bar, click the Other button.

A popup displaying the code for your badge is displayed.

Click in the popup to select the code and press Ctrl and C on your keyboard to copy the code.

To create a Like badge creating access to a Facebook page that you particularly liked and flagged, click the Create a New Badge in the top right corner of the window.

Note: You have to previously tag at least one Facebook page with 'Like this' before creating this widget.

Choose the page for your badge from the Select a Page drop-down list.

A preview is displayed on the right of the window.

Click in the box displaying the code for your badge to select it and press Ctrl and C on your keyboard to copy it.

To create a Photo badge displaying and creating access to your Facebook photos, click the Create a New Badge in the top right corner of the window to display customization settings.

Note: You have to previously add at least one photo to your Facebook profile before creating this widget.

Choose a layout, choose the number of photos to display (between 2-8) and click on the photos you want to include in the badge.

A preview of your Photo badge is displayed on the right of the window.

Click Save.

If you want to make changes, click Edit this Badge to the right of the badge information and change and save your edits.

In the 'Choose Where to Add the Badge' button bar, click the Other button.

A popup displaying the code for your badge is displayed.

Click in the popup to select the code and press Ctrl and C on your keyboard to copy the code.

To create a Page badge creating access to a page or application that you have created in Facebook, click the Create a New Badge in the top right corner of the window.

Note: You have to previously create at least one Facebook page or application before creating this widget.

Choose the page or application for your badge from the Select a Page drop-down list.

A preview of the badge is displayed.

Click in the box displaying the code for your badge to select it and press Ctrl and C on your keyboard to copy it.

You can edit and update the widget contents at any time by double clicking on the placeholder.

Click Insert in the Create New Widget: Facebook Widgets window.

The program displays a placeholder for your badge or plugin. 

Click and drag the placeholder to the location on the web page where you want it to appear.

If the badge or plugin is surrounded by too much white space within the placeholder, you can crop it to the actual badge or plugin size. Click on the placeholder then drag on the selection handles using the Select tool. The program crops the badge accordingly.

However you cannot resize the actual badge or plugin, because making it smaller than its actual size will truncate it, and enlarging it will create excess surrounding white space. To resize a plugin, reimport it specifying a different height and width. A badge cannot be reimported and resized.

Click Preview to view your badge or plugin.

The program displays a placeholder for your Pinterest button. 

Click and drag the placeholder to the location on the web page where you want it to appear. You cannot resize the actual button, because making it smaller than its actual size will truncate it, and enlarging it will create excess surrounding white space. To resize a button, reimport it specifying a different height and width.

Click Preview to view your button.

You can edit and update the widget contents at any time by double clicking on the placeholder.