php/css

25.02.10

Ο php είναι ένας προεπεξεργαστής. Προετοιμάζει τις σελίδες, δημιουργεί δυναμικά τo περιεχόμενό τους από τη μεριά του διακομιστή, και τις σερβίρει έτοιμες στον φυλλομετρητή του χρήστη. Συνήθως η php προετοιμάζει html. Όταν ο χρήστης ζητήσει ένα αρχείο php, προλαβαίνει ο προεπεξεργαστής, το εκτελεί, και το αποτέλεσμα σερβίρεται ως html στον φυλλομετρητή.

Όμως ο php δεν έχει κανένα περιορισμό όσον αφορά το τι είδους έγγραφο θα παράξει. Έτσι μπορεί εκτός από html να παράξει και άλλου είδους αρχεία, όπως css. Αυτό μας δίνει τη δυνατότητα να δημιουργήσουμε δυναμικά css που να αλλάζουν ανάλογα με τα στοιχεία που έχουμε, όπως για παράδειγμα το είδος του φυλλομετρητή που έχει ο χρήστης.

Θα χρειαστούμε το παρακάτω script που ανιχνεύει τον φυλλομετρητή, μπορείτε να το κατεβάσετε δωρεάν από εδώ

http://TechPatterns.com/downloads/phpbrowserdetection.php

Κατόπιν πρέπει να δημιουργήσουμε ένα αρχείο με κατάληξη .php (ωστε να γνωρίζει ο προεπεξεργαστής ότι πρέπει να το αναλάβει), και να δηλώσουμε πως το αποτέλεσμα είναι css και όχι html. Αυτό γίνεται με την εντολή

header("Content-Type: text/css");
στη συνέχεια φορτώνουμε το αρχείο που ανιχνεύει το φυλλομετρητή (πρέπει να βρίσκεται στον ίδιο φάκελο με το αρχείο .php που μόλις δημιουργήσαμε
include('browser_detection.php');
για τις ανάγκες του παραδείγματος θα δημιουργήσουμε 2 περιπτώσεις:
  1. Internet Explorer 7 και παλαιότερα
  2. Όλοι οι υπόλοιποι browsers
Αυτή η επιλογή αν και απλή λειτουργεί αρκετά καλά. Περισσότερες πληροφορίες για την υποστήριξη των browsers σε επόμενο post.

Με τις παρακάτω γραμμές δημιουργούμε μία boolean μεταβλητή που είναι true όταν ο φυλλομετρητής είναι IE7 (ή μικρότερο)

$abrowserdata = browserdetection('full'); $ie7=false; if (( $abrowserdata[0] == 'ie')&&( $abrowser_data[1] < 8 )) $ie7=true;
Παρατηρήστε ότι γράφουμε “<8”. Αυτό γίνεται έτσι ώστε οποιαδήποτε ενδιάμεση έκδοση πχ 7.1 να αντιμετωπίζεται ως ΙΕ7

Στη συνέχεια συντάσσουμε το stylesheet όπως θα συντάσσαμε ένα απλό .css με τη διαφορά πως όταν θέλουμε μια ιδιότητα να διαφέρει από φυλλομετρητή σε φυλλομετρητή θα την ελέγξουμε με μια συνθήκη if

if (!$ie7) echo ("color: black;"); else echo ("color: blue;");
εννοείται πως όλες τις εντολές του προεπεξεργαστή πρέπει να έχουμε φρονίσει να τις περικλείσουμε στο directive του προεπεξεργαστή
<?php //εντολές προεπεξεργαστή php ?>
Το τελικό αρχείο μας θα μοιάζει κάπως έτσι:
<?php header("Content-Type: text/css"); include('browserdetection.php'); $abrowserdata = browserdetection('full'); $ie7=false; if (( $abrowserdata[0] == 'ie')&&( $abrowserdata[1] < 8 )) $ie7=true; ?>

body{ if (!$ie7) echo ("color: black;"); else echo ("color: blue;"); }

Το συγκεκριμένο αρχείο θα εμφανίζει το κείμενο μαύρο σε ΙΕ7 και μπλε σε κάθε άλλη περίπτωση