USING CMSB TO POPULATE A CSS STYLESHEET - Feb 9th, 2011


It’s easy to populate a CSS stylesheet. from fields in a CMSB editor.

Here’s how:

In this example we'll modify the following CSS stylesheet to pull data from text fields called "heading_size", and
"heading_color", and an image upload field with one uploaded image called "page_background_image", in a single record
CMSB editor called "common_information".

You can apply this technique to any CSS element.



#header {background-image:url(../images/your_image.jpg)};
}

h1{
color: #c0c0c0;
font-size = 2em;
text-align: center;
}
__



If you've ever modified a site to treat html pages as PHP, using an .htaccess file, you might think that inserting:


Addhandler application/x-httpd-php.css


in the .htaccess file would be an adequate approach to recognizing .css files as PHP, but in many situations, this can
lead to unexpected errors in how your pages are rendered.

So, to be safe, I'd use this approach.

First, add a .php the extension of your .css file (.css.php)

Then, in the head of your viewer page you’ll need to change:



<link rel="stylesheet" type="text/css" href="your_css_folder/your_css_file.css" />


to:



<link rel="stylesheet" type="text/css" href="your_css_folder/your_css_file.php" />




Now add the following PHP call before any CSS code to insure that your .css.php document is rendered correctly.



<?php

header("Content-type: text/css");
?>


After you’ve created the necessary fields in your editor and entered some sample values, go to the code generator for
your editor and copy the PHP require once and get records call to the head of your css.php file.

NOTE: DO NOT INCLUDE THIS LINE OF CODE:



<?php header('Content-type: text/html; charset=utf-8'); ?>




<?php

require_once "path_to_your/cmsAdmin/lib/viewer_functions.php";

list(
$common_informationRecords, $common_informationMetaData) = getRecords(array(
'tableName' => 'common_information',
'where' => whereRecordNumberInUrl(1),
'limit' => '1',
));
$common_informationRecord = @$common_informationRecords[0]; // get first record

// show error message if no matching record is found
if (!$common_informationRecord) {
print
"Record not found!";
exit;
}

?>
<?php
header("Content-type: text/css");
?>

#header {background-image:url(<?php foreach ($common_informationRecord['page_background_image'] as $upload): ?>
http://www.your_site.com/<?php echo $upload['thumbUrlPath'] ?><?php endforeach ?>)};
}

h1{
color: #<?php echo $common_informationRecord['heading_color'] ?>;
font-size = <?php echo $common_informationRecord['heading_size'] ?>;
text-align: center;
}



That’s it, you can replace any css element with a php call and give your clients added flexibility without them
needing to re-code your CSS stylesheet.



The materials on this web site have been created for use with CMS Builder content management software. CMS Builder software is published and licensed for use by InteractiveTools.com. Please contact Interactive Tools for information on the downloading of the software or the purchasing of licenses.


Terms of Service