How to display styled print out of XML on website - html

I am using some XML and I want to display it on site, But will prefer to display some styled version. Let's say in some boostrap table or something like that but somehow i have no clue how.
Example XML:
<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>W3Schools Home Page</title>
<link>http://www.w3schools.com</link>
<description>Free web building tutorials</description>
<item>
<title>RSS Tutorial</title>
<link>http://www.w3schools.com/rss</link>
<description>New RSS tutorial on W3Schools</description>
</item>
<item>
<title>XML Tutorial</title>
<link>http://www.w3schools.com/xml</link>
<description>New XML tutorial on W3Schools</description>
</item>
</channel>
</rss>
So let's say I have this XML, and i want to style it to table where will be:
Title | Link | Desc
W3Schools Home Page | http://www.w3schools.com/rss | New RSS tutorial on W3Schools
XML Tutorial | http://www.w3schools.com/xml | New XML tutorial on W3Schools
Can you give me some inditions or some can someone write example code for me to make it more clear.
I hope I don't ask for too much. Thank you all !!

Traditionally this done with an XSLT which is an instruction sheet for the browser to converts the xml into html automagically.
Checkout out:
https://greenbytes.de/tech/tc/xslt/
...for some great links to book and additional information.
There are some working examples at:
http://www.w3schools.com/xsl/xsl_examples.asp

Related

Is it possible to display an xml code on a page in ReactJS?

Say I have this xml code and I want to display it on my page:
<?xml version=\"1.0\" encoding=\"UTF-8\" ?> <rss version=\"2.0\">
<channel>
<title>W3Schools Home Page</title>
<link>https://www.w3schools.com</link>
<description>Free web building tutorials</description>
<item>
<title>RSS
Tutorial</title>
<link>https://www.w3schools.com/xml/xml_rss.asp</link>
<description>New RSS tutorial on W3Schools</description> </item> </channel> </rss>
I tried doing this, but the output is not what I want:
<div dangerouslySetInnerHTML={{ __html: this.state.body }} />
The output is like this:
https://www.w3schools.com Free web building tutorials https://www.w3schools.com/xml/xml_rss.asp New RSS tutorial on W3Schools
Which is not what I want. I want it to display the rss feed on my page without redirecting me, how can I do that? (Btw, the body is reading perfectly fine, so the problem is not from the body)
If you want to show the XML source code, then just output it as you would any other text:
<div>
{ this.state.body }
</div>
If you want to do sensible formatting, then you'll need to actually parse the XML and extract the data you care about from it. (There are JavaScript RSS parsers out there, you might want to look on NPM for a library you can use to do the heavy lifting for you).

How to Escape HTML URL via XML

So we just got a new phone system in the office. I am trying to figure out if there is a possibility to store contact photos of the various people in the company contact list outside of the individual phone storage. Currently we have to upload a photo for each person for each phone (since it is stored internally). We are able to import/upload a XML file to the phone. Below is where I am currently:
<?xml version="1.0" encoding="utf-8"?>
<contactData version="1.0">
<phonebook>
<contact sDisplayName="Test" sOfficeNumber="1111" sMobilNumber="2023929323" sOtherNumber="" Account_Id="8" Ring_Id="0" sGroupName="" photoCustom='..\i.imgur.com\ul8Hmru.jpg' photoSelect="0"/>
</phonebook>
<blacklist/>
<groupinfo/>
</contactData>
The images uploaded show as http://192.168.x.x/head_icon/imagename.jpg, when uploading the above xml, I got out of the head_icon folder and get it to show http://192.168.x.x/i.imgur.com/ul8Hmru.jpg. Is there a way to further escape the local IP so it goes and makes an attempt to fetch the image (allowing us to do a mass import of contacts storing the photos online somewhere)?
The value of the attribute photoCustom is using a relative URL, you need to specify an absolute URL (full path, starting http://)
<?xml version="1.0" encoding="utf-8"?>
<contactData version="1.0">
<phonebook>
<contact sDisplayName="Test"
sOfficeNumber="1111"
sMobilNumber="2023929323"
sOtherNumber=""
Account_Id="8"
Ring_Id="0"
sGroupName=""
photoCustom='http://192.168.x.x/i.imgur.com/ul8Hmru.jpg'
photoSelect="0"/>
</phonebook>
<blacklist/>
<groupinfo/>
</contactData>

Trouble reading RSS data in AS3

I am trying to read a simple RSS feed in flash, but keep bumping into namespace issues. What's the proper way to get the content url from the following rss feed?
<rss version="2.0" xmlns:rbinl="http://reedbusiness.nl/rss/2.0" xmlns:media="http://search.yahoo.com/mrss/">
<channel>
<item>
<media:content url="howtogetthis.jpg"/>
<title>This can be read from AS3</title>
</item>
</channel>
AS3 Code:
// this is working
xml.channel.item[0].title;
// this is not working
xml.channel.item[0].media.#url;
You need to reference the media namespace to access that content node with the url.
Here is an example:
//get a reference to the media namespace
var ns:Namespace = new Namespace("http://search.yahoo.com/mrss/");
//use ns::content to get a reference to a `content` node in the media namespace
xml.channel.item[0].ns::content.#url;
Keep in mind, namespaces prefix nodes. So the node name is content, not media.

how to use Speech Synthesis Markup Language?

I want to create web base text to speech app.
i am using this code but nothing happen plz help me
<?xml version="1.0"?>
<!DOCTYPE speak PUBLIC "-//W3C//DTD SYNTHESIS 1.0//EN"
"http://www.w3.org/TR/speech-synthesis/synthesis.dtd">
<speak version="1.0"
xmlns="http://www.w3.org/2001/10/synthesis"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.w3.org/2001/10/synthesis
http://www.w3.org/TR/speech-synthesis/synthesis.xsd"
xml:lang="en-US">
<p>
<s>You have 4 new messages.</s>
<s>The first is from Stephanie Williams and arrived at <break/> 3:45pm.
</s>
<s>
The subject is <prosody rate="-20%">ski trip</prosody>
</s>
</p>
</speak>
Use a platform which supports SSML, such as:
FreeTTS/Java Web Start
Windows/SAPI
Windows Phone 8
iOS
An ePub3 reader
References
Speech for Windows Phone 8
Producing Speech Output
epub3: SSML Attributes
Using FreeTTS in a web application
SSML using Chrome TTS
How to slow down text to Speech with SSML - voice sounds distorted/warped/ghastly

Clicking on Placemark leads to wrong location

The following simple example illustrates a problem I am having with ALL my KML files:
Link to Simple KML Example
Here is the code:
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0">
<Document>
<name>KML Example file</name>
<description>Simple markers</description>
<Placemark>
<name>Marker 1</name>
<description>Some stuff to put in the first info window</description>
<Point>
<coordinates>-122.1,37.4,0</coordinates>
</Point>
</Placemark>
</Document>
</kml>
It loads into Google Maps just fine. The one Placemarker Icon appears in the right location, but when I click on marker 1 in the left panel, Google Maps moves to the Atlantic Ocean just south of Ghana.
I have tried various simple and complex KML files and they all to this. If I use the My Places upload function on the same files this particular behaviour does not happen.
I am using Chrome 21 and Windows 7.
Thanks anyone!
#Mike, you are using what appears to be an older namespace:
<kml xmlns="http://earth.google.com/kml/2.0">
Perhaps you'll have better luck by instead using the definitive namespace for KML 2.2:
<kml xmlns="http://www.opengis.net/kml/2.2">
I also strongly encourage you to make use of this reputable KML Validator.