Web Designer+

Photo & Graphic Designer+

Page & Layout Designer 11

Designer Pro+

3D Maker 7

Widget Guide : Version 5

News

There are many news related widgets - below we give a step by step guide to inserting several of the most popular from BBC News, New York Times and Reuters. We've also included the Twitter widget since it can be a good way of delivering personal or company news to anyone interested.
BBC NewsNew York TimesReutersTwitter

BBC News

Below we give a step by step guide to inserting a BBC News Widget.
1
You can find the BBC News widget at Widgetbox.
2
Click on the link labeled 'Customize' on the right side of the page.
3
Select the appropriate size for your widget along with the Theme Color and the layout options.
4
Click on 'Get Widget'
5
A new window will open displaying the Embed Code dialog. Select the appropriate code by clicking on either the JavaScript or the Flash tab, then copy the HTML Code provided.
6
In Web Designer or Xtreme 5, open the web page in which you wish to embed your news widget.
7
Using the Rectangle tool, insert a placeholder sized to be the same size as the widget being inserted on your web page.
8
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab.
9
Replace the HTML code with the code you copied in step 5.
10
Click on OK to apply the changes and close the dialog.

New York Times

Below we give a step by step guide on how to insert a Times widget.
1
Sign in to your account to create your own New York Times news widget.
2
Select 'Times Widgets' from the services section on the lower left side of the page.
3
Click on the button 'Get Started'.
4
Select a category from the list of options or enter a search term and click on the Select button.
5
Select the number of headlines you wish to show in your widget.
6
Check the 'Include Summaries and Thumbnails' option if you wish to have the summary information and images displayed in your widget.
7
Click on the + Add Feed tab if you want to include more than one feed in your widget - you can add a maximum of three feeds.
8
View the widget on the right side of the screen to ensure that you are happy with the contents.
9
Click on the Get Widget button. A new window will open displaying your widget code.
10
Select and Copy (Ctrl + C) the embed code provided.
11
Follow the rest of the instructions from Step 6 onwards in the BBC News widget section above.

Reuters

Below we give a step by step guide on how to insert a Reuters Widget.
1
Browse to the Reuters Widgets page.
2
Select the widget type you wish to create.
3
Click on 'Get This Widget'.
4
Click on Copy to copy the embed code provided.
5
Use the Rectangle tool to create a placeholder sized to be the same size as the widget being inserted.
6
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab.
7
Enable the radio button labeled 'Replace with HTML code' and paste (Ctrl +V) the code you copied in step 4.
8
Click on OK to apply the changes and close the dialog.

Twitter

Below we give a step by step guide on how to insert a Twitter Widget.
1
Sign in to your Twitter page.
2
Scroll to the bottom of the page and select 'Apps' from the list.
3
On the Application page, select 'Widgets by Twitter'.
4
Next, on the 'Where do you want to put it?' select the appropriate site and click continue. For this tutorial, we will use the 'Other' link to embed the Twitter widget in this tutorial as shown above.
5
Select the type of widget you would like, either Flash or HTML, and click Continue.
6
Next, set the title and number of updates for Twitter widget.
7
Next, copy (Ctrl + C) the HTML code provided.
Embed Code:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,124,0" width="290" height="350" id="TwitterWidget" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="allowFullScreen" value="false" /> <param name="movie" value="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#000000" /> <param name="FlashVars" value="userID=20060740&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"> <embed src="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" quality="high" bgcolor="#000000" width="290" height="350" name="TwitterWidget" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="userID=20060740&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"/> </object>
8
Use the Rectangle tool to create a placeholder sized to be the same size as the widget being inserted.
9
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab.
10
Enable the radio button Replace with HTML code and paste (Ctrl +V) the code you copied in step 7.
11
Click on OK to apply the changes and close the dialog.
About Xara | Press | News | Logos & Graphics | Resellers | Jobs at Xara | Contact Xara | Imprint | Privacy & Cookie Statement | EULA

Copyright © 2024 XARA GmbH. Xara® is a registered Trademark of Xara GmbH..

  • Developed in the UK