7 Mart 2012 Çarşamba

Simple Website With XML v3.5

PURPOSE

This study has emerged to update HTML-based websites easily. At first two versions, XML and XSL were used completely in the entire website. In this version, a single XML file has been considered as a simple database ( for frequently used applications such as announcements, news and photo albums in websites). On website, this XML file is used by parsing with Jquery.  The study is also an example for AJAX usage.

FEATURES
  • Common data entry for news, announcements and photo albums
  • ... [more] feauture
  • Creating automatic photo links
  • Fancybox effects
  • more content >> feature
  • Grouping by years in news archive and photo albums
  • Simple Facebook 'loading' animation
  • Simple design

DISADVANTAGES
  • Indexing problem because of the dynamic content (Google ...)
  • HTML Coding
  • Simple level of XML

STRUCTURE

This study contains two base files: items.xml, items.js

  • items.xml: It saves news, announcements and photo albums datas.
  • items.js: It parses the items.xml and returns HTML content to main page.
USAGE

Usage form for an item (a news, an announcement or a photo album) in items.xml and all parameters are as shown below:

[sourcecode language="xml"]
<item id="" type="news|album|anno" subject="" date="dd.mm.yyyy" mainphoto="" mpwidth="" mpheight="" photocount="" active="1|0" main="1|0" rel="news|album">
<![CDATA[
...HTML Code...
]]>
</item>
[/sourcecode]

PARAMETERS
  • @id : Item id. At the same time the name of the folder containing the photos (/images/items/@id)
  • @type : Item type. 'news' for news, 'album' for photo albums, 'anno' for announcements.
  • @subject : Subject
  • @date : Date. Format: dd.mm.yyyy
  • @mainphoto : Headline photo
  • @mpwidth : Headline photo width (Default 200px)
  • @mpheight : Headline photo height (Default 140px)
  • @photocount : The number of photos. To create links to them automatically. (Only .jpg)
  • @active : Set this to "1", if you wish to publish the item on website. Otherwise "0".
  • @main : To publish the item on the main page, set this option to "1".
  • @rel : Use this option to publish the item on news archive or photo albums at the same time. 'news' for news, 'album' for photo albums.
A sample news in items.xml is as follows:

[sourcecode language="xml"]
<item id="8" type="news" subject="Suspendisse Vel Ipsum" date="25.12.2011" mainphoto="3.jpg" photocount="4" active="1" main="1" rel="album">
<![CDATA[
<p>Fusce aliquam felis vel metus molestie fringilla.</p>
]]>
</item>
[/sourcecode]

There are 4 photos of the news and 4 links will be created for them:
  • /images/items/8/1.jpg
  • /images/items/8/2.jpg
  • /images/items/8/3.jpg
  • /images/items/8/4.jpg
'3. Jpg ' is headline photo. News will be displayed on the main page. Photo albums will also include this item.

HTML CODE

HTML code for the item must be located within the CDATA block. Example usage of CDATA block is just as the examples above. By using '[...]' within the text/HTML code, the '... [more]' feature can be given.

USAGE OF FANCYBOX
Fancybox effects are coded to work with '.jpg', '.gif' or '.png' extension pictures links. Please, check the items.xml file for sample usage and http://fancybox.net for more information.

SCREENSHOTS




FILES

Full Source Code: Simple_Website_With_XML_v3.5_EN

Special thanks to Tuncay ÇELİK for his contributions to the English translation :)

Hiç yorum yok:

Yorum Gönder