CODEWITHSUNDEEP
phpcss
LineCommander Official
LineCommander Official

Reputation: 43

Is there a way to mix CSS and PHP?

I'm working on a wordpress theme, and i want to have a custom header background. I used to use add_theme_support('custom-header); function that wordpress offers, it works but not the way i want it to. I want to have a background-image instead of an img. I made a function called header_background_callout() and i added a section, setting and control. the function works and outputs the background url that the user chooses through the customize section in wordpress. Is there a way that i can do something like this in css? : background-image: url(<?php echo wp_get_attachment_url(<?php get_theme_mod()); ?>);

Thanks in advance.

Upvotes: 1

Views: 340

Answers (4)

LineCommander Official
LineCommander Official

Reputation: 43

I found this easy way and it works the best:

In your Index.php file add:

<?php 

       function bg_img_alt() {
         if(get_theme_mod('vibe_hero_background_setting') > 0) {
           return wp_get_attachment_url(get_theme_mod('vibe_hero_background_setting'));
         }else{
           return get_template_directory_uri() . '/img/bg.jpeg';
         }
       }
?>

        <style type="text/css">

       background: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url(<?php echo bg_img_alt(); ?>);
       background-repeat: no-repeat;
       background-position: center;
       background-size: cover;
       background-attachment: fixed;
    </style>

Upvotes: 0

Łukasz Mazan
Łukasz Mazan

Reputation: 171

You can add inline styles to your theme using wp_add_inline_style:

<?php wp_add_inline_style( $handle, $data ); ?>

where $data is the CSS you want to include in your theme. This way you can have your php variables loaded as CSS for your website.

Upvotes: 1

Laeeq Khan Niazi
Laeeq Khan Niazi

Reputation: 648

try this. echo " backgroud-img = 'url('get_theme_mod()')' ";

Upvotes: 1

Andreas
Andreas

Reputation: 23958

Yes kind off.
I made my css file a php file and because of that I can do as you say 

background-image: url(<?php echo get_theme_mod(); ?>); // I suppose you need to echo the mod?

In the HTML you use it like;

<Link rel="stylesheet" type="text/css" href="style.php">

Edit you may need to change the header of the php file to a css file by: 

<?php header("content-type: text/css; charset: UTF-8"); ?>

Upvotes: 0

Related Questions