2 Replies - 358 Views - Last Post: 19 June 2020 - 01:16 AM

#1 LEON1937   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 12
  • Joined: 13-June 20

How to implement CSS which is customised by user

Posted 18 June 2020 - 03:28 PM

I use CSS to apply zebra style stripes to tables.

I would like to make this custom by user, some will prefer a plain white table, some will like light green and light blue stripes and so on.

I could just give them a few options, or a complete free hand to set the striping as they prefer.

I'm planning on holding this in a SQL Server table which I can update for the user.

The table will have columns USERID, ODD, EVEN

I can then set:
fred, cornsilk, aliceblue
ben, white, azure

and so on, and in my web page the select statement would be:
select, ODD, EVEN from ZEBRA_Table where USERID = 'LoggedInUserID'

And I can use the returned columns ODD and EVEN in my style settings for the zebra striping.

tr:nth-child(even) {
background-color: <CFOUTPUT>#ZEBRA_Table.EVEN#</CFOUTPUT>
}
tr:nth-child(odd) {
background-color: #<CFOUTPUT>ZEBRA_Table.ODD</CFOUTPUT>#
}

(I use Coldfusion by the way to access SQL Server tables)

I know this will work, but is there a better way?

Is This A Good Question/Topic? 0
  • +

Replies To: How to implement CSS which is customised by user

#2 Martyr2   User is offline

  • Programming Theoretician
  • member icon

Reputation: 5552
  • View blog
  • Posts: 14,558
  • Joined: 18-April 07

Re: How to implement CSS which is customised by user

Posted 18 June 2020 - 10:27 PM

Yup, link to a PHP/CF file as your link tags href value. Then in the PHP/CF file you specify a header saying it is a content type of text/css. For example (I am using PHP here as an example but you can use CF too)...

<link rel="stylesheet" type="text/css" media="screen" href="user_styles.php">



Then in your user_styles.php file you start with...

<?php
header('Content-Type: text/css');

// PHP code that echos out CSS style tags based on storage details (pull out of a database and set $bgColor for instance)
echo ".body { background-color: $bgColor; }";



This is nice because your PHP/CF script can fully determine how the styles are determined. You can read from a DB field, a cookie etc. and then generate the CSS styles that eventually are used by the user's browser to style the page.

It also helps you keep all the styles in a single file and you can pull out multiple styles at once, alter variables as you see fit etc. Full power of a server side language, but in a CSS file.

This post has been edited by Martyr2: 18 June 2020 - 10:48 PM

Was This Post Helpful? 1
  • +
  • -

#3 LEON1937   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 12
  • Joined: 13-June 20

Re: How to implement CSS which is customised by user

Posted 19 June 2020 - 01:16 AM

Cheers Martyr2 Pretty much along the lines I was thinking, nice to have it confirmed. I don't have permission at work to publish my pages so I try to move things out of the hardcoded page to a file I can update and a SQL Server table is ideal for this, and includes my queries and MOTD and so on. MOTD = Message Of The Day
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1