I am converting a traditional website to WordPress for an animal rescue charity so members can have a blog and more easily update various pages. All has gone well but I am stuck on one key aspect. Viewers of the original site can click on a page that will then display pictures and names of all dogs of a certain size awaiting adoption. The dogs' names and the location of their photos are stored in a database and the photos in a folder. The images are clickable so that the user can pick a dog and see more about it on another page. The original site all works just fine - see link FAMA then please select Small Dogs (for example).
The page view output looks like this - repeated for each dog of course:
div class="dog_box" >
<a href="http://www.famaspain.com/dogfactstemplate.php?name=Bobby"> <p class="name">Bobby</p>
<p class="dog_img"> <img src="smalldogsphotos/bobby1.jpg" height="180" width="180">
</p></a></div>
and the code used to pull the data from the database is:
<div id="animalphotos">
<?php
$db_host = '*********';
$db_user = '*********';
$db_pwd = '*********';
$database = '***********';
$table = "**********";
if (!mysql_connect($db_host, $db_user, $db_pwd))
die("Can't connect to database");
if (!mysql_select_db($database))
die("Can't select database");
// sending query
$results = mysql_query("SELECT * FROM $table WHERE type= 'dog' AND category = 'adopt' AND placement='Unplaced' AND size = 'small' ORDER BY name");
if (!$results) {
die("Query to show fields from table failed");
}
while($results_array = mysql_fetch_array($results))
{
$id = $results_array["id"];
$image = $results_array["photo1"];
$name = $results_array["name"];
echo "<div class=\"dog_box\" >\r";
echo "\n";
echo "<a href=\"http://www.famaspain.com/<strong>dogfactstemplate.php</strong>?name=$name\"> <p class=\"name\">".$name."</p>\t\r";
echo "\n";
echo "<p class=\"dog_img\"> ". $image ." </p></a>\t\r";
echo "\n\t";
echo "</div>";
}
echo "<div class=\"clear\"></div>";
?>
</div> <!-- End Animal Photos -->
The various classes just specify margins and spacing for a neat two column layout.
OK - so what's the problem? Well, if I cut and paste the very same code into a WP page and run it I get each dog's name and image displayed as per the original site - but they are not clickable and the class names are not used to get the right spacing and margins. (Although WP is opening the correct style sheet for these class statements.)
The page view results also show missing info - the a href and the classes. Here is one example from the page source- repeated for each dog:
Bobby
<img src="smalldogsphotos/bobby1.jpg" height="180" width="180">
The WP version link is: FAMA WP version. Again, please view page and select Small Dogs to see the non-clickable images and poorly aligned display.
Since the php, msql, array etc all run OK and every image is displayed I am at a loss to see what is causing the a href and classes not to be picked up.
Can anyone help please - it's driving me nuts!