help i broke my page :/  problem

[Funkster]

Hi there i just broke a page on my website can anyone help, i was messing about trying to add text after OUR DESIGNERS but now it is showing  top left of page and the spacing is all wrong on the published page, i medited in notepad :/ here is a link to the page now.

http://www.thebrightoncollective.co.uk/showcase_designer/

Hope you can help me !!


<?php
$path = "http://".$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];

$adjacents = 1;

$query =mysql_query("select * from user WHERE img <> '' and seller = '1' order by register_date desc limit 0,100");

// mysql_query $query = mysql_query("select um.fname ,um.sname,pm.* FROM user as um,product as pm WHERE um.counter=pm.manu_id and pm.img <> '' and pm.live = 1 and pm.cat_plus like '%".$catdata['counter']."%' ".$search." order by pm.create_date desc");

$i=0;

$prodArr1=array();

if($query&&mysql_num_rows($query)>0)
{
while($prodArr1[$i]=mysql_fetch_array($query))
{
$i++;
}
}
//echo '<pre>'; print_r($prodArr1); exit;
//echo count($prodArr1);// exit;
$total_pages =mysql_num_rows($query);
/* Setup vars for query. */
$limit = 18; //how many items to show per page
$page = $_GET['page'];
if($page)
$start = ($page - 1) * $limit; //first item to display on this page
else
$start = 0;
////////////////////////


$catsel=0;

//echo $products;exit;
//////////////////paging seetting/////////////////

/* Setup page vars for display. */
if ($page == 0) $page = 1; //if no page var is given, default to 1.
$prev = $page - 1; //previous page is page - 1
$next = $page + 1; //next page is page + 1
$lastpage = ceil($total_pages/$limit); //lastpage is = total pages / items per page, rounded up.
$lpm1 = $lastpage - 1; //last page minus 1

/*
Now we apply our rules and draw the pagination object.
We're actually saving the code to a variable in case we want to draw it more than once.
*/

$pagination = "";
if($lastpage > 1)
{
$sort = str_replace(' ','-',$sort);

$pagination .= "<div class=\"pagination\">";
//previous button
if ($page > 1)
$pagination.= "<a href=?page=$prev>previous</a>";
else
$pagination.= "<span class=\"disabled\"> previous</span>";

//pages
if ($lastpage < 7 + ($adjacents * 2)) //not enough pages to bother breaking it up
{

for ($counter = 1; $counter <= $lastpage; $counter++)
{

if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else

$pagination.= "<a href=?sort=$sort&page=$counter>$counter</a>";
}
}
elseif($lastpage > 5 + ($adjacents * 2)) //enough pages to hide some
{
//close to beginning; only hide later pages
if($page < 1 + ($adjacents * 2))
{
for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=?sort=$sort&page=$counter>$counter</a>";
}
$pagination.= "...";
$pagination.= "<a href=?sort=$sort&page=$lpm1>$lpm1</a>";
$pagination.= "<a href=?sort=$sort&page=$lastpage\">$lastpage</a>";
}
//in middle; hide some front and some back
elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
{

$pagination.= "<a href=?sort=$sort&page=1>1</a>";
$pagination.= "<a href=?sort=$sort&page=2>2</a>";
$pagination.= "...";
for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=?sort=$sort&page=$counter>$counter</a>";
}
$pagination.= "...";
$pagination.= "<a href=?sort=$sort&page=$lpm1>$lpm1</a>";
$pagination.= "<a href=?sort=$sort&page=$lastpage>$lastpage</a>";
}
//close to end; only hide early pages
else
{
$pagination.= "<a href=?sort=$sort&page=1&>1</a>";
$pagination.= "<a href=?sort=$sort&page=2&>2</a>";
$pagination.= "...";
for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a href=?sort=$sort&page=$counter>$counter</a>";
}
}
}

//next button
if ($page < $counter - 1)
$pagination.= "<a href=?sort=$sort&page=$next>next</a>";
else
$pagination.= "<span class=\"disabled\">next</span>";
$pagination.= "</div>\n";
}
//////////////////END paging/////////////





?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />

<title>Handmade gifts, unique designs, original gifts, homemade crafts, hand made, designer crafts, handmade jewellery, vintage fashion, hand crafted gifts, designer paintings. Original artists design, unique gifts, gift ideas, fashion accessories, designer paintings, home made jewelery, handmade goods & creative collections from The Brighton Collective, Designed in England, British design, UK design, xmas gifts, christmas gifts. - <?php echo $cur_data['name']; ?></title>

<meta name="description" content="Handmade designer gifts, unique fashion designs, original handmade gifts, homemade arts & crafts, hand made designer crafts, unique handmade jewellery, vintage fashion accessories, hand made goods, designer paintings, handmade designer toys. Original artists designing unique gifts, creative designers, handmade jewellery, designer paintings, & hand made creations, creative collections from The Brighton Collective. Hand made art, handmade gifts, hand crafted jewellery, designer jewelry, fashion designs, unique designs, hand made necklaces, authentic jewellry, designer goods, original crafts, xmas gifts, gift ideas, designer fashion, handmade jewellery, hand crafted dolls, hand made toys, designer paintings, vintage jewellery, london fashion design, paris vintage fashion. Designed in England, British design, UK design, christmas ideas">


<meta content="index, follow" name="robots">
<meta content="� 2010 thebrightoncollective.co.uk - All Rights Reserved." name="copyright">
<meta content="General" name="rating">
<meta content="7 days" name="revisit">
<meta content="never" name="expires">


