Jump to content

Help getting a custom styles php file working


onjegolders
 Share

Recommended Posts

Inspired by Soma's Colorpicker module I'm trying to implement some custom styles for links, backgrounds etc.

Martijn said it was possible to add a php file with css in it and echo out the variables in that.

I've tried but can't seem to get it going. I've added a custom_styles.php file outside of templates because I believe you cannot have PHP scripts running in there and I've added

<?php header("Content-type: text/css"); ?> to the top of the file as advised by Martijn but none of the variables are getting parsed.

Has anyone got anything similar working.

Currently I'm using Diogo's suggestion of inline styles in the head tags but it just feels a bit wrong (but it is working) :)

Link to comment
Share on other sites

Hiya, yep sorry about the mix-up that's what I meant.

I've actually seen the CSS tricks article but couldn't get what he describes to work.

He mentions that to get it to work on WP he had to change the htaccess file, wasn't sure if PW would be similarly effected.

I can't seem to get $pages and other API calls to work in my styles.php file.

Link to comment
Share on other sites

Thanks Martijn

I finally have it working with the following steps for all those interested.

Create a file eg custom_styles.php outside of the templates folder

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

<?php include("file://localhost/Applications/MAMP/mamp_sites/pw_template/index.php"); 

?>

<?php 

$link_color = $wire->pages->get("template=settings")->link_color;

?>

.test_header {
color: #<?php echo $link_color; ?>;
}

Make sure to use $wire rather than $pages

  • Like 1
Link to comment
Share on other sites

I don't know the drawbacks of this, but I just managed to do make the dynamic stylesheet proposed on css tricks work has a pw template. So, this is how to do it (someone stop me if this is a bad bad thing to do):

1. Create a template file css.php and put all your css code inside. On the top of the file put this code <?php header("Content-type: text/css"); ?>.

2. Create a "css" PW template with that file.

3. Create a "css" page and give it the "css" template.

4. Link to the stylesheet like this <link rel="stylesheet" href="<?php echo $pages->get('/css/')->url; ?>">.

5. use the PW API on your stylesheet :)

Extra:

6. put some fields on the "css" template and use them on your css

Examples: the color picker field for colors; an image field with your style pictures (background, logo, etc).

edit: onjegolders was faster!

edit2: not the same answer. Mine is more interesting ;)

  • Like 9
Link to comment
Share on other sites

Yours is way more interesting!

Is there any benefit to creating a page in the admin?

I'm just creating a variable $settings which is a shortcut to my settings page and then getting

$settings->link_color

$settings->header_font

etc

On another note, I'm trying to think of the best way to give them a choice of fonts (I know, I know, this is turning into Wordpress ;)

At present, I'm just using a text field and then in the description giving them choices they can enter and if they enter something wrongly, it just falls back to default font.

Link to comment
Share on other sites

Is there any benefit to creating a page in the admin?

You don't have to bootstrap PW, and you can use $pages instead of $wire->pages.

I'm trying to think of the best way to give them a choice of fonts

I think page field with radios input would be better for this. You will have to create a page "fonts" with a page for each font inside, and define has parent for the page field.

Link to comment
Share on other sites

You don't have to bootstrap PW, and you can use $pages instead of $wire->pages.

I think page field with radios input would be better for this. You will have to create a page "fonts" with a page for each font inside, and define has parent for the page field.

Hmmm good point about not having to bootstrap, will have a think.

I thought about adding pages for fonts but it seemed a but ridiculous having a page just to give them a font choice!

Link to comment
Share on other sites

  • 1 year later...
  • 6 months later...

i don't think ProCache is overwriting the header - i think that it is serving the file that is generated from a .html file in the cache, and since those files are .html , they will always be sent as text/html; would be curious if there were some magic htaccess way to make it work

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...