This is my php file, index.php
<html>
<div id='hello'>Hello, <?php $name?>! How are you?</div>
</html>
This is my css file, index.css
<style>
#hello {
font-size: 36px;
color: red;
border: 1px solid red;
}
</style>
I am trying to use the library https://github.com/tijsverkoyen/CssToInlineStyles to convert my index.php file to inline css. The problem is, it converts the closing php tag '?>' to '?>' for the closing tag. I know the library is targeting HTML and my file is a .php, but are there a way to stop the '>' tag from being converted to it's respective symbol '>'? If so, how?
The index.css should contain only:
#hello {
font-size: 36px;
color: red;
border: 1px solid red;
}
The <style> is a HTML tag and it should not come in a .css file. If you have them inside your .css file, the whole file will not work.
For the what you posted, the short answer is no. At least not without tweaking the library (as you pointed out, it is intended for HTML files).
If you really (really) need to do the "conversion" dynamically (as in "each time the page is requested") you can do that on the client side by manipulating the DOM with some JavaScript. (see here).
If you need the conversion to be done only once and then leave the output file as a server resource you could use template pre-processing.
I'm not sure of why you want to convert to inline css, perhaps if you explain a bit more we could point you in the right direction.
G00d 1uck.
[UPDATE] So the conversion should be dynamic. A way to go is (instead of using a PHP file that contains HTML code with embedded echoed PHP values) to put all html + PHP 'echoed' into a string variable and then inject the result as a stream (or as an actual temp file) to the converter, wait for the output and send it by email.
No, it is (as it should) escaping those characters for you. Your css files should never contain html.
Remove the <style></style> tags and it should work. You only need those if you're putting css into your html.
Related
Im currently making a poll website. And i were trying to change the font (to a custom font(font-face)) of the h1 tag but it doesn't work. But changing the color and everything else works. I have also tried changing the tag to p and giving it an id. The custom font works on all other pages but the poll php one.
#font-face {
font-family: Ubuntu-BI;
src: url('fonts/Ubuntu-BI.ttf');
}
h1{
color: #e9e9e9;
font-family: Ubuntu-BI;
font-size: 40px;
}
<style>
<?php include 'css/pollStyle.css'; ?>
</style>
<?php <!-- HERE'S THE REST OF THE CODE
echo "<h1>$title</h1>"; //< Title of the pole
I would really appreciate some help! :)
The PHP include construct does not output anything to the page. It includes the contents of a file into the current code base. What you want to do is put this into the HTML document head:
<link rel="stylesheet" href="css/pollStyle.css"/>
There is nothing wrong with the CSS itself, the problem must lay in the way it is included. As per miken32 answer you should use a link tag to attach the stylesheet. In theory the way you have specified would work as long as this code was within the <head></head> tags.
Can we embed php code in a css file. I need to add conditions to css properties.
styles.css
<?php
if($suserid == 2)
{ ?>
.proverb { border:0px solid blue; margin-left:34px; width:250px !important; margin-top:6px; } <?php
}
else
{ ?>
.proverb { border:0px solid blue; margin-left:0px; } <?php
}
?>
Your request is bad practice. Do not proceed.
While it is technically possible to do this, you should look into alternatives. Do not dynamically generate CSS files. They will be cached by your browsers, and dynamic changes will not be propagated.
Instead, make special-case classes that you can add to the HTML. Your CSS would become:
.proverb {
border: 0px solid blue;
margin-left: 0px;
}
.proverb.user-2 {
margin-left: 34px;
width: 250px !important;
margin-top: 6px;
}
In your HTML-generating code you can have:
<div class="proverb <?php if($suserid == 2) echo "user-2"; ?>"></div>
This will add the user-2 class if the user id is 2, and gives the same result as what you wanted in your example.
A file is considered PHP by the handlers your webserver attaches to a file type or file extension. If a file is considered PHP, the contents will be executed as PHP code.
Assuming you're using apache, you can add the php handler to CSS files by adding the following in your VirtualHost file or in your .htaccess file:
<Directory "/path/to/your/css/dir">
AddType application/x-httpd-php .css
</Directory>
The only downside is this changes the output mime-type to text/html of all css files in the given directory. Therefore you have to override the mime-type so browsers know you're sending css in stead of html. Trough PHP you can use: <?php header('Content-type: text/css'); ?> on the first line of every css file.
Keep in mind changing the handler to php for css files does put more stress on your server, since every file has to be parsed before it can be sent to the output buffer. Therefore it's easier and better to just add an extra class to your html output and adjust your css accordingly, like #Rizier123 suggests.
It's possible.
First you have to tell your web server to serve *.css files through the PHP ISAPI module, then you can embed the code.
But this is not a good practice and I'd advise not to do so. There are better solutions, like SASS and LESS.
We have a less file hi_style.less:
#import "css/base-ui.less";
#hi {
margin: 100px;
}
that includes another less file css/base-ui.less with lines like this:
.ui-go {
background: #74A372 url(<?php echo $l_uri; ?>/images/ui-go.png) repeat-x scroll 50% 50%;
}
The reason we need php (unless someone has a better idea) is because there is only one codebase but we have many sites attached to separate database from that singular codebase.
e.g.
site-a.mysite.com and site-b.mysite.com both use the same code but the urls are obviously different.
Is there a way to ignore the php tags in less or a better way to have explicit urls with one codebase.
We can't use relative paths as the base path can change and point to a different codebase.
Thanks in advance.
EDIT: It can't be a static file after it's processed because the codebases can be accessed via a url like: site-a.mysite.com/testing or site-a.mysite.com/beta so the url of the image file could be:
http://site-a.mysite.com/images/ui-go.png or
http://site-a.mysite.com/testing/images/ui-go.png or
http://site-a.mysite.com/beta/images/ui-go.png depending upon the codebase that's being accessed.
It seems to me that wrapping the url string in quote marks (which is quite valid; here I did single quotes ') will solve your issue. So...
.ui-go {
background: #74A372 url('<?php echo $l_uri; ?>/images/ui-go.png') repeat-x scroll 50% 50%;
}
That allows LESS to actually output the string with the php code (rather than throw an error), then when you run your compiled css through the php parser (I assume that is what you are doing), it should still fill in the echo value as needed.
I am using TCPDF's writeHtml function for a page that renders properly in the browser.
In the output PDF, the fonts are too small. I've tried with setFont, but it doesn't seem to have an effect. Does anyone have experience with this?
I'd like to add here that the HTML is not always in my control, so I would prefer to do this with TCPDF options(and not by modifying the source html)
UPDATE: I am able to change the font size by setting it on the body. The only remaining problem is that, to render correctly in the browser, it needs to be 12px. To render correctly in the PDF, it needs be something like 30px. Do I set the media on the css? What is the media type for TCPDF?
Are you using tags? tcpdf's HTML engine gives the tag precedence over any CSS, or other size-adjusting tags. If you remove any extraneous tags from the HTML and use straight CSS, things should render as expected. Or, if you aren't using CSS, you should. Just because a browser displays it correctly doesn't mean it will look the same on other formats. The browser has likely performed some magic of its own to fill in the gaps in your CSS specifications.
UPDATE
Here's an example of specifying CSS declarations with your HTML when using tcpdf. Note how all the styling is applied using the CSS declarations inside the <style> tag outside the actualy HTML body.
<?php
$html = <<<EOF
<!-- EXAMPLE OF CSS STYLE -->
<style>
h1 {
color: navy;
font-family: times;
font-size: 24pt;
text-decoration: underline;
}
p {
color: red;
font-family: helvetica;
font-size: 12pt;
}
</style>
<body>
<h1>Example of <i>HTML + CSS</i></h1>
<p>Example of 12pt styled paragraph.</p>
</body>
EOF;
$pdf->writeHTML($html, true, false, true, false, '');
?>
The best solution that worked for me was to replace 'px' to 'pt' in html code:
$tidy = str_replace ('px', 'pt', $tidy);
Before on the left side and after replacing on the right:
TCPDF recognizes basic CSS such as font-size, font-color, and font-family.
For a little more information, check out TCPDF not render all CSS properties
I have a script that updates a CSS file based upon some user input from an html form.
The script performs a str_replace and searches the CSS file for "tags". eg-
html,body {
background: {bgcolor} url(../images/bg.jpg) repeat-x;
color: {textcolor};
}
This works great but obviously breaks that CSS file. Originally it didn't matter but because of a new feaature in my project, I need to use that CSS file.
So I was wondering if there were any better alternatives to this? I was thinking maybe something like:
html,body {
background: #fff /*{textcolor*/ url(../images/bg.jpg) repeat-x;
color: #fff /*{textcolor*/;
}
So I could then use the comment symbols within the tag as well which means my CSS file isn't broken. Only problem is how would I replace/remove the hex as well?
Presuming that you've already got the script in place which replaces the tags with their respective values, why not do something like this:
1: Create a style.php file which loads style.css
2: style.php uses your already created function to replace the tags with your default values
3: style.php sets the header as header('Content-type: text/css');
4: style.php echoes out the string that has been modified
Then rather than calling style.css throughout your script, call style.php instead.
With preg_replace():
preg_replace("/\3[\w\d]{3,6}\s\/\*\{textcolor\}\*\//", $str_hex_code, $str_css_file)