<link type="text/css" rel="stylesheet" href="/css/css1.css" />
<link type="text/css" rel="stylesheet" href="/css/menustyle.css" />
<script type="text/javascript" src="/js/chrome.js"></script>
<script type="text/javascript" >
function show_short()
{
var short_value = document.getElementById('short_by').value;

window.location='?sort='+short_value;

}
</script>
</head>

<body>
<div id="all">
<?php include($rootC.'toplinks.php'); ?>
<?//php include($rootC.'header.php'); ?>
<div id="mleft">

<div class="heading"><h1>OUR DESIGNERS<?=$designer_name['fname']?></h1></div>


<!-- <div class="short_by">Shot By<select name="short_by" id="short_by" onchange="show_short(this.value)"><option value="pm.create_date DESC" <? if($sort == "pm.create_date-DESC"){ echo "selected"; } ?>>Latest</option> <option value="pm.price ASC" <? if($sort == "pm.price-ASC"){ echo "selected"; } ?>>Price low to High</option><option value="pm.price DESC" <? if($sort == "pm.price-DESC"){ echo "selected"; } ?>>Price High to Low</option><option value="pm.name ASC"<? if($sort == "pm.name-ASC"){ echo "selected"; } ?>>Alphabetical</option></select> </div>-->
<div style="clear:both;"></div>



<?


if(isset($nothing))
{
echo '<p>There is nothing showcased here yet, but watch this space.</p>'."\n";
}

random_designer_showcase(2,6);
random_designer_showcase(2,6);
random_designer_showcase(2,6);
random_designer_showcase(2,6);

?>
</div>

<div class="pagination">
<!--<div class="total_prod"><?//=start?>/<?//=$total_pages?></div>-->
<div class="page_no">
<ul>

<!--<?=$pagination?>-->
</ul>
</div>
</div>
<div id="mright">
<?php
//include($rootC.'rightsidebar.php'); ?>
</div>
<div class="clearfloat">&nbsp;</div>
</div>
<div class="clearfloat">&nbsp;</div>
<?php include($rootC.'footer.php'); ?>
</body>
</html>

[jscheuer1]

That's the BOM (byte order mark) and it generally means the page was saved in UTF-8 encoding, but is being served in ANSI (aka windows-1252)*

Open the file in Notepad again. From the menu choose:

File > Save As...

In the box that pops up you will see a selection labeled:

Encoding:

It should show whatever encoding the file was last saved in, in this case probably UTF-8. But whatever it is, change it to ANSI unless it already is showing that. Click save and you should be home free.


* UTF-8 is generally to be preferred but then the page needs to be served as UTF-8. Also - even though some editors (like Notepad) still insert the BOM when saving to UTF-8, for best results it should be omitted. In any case it's not required for UTF-8 encoding.

[Funkster]

Brilliant thank you solved it !! i will now go and have a strong chat with myself about not taking a copy before editing!!!

[djr33]

Glad it's solved. As a general response, if you are ever dealing with any non-English characters (0-9A-Za-z, and standard punctuation) then you will need to worry about encoding. It may seem easy if nothing goes wrong, but if something does go wrong it can be immensely confusing. The way to solve this is the following: in every step (every step!) of the process, make sure you are using a consistent encoding. It can be any encoding you'd like, but UTF8 (also called Unicode) is the most compatible. Make sure that your text editor is saving UTF8 files; make sure the actual characters in the file are UTF8 (if you are pasting from random websites, be careful); make sure the page is being served as UTF8; make sure your databases are in UTF8; and make sure the HTML meta tag for encoding is for UTF8. Any one of those being wrong can cause problems.
Again, it's solved for the moment, but fully understanding the situation will be very helpful if it happens again.

[jscheuer1]

UTF-8 and Unicode are not synonymous in some editors. Notepad and EditPad (at least some editions). I doubt that they are in any editor. However, in cursory testing they appear to be interchangeable insofar as a simple document saved in either and served as UTF-8 appears to display properly in Firefox 4.

If examined as an ANSI encoded document, they appear quite different, with different BOM's and spacing. Unicode uses the BOM:

ÿþ

While UTF-8 uses:



Spacing between letters is 'normal' in UTF-8, whereas in Unicode everything looks like it has spaces added, like:


ÿþ< ! D O C T Y P E h t m l >

< h t m l >

< h e a d >

< t i t l e > < / t i t l e >

But they are really hex 00 characters (converted to spaces in the above for pasting purposes).

So it is possible that by using these two encodings interchangeably that one might run into problems.

So I would add to what you're saying that it's best to save everything in UTF-8 only, skip Unicode.

One other thing, use an editor that doesn't insert the BOM, or better yet, one that gives you the choice. Never know, it might be required in some cases. But it's best omitted for web pages.

[djr33]

UTF-8 is Unicode. At least it is a type of Unicode. Specifically, it is an 8-bit implementation of the Unicode system.
UTF-16 is also available in some cases, and there's no reason there can't be another type of Unicode.
However, sometimes UTF-8 is called Unicode (and not UTF-8).

To solve this:
1. Use UTF-8 if available.
2. If not, use Unicode, which is likely actually UTF-8 under another name.

UTF-8 is the most common implementation of unicode so most of the time when "unicode" is mentioned, it specifically means UTF-8. For example, google "unicode" and you will find mostly information about UTF-8.

Regardless, thanks for mentioning that because it is confusing. It's rarely a problem, but occassionally it can be. I agree with your post. And the naming conventions should be clearer.


John, are you saying that Notepad has a "unicode" option and another "UTF-8" option? That's strange. I don't remember that being the case (and I'm not on a PC at the moment).

[jscheuer1]

http://home.comcast.net/~jscheuer1/side/images/notepad.png

Looks like it does. I'm pretty sure that's UTF-16.