Beacon Pages – How To
Creating a beacon monitoring page on a website running WordPress.
Introduction
After a number of attempts to have my own website I found that writing the code was a long winded way around things and that content management systems (CMS) can offer a really useful alternative. This page is not an evaluation on the features and benefits of the usual suspects but more of a guide as to how I did it using wordpress.
What is wordpress?
I’ll start by saying there are two different types of wordpress install but they both work in the same way. One is through the wordpress.com site, where the site is hosted by wordpress themselves, it has limited features and is really just a blogging platform. Self hosted wordpress sites are ones where you buy your own domain name (g7kse.co.uk in my case) and get a copy to host it. They do the install for you through cPanel (Fantastico) and all you need do is sign up and press a few buttons to get wordpress installed.
So the crux is what is wordpress? I alluded to it by saying it is primarily a blogging platform; simplistically it has posts and pages. Posts are blog entries or bits of news and pages are the more static ‘traditional pages’.
Functionality and the look and feel of the site are handled by plugins and themes, all of which are easily installed through the web interface and can make your site look the way you want it to and also add in extra features like forums, search engine optimisation (SEO), Google analytics etc.
What’s need for the beacon monitoring station?
Here is the shopping list
An HF rig that can be CAT controlled
- CAT controller
- PC or netbook that meets the Faros standards
- Operating system: Windows ME, Windows 2000, or Windows XP;
- CPU speed: 1 GHz or higher is recommended;
- Ports: one COM port for radio control (optional);
- Connection to the Internet: direct (no proxies), 1 MBit/s or faster is recommended. Satellite connections cannot be used because of the propagation delay;
- A Copy of Faros software (http://www.dxatlas.com/Faros/)
- An ftp uploading application. I use AutoFTP by Glenn Delahoy (http://www.glenn.delahoy.com/software/index.shtml)
- Audio cable from the rig to the PC
- A self hosted wordpress site i.e. not one through WordPress.com
- An ftp account with your host. Usually this is something that you set up, just like a mail account that will allow you to upload through something like ftp.yourdomain.com with a user account name and password that suits you. This will be for uploading the gif images
- A suitable page template for your beacon page an example is a bit further down this howto.
- A suitable clock synchronising application like dimension4 (http://www.thinkman.com/dimension4/)
Installing the software on your pc
Simple as anything, download from the two sites and install as per the wizard. I’ll assume you use the default installation for Faros. AutoFTP doesn’t actually install as its just a stand alone .exe file.
Dimension4
This makes sure your PC’s internal clock is at the right time, it’ll go out and get the right time and adjust it for you. Once installed and running it’ll do it all for you.
Faros
Connect up the radio and cat interface and audio cable. Follow the instructions on the site to connect Faros to the rig using the settings panel. Whilst you are there be sure to check the tick box that saves the gif images and set the time you’d like it to save for you. Remember that the Auto FTP program will be used to upload the images and it will do it as often as you set this time delay.
Once all up and running the rig should be listening for the beacons
AutoFTP
Using the account details you set up before
Then change where the local path is for the gif’s, normally under program files. And the place you’d like it to go on your wordpress install. Mine is set to /wp-content/data/ where data is a folder I created to put all the images into.
You may want to alter the settings but I have mine set to detect changes and make the remote the same as the local folder. That way everything is synchronised.
That should be it for the software. It is a bit brief but you can always ask me a question. I’ll be happy to help where I can.
WordPress pages template
This was the bit I struggled with and now I have a set up that works reasonably well although there will always be changes that you can make to your site to optimise the way it looks. I have chosen a template that is wide enough to display the gif in full but you can use vatiable width templates that will expand to fit the content or can be set by the settings in wordpress.
Each of the pages have a template, this can be chosen when the page is written or edited. This is where we’ll put the bit of code that goes and finds the latest images. So open up notepad or your favourite text editor and prepare to do some customising.
This code will be a new page template called ‘Beacons’ and should appear in the drop down box for page templates once we’ve created the page and uploaded it back into the theme folder.
Below is the code I use. I did not write it but modified it to suit my installation. If you scroll through it you can see where the lines are that are the source of the information e.g \”><img src=\”http://g7kse.co.uk/wp-content/data/scale.gif\” width=\”519\” alt=\”Scale\”><br> for part of the image that displays the output from Faros. You’ll also notice that the code displays the information for today, yesterday and the day before.
?php
/*
Template Name: Beacons
*/
?><?php get_header();?>
<div>
<!-- primary content start -->
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div>
<div>
<div><em><?php the_author() ?></em>
<br/><em><?php the_time('M jS, Y') ?></em></div>
<h3><a href="<?php the_permalink() ?>" rel="bookmark" title="
Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
</div>
<div>
<?php the_content(); ?>
<?php wp_link_pages(); ?>
<?php $sub_pages = wp_list_pages( 'sort_column=menu_order&depth=1&title_li=&echo=0&child_of=' .
$id );?>
<?php if ($sub_pages <> "" ){?>
<h3>Sub Pages List</h3>
<ul>
<?php echo $sub_pages; ?>
</ul>
<?php }?>
</div>
<?php endwhile; ?>
<p align="center"><?php posts_nav_link(' - ','« Prev','Next »') ?></p>
<?php else : ?>
<h2>Not Found</h2>
<p>Sorry, but you are looking for something that isn't here.</p>
<?php endif; ?>
<script>
var d = new Date();
var m = d.getUTCMonth()+1;
var day = d.getUTCDate();
var yr = d.getUTCFullYear();
var sname = yr+"-"+(m < 10 ? "0" + m : m)+"/S-"+yr+"-"+(m < 10 ? "0" + m : m)+"-"+(day < 10 ? "0" + day : day)+".gif";
var pname = yr+"-"+(m < 10 ? "0" + m : m)+"/P-"+yr+"-"+(m < 10 ? "0" + m : m)+"-"+(day < 10 ? "0" + day : day)+".gif";
document.write("Signal to noise ratio - Today");
document.write("<table><tr><td width=\"800\"><p align=\"center\"><img src=\"http://g7kse.co.uk/wp-content/data/scale.gif\" width=\"519\" alt=\"Scale\"><br><img src=\"http://g7kse.co.uk/wp-content/data/"+sname+"\" width=\"519\" height=\"1038\" title=\"SNR Today\"><br>SNR</td>");
document.write("</tr></table><br><hr><br>");
var y = new Date(); y.setDate(y.getDate()-1);
var my = y.getUTCMonth()+1;
var dy = y.getUTCDate();
var yy = y.getUTCFullYear();
sname = yy+"-"+(my < 10 ? "0" + my : my)+"/S-"+yy+"-"+(my < 10 ? "0" + my : my)+"-"+(dy < 10 ? "0" + dy : dy)+".gif";
pname = yy+"-"+(my < 10 ? "0" + my : my)+"/P-"+yy+"-"+(my < 10 ? "0" + my : my)+"-"+(dy < 10 ? "0" + dy : dy)+".gif";
document.write("Signal to noise ratio - Yesterday");
document.write("<table><tr><td width=\"800\"><p align=\"center\"><img src=\"http://g7kse.co.uk/wp-content/data/scale.gif\" width=\"519\" alt=\"Scale\"><br><img src=\"http://g7kse.co.uk/wp-content/data/"+sname+"\" width=\"519\" height=\"1038\" title=\"SNR Today\"><br>SNR</td>");
document.write("</tr></table><br><hr><br>");
var f = new Date(); f.setDate(f.getDate()-2);
var my = f.getUTCMonth()+1;
var dy = f.getUTCDate();
var yy = f.getUTCFullYear();
sname = yy+"-"+(my < 10 ? "0" + my : my)+"/S-"+yy+"-"+(my < 10 ? "0" + my : my)+"-"+(dy < 10 ? "0" + dy : dy)+".gif";
pname = yy+"-"+(my < 10 ? "0" + my : my)+"/P-"+yy+"-"+(my < 10 ? "0" + my : my)+"-"+(dy < 10 ? "0" + dy : dy)+".gif";
document.write("Signal to noise ratio "+dy+"-"+(my < 10 ? "0" + my : my)+"-"+yy+"<br>");
document.write("<table><tr><td width=\"800\"><p align=\"center\"><img src=\"http://g7kse.co.uk/wp-content/data/scale.gif\" width=\"519\" alt=\"Scale\"><br><img src=\"http://g7kse.co.uk/wp-content/data/"+sname+"\" width=\"519\" height=\"1038\" title=\"SNR Today\"><br>SNR</td>");
document.write("</tr></table><br><hr><br>");
</script>
<!-- primary content end -->
This needs to be uploaded to your theme folder on the wordpress installation (normally /wp-content/themes/theme name). It can then be selected from inside wordpress. There is a load of information on the wordpress codex (http://codex.wordpress.org/Main_Page) about handling pages and other parts to WordPress that I’m not going to attempt to repeat here.
So that should be it. You’ve set up the rig and computer at home so Faros should be doing its bit. The AutoFTP program should be detecting when Faros saves an image to the C drive and sending it to your host and wordpress should be picking up the images and displaying them on your web site….Questions? drop me a comment on the page and I’ll try and help out.
This worked for me…eventually and so it should work for you although sometimes things need tweaking. I’ll be glad to help where I can. 73, g7kse
