×
Namespaces

Variants
Actions
(Difference between revisions)

Opera Widget porting example - NHL News

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Automated change of category from Web Runtime (WRT) to Symbian Web Runtime)
hamishwillee (Talk | contribs)
m (Hamishwillee - Bot update - Add ArticleMetaData)
 
(One intermediate revision by one user not shown)
Line 1: Line 1:
[[Category:Symbian Web Runtime]][[Category:How To]]
+
{{ArticleMetaData <!-- v1.2 -->
 
+
|sourcecode= <!-- Link to example source code e.g. [[Media:The Code Example ZIP.zip]] -->
 +
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
 +
|devices= <!-- Devices tested against - e.g. ''devices=Nokia 6131 NFC, Nokia C7-00'') -->
 +
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Qt SDK 1.1.4]) -->
 +
|platform= <!-- Compatible platforms - e.g. Symbian^1 and later, Qt 4.6 and later -->
 +
|devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) -->
 +
|dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
 +
|signing= <!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer -->
 +
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
 +
|keywords= <!-- APIs, classes and methods (e.g. QSystemScreenSaver, QList, CBase -->
 +
|language= <!-- Language category code for non-English topics - e.g. Lang-Chinese -->
 +
|translated-by= <!-- [[User:XXXX]] -->
 +
|translated-from-title= <!-- Title only -->
 +
|translated-from-id= <!-- Id of translated revision -->
 +
|review-by= <!-- After re-review: [[User:username]] -->
 +
|review-timestamp= <!-- After re-review: YYYYMMDD -->
 +
|update-by= <!-- After significant update: [[User:username]]-->
 +
|update-timestamp= <!-- After significant update: YYYYMMDD -->
 +
|creationdate= 20091028
 +
|author= [[User:Andrew.wharton]]
 +
}}
 +
[[Category:Symbian Web Runtime]][[Category:How To]][[Category:Porting]]
 
== Preface ==
 
== Preface ==
 
This is an example of porting a Opera Widget to Nokia WRT using the guide found [[How to port Opera Widgets to Nokia WRT|here]].  The example widget will be a Google News Reader widget.
 
This is an example of porting a Opera Widget to Nokia WRT using the guide found [[How to port Opera Widgets to Nokia WRT|here]].  The example widget will be a Google News Reader widget.
  
[[file:OperaWidgetPortingExamples_GoogleNews_Widget.png]]
+
[[file:OperaWidgetPortingExamples GoogleNews Widget.png]]
  
 
== 1. Download the .zip package ==
 
== 1. Download the .zip package ==
Line 17: Line 38:
 
Here's how to use the Opera Widget config.xml data to create the WRT manifest file:
 
Here's how to use the Opera Widget config.xml data to create the WRT manifest file:
 
#Download and unzip this [[Media:info.plist.zip | info.plist]] template file and save it in the widget's root directory.
 
#Download and unzip this [[Media:info.plist.zip | info.plist]] template file and save it in the widget's root directory.
#Open the widgets config.xml file and find the <widgetname> element. Copy the text found within the element and paste it into the <DisplayName> element of the info.plist file.[[file:OperaWidgetPortingExamples_GoogleNews_DisplayName.png]]
+
#Open the widgets config.xml file and find the <widgetname> element. Copy the text found within the element and paste it into the <DisplayName> element of the info.plist file.[[file:OperaWidgetPortingExamples GoogleNews DisplayName.png]]
#Add the <Identifier> as a random integer 30 digits long.<br />[[file:OperaWidgetPortingExamples_GoogleNews_Identifier2.png]]
+
#Add the <Identifier> as a random integer 30 digits long.<br />[[file:OperaWidgetPortingExamples GoogleNews Identifier2.png]]
#Add the <MainHTML> as index.html.<br />[[file:OperaWidgetPortingExamples_GoogleNews_MainHTML2.png]]
+
#Add the <MainHTML> as index.html.<br />[[file:OperaWidgetPortingExamples GoogleNews MainHTML2.png]]
#Leave <AllowNetworkAccess> as </true>.<br />[[file:OperaWidgetPortingExamples_GoogleNews_AllowNetworkAccess.png]]
+
#Leave <AllowNetworkAccess> as </true>.<br />[[file:OperaWidgetPortingExamples GoogleNews AllowNetworkAccess.png]]
 
#Save the file.
 
#Save the file.
  
 
== 4. Packaging ==
 
== 4. Packaging ==
Re-zip the containing Google News folder and change the file extension from .zip to .wgz.<br />[[File:OperaWidgetPortingExamples_GoogleNews_Packaged.png]]
+
Re-zip the containing Google News folder and change the file extension from .zip to .wgz.<br />[[File:OperaWidgetPortingExamples GoogleNews Packaged.png]]
 
== 5. Deploy ==
 
== 5. Deploy ==
 
Upload the widget to your mobile device and install.
 
Upload the widget to your mobile device and install.

Latest revision as of 08:39, 25 July 2012

Article Metadata
Article
Created: andrew.wharton (28 Oct 2009)
Last edited: hamishwillee (25 Jul 2012)

Contents

[edit] Preface

This is an example of porting a Opera Widget to Nokia WRT using the guide found here. The example widget will be a Google News Reader widget.

OperaWidgetPortingExamples GoogleNews Widget.png

[edit] 1. Download the .zip package

The Google News zip package can be found by following this link.

[edit] 2. Unzip the Google News widget archive

The archive needs to be unzipped to make modifications to its contents, so go ahead and extract it.

[edit] 3. Create info.plist manifest file

When installing a .wgz file the system looks for a manifest file called info.plist. The Opera Widget equivalent is called config.xml.

Here's how to use the Opera Widget config.xml data to create the WRT manifest file:

  1. Download and unzip this info.plist template file and save it in the widget's root directory.
  2. Open the widgets config.xml file and find the <widgetname> element. Copy the text found within the element and paste it into the <DisplayName> element of the info.plist file.OperaWidgetPortingExamples GoogleNews DisplayName.png
  3. Add the <Identifier> as a random integer 30 digits long.
    OperaWidgetPortingExamples GoogleNews Identifier2.png
  4. Add the <MainHTML> as index.html.
    OperaWidgetPortingExamples GoogleNews MainHTML2.png
  5. Leave <AllowNetworkAccess> as </true>.
    OperaWidgetPortingExamples GoogleNews AllowNetworkAccess.png
  6. Save the file.

[edit] 4. Packaging

Re-zip the containing Google News folder and change the file extension from .zip to .wgz.
OperaWidgetPortingExamples GoogleNews Packaged.png

[edit] 5. Deploy

Upload the widget to your mobile device and install.

This page was last modified on 25 July 2012, at 08:39.
87 page views in the last 30 days.
×