Page 1 of 2
From MySQL to cascading style sheet
Posted: Sun Jan 07, 2007 7:46 pm
by chrisbu
feyd | Please use Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Hi as a newbie php user and an hardened hardware engineer I am desperate to understand the following problem.
I have many pages with the same basic format, but different content, on a website. Each text <DIV> is generally a different size and so I put [i]height:[/i] and [i]position:[/i] information in the database containing the page content. All works fine EXCEPT for putting dynamic content in the CSS lines of the generated HTML page. For example I use a [i][b]<DIV id="page_container">[/b][/i] for aesthetic and fixed layout reasons.
Code: Select all
echo "#page_container {height: 570px;};";
gives a page source code with
Code: Select all
echo "#page_container {height: 570px;};
But
Code: Select all
echo "#page_container {height:";
echo $row[page_height];
echo "px;};";
or
Code: Select all
echo $row['page_height'];
echo "px;};";
or
Code: Select all
echo $row["page_height"];
echo "px;};";
and even
Code: Select all
echo "#page_container {height:".$row[page_height]."px;};";
(All variants of page_height delimiting)
gives me a source code with:
Putting
in any <DIV> in the <BODY> of the page gives me the value or string from the Database, so it is not an SQL usage problem.
I have used INT and TEXT types in my MySQL Database both give me the same result, so now I think the only option I haven't yet tried is to put
in the database as a string, but with about 50 different pages it is very wasteful of storage space.
I actually need to put several variables in several <STYLE> lines - so the wastage of storage space would be considerable.
Regards Chris
feyd | Please use Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Posted: Sun Jan 07, 2007 7:55 pm
by jayshields
Weird. Have you tried:
Code: Select all
echo '#page_container {height:' . $row['page_height'] . 'px;};';
Posted: Sun Jan 07, 2007 7:59 pm
by volka
please try
Code: Select all
error_reporting(E_ALL); ini_set('display_errors', true);
echo "/* \n";
$test = $row['page_height'];
echo 'type: ', gettype($test), "\n";
echo 'export: ', var_export($row, true), "\n";
echo "*/ \n";
echo '#page_container {height: '. $row['page_height']. 'px;}';
and post what it prints.
Posted: Sun Jan 07, 2007 9:22 pm
by chrisbu
feyd | Please use Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Firstly my sincere apologies to other users because of my incorrect usage of
Code: Select all
and thanks for the edit.
Jay - I tried your suggestion, but still the same result as without the whitespace ... null for the number of pixels.
Volka - thank you. I ran your code and got this result
[syntax="css"]/* type: string export: array ( 0 => '20', 'ID' => '20', 1 => 'rail', 'old_page_name' => 'rail', 2 => 'Railways', 'title' => 'Railways', 3 => '', 'meta_tags' => '', 4 => 'Dispayed text 1', 'first_para' => 'Dispayed text 1', 5 => 'Dispayed text 2', 'following_para' => 'Dispayed text 2', 6 => 'Dispayed text 3', 'intro2' => 'Dispayed text 3', 7 => '1', 'image1' => '1', 8 => '2', 'image2' => '2', 9 => '3', 'image3' => '3', 10 => '4', 'image4' => '4', 11 => '5', 'image5' => '5', 12 => '', 'image6' => '', 13 => '', 'image7' => '', 14 => '570', 'page_h' => '570', 15 => '250', 'intro_loc' => '250', 16 => '135', 'intro_h' => '135', 17 => '384', 'intro2_loc' => '384', 18 => '167', 'intro2_h' => '167', ) */ #page_container {height: 570px;}
So it seems to read and write OK with your code only. However if I put the last line of your code into my page template I get
#page_container {height: px;} displayed when I view the HTML source.
Hardware troubleshooting is so much easier ... I can use a hammer not a brain. :javascript:emoticon(':D')
Very Happy
Perhaps I should use the hammer on MY brain and knock some sense into myself!
Regards Chris
feyd | Please use[/syntax]Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Posted: Sun Jan 07, 2007 9:30 pm
by volka
chrisbu wrote:So it seems to read and write OK with your code only. However if I put the last line of your code into my page template I get #page_container {height: px;} displayed when I view the HTML source.
Don't put the last line in there, put the whole snippet in.
Posted: Sun Jan 07, 2007 10:13 pm
by chrisbu
feyd | Please use Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Thanks Volka
I put the whole code snippet in - and got this as my HTML source
Some errors (highlighted in blue) are due to no image being available and not in the dB - the dB contains "NULL"
[syntax="html"]<head>
<title></title>
<link rel=STYLESHEET href=isaans.css type=text/css>
<link rel=STYLESHEET href=tour.css type=text/css>
<style>/*
<br />
<b>Notice</b>: Undefined variable: row in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>17</b><br />
type: NULL
export: <br />
<b>Notice</b>: Undefined variable: row in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>19</b><br />
NULL
*/
<br />
<b>Notice</b>: Undefined variable: row in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>21</b><br />
#page_container {height: px;}#intro {top:250px; border:0px dotted #0000ff;height:135px;}#intro2 {top:414px; border:0px dotted #0000ff;height:167px;}</style>
</head>
<body bgcolor=#ffffff ><div id=page_container><br />
<b>Notice</b>: Use of undefined constant image1 - assumed 'image1' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>33</b><br />
<br />
<b>Notice</b>: Use of undefined constant image2 - assumed 'image2' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>38</b><br />
<br />
<b>Notice</b>: Use of undefined constant image3 - assumed 'image3' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>44</b><br />
<br />
<b>Notice</b>: Use of undefined constant image4 - assumed 'image4' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>50</b><br />
<br />
<b>Notice</b>: Use of undefined constant image5 - assumed 'image5' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>56</b><br />
<br />
<b>Notice</b>: Use of undefined constant image6 - assumed 'image6' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>62</b><br />
<br />
<b>Notice</b>: Use of undefined constant image7 - assumed 'image7' in <b>E:\htdocs\isaans_new\php development\development_page_1.php</b> on line <b>67</b><br />
<div id=title>Railways</div><div id=intro>Dispayed text 1</div><DIV ID=intro2>Dispayed text 3</div>
</div>
</body>
</html>
The first part of the code that is in use at the moment is this[/syntax]
Code: Select all
<?php
include 'opendb.php';
$query="SELECT * FROM touring";
$result = mysql_query("SELECT * FROM touring
WHERE ID='20'") or die(mysql_error());
mysql_close();
/* Build the page */
echo "<head>
<title></title>
<link rel=STYLESHEET href=isaans.css type=text/css>
<link rel=STYLESHEET href=tour.css type=text/css>
<style>";
error_reporting(E_ALL); ini_set('display_errors', true);
echo "/* \n";
$test = $row['page_h'];
echo 'type: ', gettype($test), "\n";
echo 'export: ', var_export($row, true), "\n";
echo "*/ \n";
echo '#page_container {height: '. $row['page_h']. 'px;}';
echo "#intro {top:250px; border:0px dotted #0000ff;height:135px;}";
echo "#intro2 {top:414px; border:0px dotted #0000ff;height:167px;}";
echo "</style>
</head>
<body bgcolor=#ffffff >";
echo "<div id=page_container>";
$row = mysql_fetch_array( $result );
// Print out the contents of each row into a table
if ( $row[image1] != "" ) {
echo "<DIV ID=pic01><img src=\"images/";
echo $row[image1];
echo "\" height=160 width=240 ></div>";
}
I don't have the page or dB on the webserver yet but I could uploda if needed, currently it is only on my local Apache/php/MySQL server.
- Apache/2.2.3
MySQL/5.0.27
PHP Version 5.2.0
Regards Chris
feyd | Please use Code: Select all
and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]
Posted: Sun Jan 07, 2007 10:39 pm
by volka
Code: Select all
$result = mysql_query()
...
echo $row
...
$row = mysql_fetch_array()
wrong order.
Posted: Mon Jan 08, 2007 12:21 am
by Kieran Huggins
Chris: html and css have been designed specifically to handle variable content properly, I can't understand why you want to store all these values in the db... Can you point us to an example page? It's more than likely you're making this far more complicated than it needs to be.
Posted: Mon Jan 08, 2007 1:16 am
by matthijs
Indeed, it seems to be very complicated doing it like this.
chrisbu wrote:I have many pages with the same basic format, but different content, on a website.
It seems like you want to differentiate the style or layout of the different pages? If that is the case, a much simpler solution is to set only one dynamic variable to the body tag for example. And then let css figure out what style to use.
So:
Code: Select all
<html>
<body class="home">
<div id="content">
..
or
<body class="page">
<div id="content">
..
Code: Select all
.home #content { width:80%; }
.page #content { width:50%; }
Code: Select all
<?php
if ( is_home() ) { echo '<body class="home">'; }
else { echo '<body class="page">'; }
?>
// or something like
<body <?php echo $class; ?> >
<div>
In which is_home is just a function to determine if the current page is the home page.
Posted: Mon Jan 08, 2007 2:58 am
by chrisbu
Of course I can.
This is the old site I am currently updating, the layout of these three pages starts the same with 5 pictures and text between the two outer ones. Please forgive the black background, happily that changes in the updated version.
On this page only 5 pictures
http://www.isaans.net/khosum.php
The next page has two added pictures and so after those I need to put the <DIV> for the full width paragraph lower than the 5 picture page.
http://www.isaans.net/mukdahan.php
And finally this one has 5 pictures for the introduction but much more content than the monkey page
http://www.isaans.net/khonkaen.php
The narrow text section has variable height depending on content so I need to change the height of the <DIV> and also the location for the next <DIV> dynamically otherwise there can be a big ugly gap or the text can overwrite the previous text.
For ease of composing pages (currently 32 - but many to be added) I want to use a page template and drag the content from a MySQL database. (using FORM data (or whatever! client-side) giving a variable that is sent to the PHP server to select the appropriate record. (in the example code I posted I selected record 20 in this way
WHERE ID='20' but the "20" will be the variable sent from the form).
I use the style sheet
tour.css for the basics of the sections, only varying the height and location in the database.
Regards Chris
Posted: Mon Jan 08, 2007 4:52 am
by chrisbu
To everyone - genuine heartfelt thanks for your help
As a newbie here it was so nice to get all the help. I have encountered (as a reader only) some very aggressive forums (forii???) where stupidity such as mine has led to a three week "flaming" session. Looks to me as though the PHP community is just as good as the PHP product.
To Volka OOOOOOOOOOOOOOOPS! ........... Sorry!
I got the basic content going correctly, then put the CSS stuff in the logical (for HTML anyway) position afterwards.
See that's what happens when you let hardware guys loose on software!
Again many many thanks to all of you especially Volka - for his patience and for the right answer.
One day I may get good enough to help someone else with a PHP problem ... but i doubt it. Hahaha
Best regards for 2007 from me to all of you, Chris
Posted: Mon Jan 08, 2007 5:04 am
by matthijs
Glad you found the solution.
More in general: I think it's important to separate the different responsibilities well. So your PHP/mysql shouldn't have to do anything with the way it's seen on the front side. Also, the HTML en CSS should be separated as well. Kind of loose coupling.
If you succeed to do that, you'll make your life a lot easier.
When I read this:
The narrow text section has variable height depending on content so I need to change the height of the <DIV> and also the location for the next <DIV> dynamically otherwise there can be a big ugly gap or the text can overwrite the previous text.
For ease of composing pages (currently 32 - but many to be added) I want to use a page template and drag the content from a MySQL database. (using FORM data (or whatever! client-side) giving a variable that is sent to the PHP server to select the appropriate record. (in the example code I posted I selected record 20 in this way WHERE ID='20' but the "20" will be the variable sent from the form).
I use the style sheet tour.css for the basics of the sections, only varying the height and location in the database.
It's seems to me there's a much too tight coupling between the different layers.
But if you managed to find a solution, then fine. This is just a general remark.
Posted: Mon Jan 08, 2007 6:55 am
by chrisbu
Hello Matthijs
I'm not sure of how to separate the various components.
I thought that PHP was to make my life simple (if I put things in the right order in the page)
I had looked at putting <?php $this ?>and <?php $that ?> all the way through an HTML document, but it seemed so much simpler to use PHP to echo the HTML.
I have relied heavily on .CSS for formatting on several sites, so it seemed to me to be an integral part of the "scheme". They work reasonably well except for variations between browsers - quirky or not - but that can generally be overcome with the usual margin setting games.
To dynamically modify my style sheet(s) seemed an easy way of avoiding masses of coding (and masses of errors too) on the repetitive stuff. The lazy brain of a non-software guy!
Again to store my content in a dB seemed a natural way to go. My webhost gives me unlimited Databases
Perhaps my inexperience led me along the simple but totally wrong path. Maybe I should sit back and learn to integrate PHP into an HTML page rather than using it to define the page with a shedload of "echo"'s. That way at least content is separated from appearance.
Although not sure of how to separate the bits at least I have some food for deep, deep thought - and the need of a 500 page printout of the PHP manual. Hahaha poor old Epson (I don't have a laserjet here - it's in UK).
So no sleep tonight .... brain will be in top gear
Regards Chris
Posted: Mon Jan 08, 2007 8:14 am
by Kieran Huggins
Chris: I think you're becoming an excellent example of being "a slave to your layout".
While it looks nice, I would suggest maybe taking another stab at the layout now that you have a better understanding of html and css. I can't help but feel you're painting yourself into a corner, and it only gets more difficult as time goes on!
I only speak from experience when I tell you that designing for maintainability will save your sanity... and your hair!
Posted: Mon Jan 08, 2007 8:41 am
by chrisbu
Hi Kieran
Well if my wife's and daughter's comments are anything to go by I don't have any hair! I had a haircut on Friday before a special dinner and my daughter said "Mum Why does dad have his haircut when he doesn't have any?"
I did sit back before making a fool of myself and think that I must throw away all the restrictive tables on the site and make it prettier to work with.
I looked at CMS progs and rejected those as being even less flexible than tables - I still like CSS because it is relatively predictable. (I'm one of those heathens who doesn't like his page to spreeeeeeeeeeeeeeead to match the screen size ... although I am old with no hair I use Firefox and <CTRL><+> <CTRL><+> a few times so that I can read my own page.
So I guess a few days of poring through a Gig or two of photos and planning the pages at least might help, then I decide whether I am stupid and even more hairless, or boring and move back to tables. I must admit that tables automatically expand vertically to the height of the content - <DIV>'s don't.
Tomorrow I think I'll set up a wireless LAN - my switch is out of ports now and I don't have the LAN in the bedroom. Yes I'll do something I understand better than PHP, then with a clear mind I can decide how to go on the site. Incidentally this is a page from the "new look" site
http://new.isaans.net/agriculture.php
The picture pages will have the same "look and feel".
Thank you for your advice. It has been absorbed and MAY influence my thoughts over the next few days.
Again thank you very much to all who contributed to this thread.
Regards Chris