Use CSS to "echo" timetable data

How are you planning on filling the data via that CSS once implemented?

I think for it to be dynamic, you would have to be appending something to that :after pseudo-element via a php template-tag or something similar, depending on where it would be drawing that information from for the current DJ.

You could alter the base template of the page to output the DJ name along with the rest of the content. Another option is to use javascript to set the DJ name. Which approach is best depends on where the current DJ name is coming from, and if it needs to change during the stream.

If the name changes during the stream, you should look at a javascript implementation. Since javascript can alter CSS styling, your CSS approach remains viable, though javascript can also simply change the content of an HTML container. All other things being equal, it’s better to not involve CSS to set content.

Thanks for the response guys

I was only using CSS as it was ultimately the only way I knew how to edit the content.

The DJ name comes from the timetable, I don’t wish to display the time info just the basic DJ name/show name

Forgot to add there’s no need for than me to change during stream, the only time the DJ name should change is if it’s the next slot so it would change to the next DJ

Just thought I’d add some more info, this doesn’t have to be CSS it’s just that’s the only way I knew of manipulating that data

There’s a lot to be said about going with what you know! Using CSS does simplify things in some ways. The main problem is you normal CSS pages are static, and you now need dynamic styling. Thus some PHP is going to be involved. While what I’m going to suggest is not the proper way to manage dynamic CSS, given that it’s basically a one liner CSS, I think it’ll be OK.

We are going to hook the ‘wp_head’ action to output a basic <style> block containing the desired CSS. The one missing crucial element is how we would extract the desired DJ name from the time table. Where is this information? What format is it stored in?

Excluding getting the DJ name, the rest of the code would look like this:

add_action('wp_head', 'tb_add_dj_name', 999 );
function tb_add_dj_name() {
   $dj_name = 'Replace this phrase with code to get DJ name';
   echo "<style>#strm_radio .nowPlaying h5 a.streamName.icon-signal::after { content: \" $dj_name\"; }</style>";
}