|
Creating HTML Templates
|
Previous Top Next |
HTML template structure.
This section is for those of you who wish to create your own templates.
The method Media Companion uses is very simple and anyone with an understanding of HTML
should have no problem creating their own.
The first line of the template must be a unique title that will be listed within the Media Companion
template menu item, followed by the <<MC HTML Page>> tag.
eg.
<title>With Outline</title>
<<MC HTML Page>>
When selected, Media Companion will first parse the header, replacing any tags with appropriate
data.
eg.
<<header>>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<h1 align="center"><font size="6"><b>XBMC Media Companion</b></font></h1>
<h2 align="center"><font size="5"><b>HTML Output</b></font></h2>
<h3 align="center"><<moviecount>> movies</h3>
<p align="center"> </p>
<</header>>
As you can see, the header is enclosed within the <<header>> <</header>> tags. Media
Companion will swap out the tags for appropriate data. In the above case, the header will include
the movie count.
The next step is the body. Media Companion will loop through each movie and create the html
body.
eg.
<<body>>
<p align="center"><b><a href="<<imdb_url>>"><<movietitleandyear>></a></b></p>
<p align="center"><<outline>></p><hr/>
<</body>>
This is a simple template, and simply creates a list of each movie title and year, followed by the movie
outline. The movie title is also a link to the IMDB webpage for that movie.
So once completed, the full template will look something like this.
<title>With Outline</title>
<<MC HTML Page>>
<<header>>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<h1 align="center"><font size="6"><b>XBMC Media Companion</b></font></h1>
<h2 align="center"><font size="5"><b>HTML Output</b></font></h2>
<h3 align="center"><<moviecount>> movies</h3>
<p align="center"> </p>
<</header>>
<<body>>
<p align="center"><b><a href="<<imdb_url>>"><<movietitleandyear>></a></b></p>
<p align="center"><<outline>></p><hr/>
<</body>>
<<footer>><</footer>>
<</MC HTML Page>>
The template should be saved as a text file, and dropped into the 'html_templates' folder located
in the Media Companion folder. New templates will need Media Companion to be restarted before
they are added to the menu.
Tags available for use in the template:
From Internal Cache, HTML created very quickly
<<moviecount>>
<<title>>
<<movietitleandyear>>
<<runtime>>
<<rating>>
<<outline>>
<<imdb_url>>
<<fullpathandfilename>>
<<movieyear>>
From nfos, must be loaded first, takes longer.
<<fullplot>>
<<director>>
<<writer>>
<<moviegenre>>
Posters
<<smallimage>> - copied from the postercache (150x200 res) to html source\images folder. The images
will be created if it does not exist in the cache.
CSS
Cascading Style Sheets are also supported by the Media Companion template system. Simply add the style
sheet beneath the HTML template you have created. Enclose the Style Sheet between
<<css>>
<</css>> tags.
eg.
<<css>>
<filename>moviecard.css</filename>
@charset "utf-8";
.smallfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
.bigfont {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.headingfont {
font-size: 26px;
}
<</css>>