Dissecting front page, part 1

The new front page has several nifty features that are results of hours and hours of PHP coding to extract information with added value from the WordPress database and other sources within Nomadig.com.

I’ll explain the major pieces of the page and try to give a picture how the page has been put together from various pieces. As the space is limited (and maybe also your interests :), I usually skip most of the implementation details. If you are a compenent PHP programmer, you can fill in the blanks. And if you aren’t, then you shouldn’t try to do this at home.

The top left corner of the page contains information from the journal only. The next picture contains the most important dynamic elements of this part of the page.

The background image (1) is based on the current season. There are four images and four corresponding CSS classes that use images as backgrounds. PHP code calculates the season from the current month and selects the correct class.

The issue number (2) is the total number of published entries in WordPress database, read with a simple count() SQL clause. The date (3) is the publishing date of the latest entry, also read from the database.

The main article shows the latest published entry with its date (4) formatted with additional field for the day of the week. The entry may belong to several categories (5) that are all shown and linked to the journal.

The end of the latest article has a link (6) for reading the rest of the article. The front page shows the three first paragraphs of the entry.

After the first article, there is a Google ad (7) to gain some income to support the site. If Google does not serve any ads, Nomadig.com ad system is used instead to show some banner here (not that many of them currently).

In the next part we’ll discuss about the middle section of the front page: the latest articles, staff picks and gallery.