[Resolved] PHP and CSS in one hook

[Bill Forsyth III]

Hello,
I’m starting to experiment with pulling code out of functions.php and putting it inside a hooks.

The php function below works fine but the formatting is missing. I’m trying to include the needed css as part of the same hook. I’m not sure how to wrap that css to get it function properly. This is my code as it currently stands. When the page loads, the css is rendered as plain text.

I assume / hope that it’s possible to bundle the css and php together, it sure would be a clean way to keep the site tidy.

Thanks,
Bill

————————————————————————-

.woocommerce .product-price-matrix {
background: #842c38;
padding: 10px;
color: #fff;
}
.initialism, .text-uppercase {
text-transform: uppercase;
}

<?php
add_action( ‘woocommerce_single_product_summary’, ‘price_matrix’, 60);

function price_matrix() {
global $wpdb, $post;

// code removed to shorten post
}
}
?>

[Leo]

Hi there,

I wouldn’t recommend doing that.

CSS and PHP should be added separately.

The PHP function you are using should be added as a function and not a hook as woocommerce_single_product_summary is already a hook.

[Bill Forsyth III]

That makes sense about not having hooks within a hook. I was just copying the pertinent chunk out of the old functions.php.

I’ve de-hooked the php code in the hook it is now:

<?php
	global $wpdb, $post;

	$parent_id = $post->ID;

        // code removed to shorten post
}
?>

I’ve separated the css into another woocommerce_product_meta_end hook with a priority of 1, and it’s still showing up as plain text instead of being handled like css directions. I thought I saw examples where css was being used in a hook. Am I confused? I love the idea of having all of the pertinent one-use code and css together in one location for future maintenance.

Thanks,
Bill

[David]

Hi there,

if you need to hook in CSS then it needs to be <style></style> tags e.g

<style>
/* Your CSS in here */
</style>

But you may find it better to just add the CSS to your Additional CSS or child theme.

[Bill Forsyth III]

That’s it! That’s exactly what I was looking for!

I was trying to wrap the css in a <css></css> tag, but <style></style> was actually what I needed, and it allows me to put the css in the same hook as the php.

I prefer the css together with the php for the hook content, as it’s legacy spaghetti code that I’m trying to isolate. By lumping all of the offending code together, I can replicate the site in Generate Press and keep all of the unknown / questionable code isolated for only when it is needed, rather than junking up functions.php and the global css.

[David]

Glad to be of help!

[Author]

Posts