I'm building a small site, that needs to support 2 languages for the same page.
Each language has different buttons on the page, the buttons are basically some images with text inside.
The positioning of the buttons is done using a CSS file, one for every language.
Question is how do I implement the changing of button for every image. I could put a php if statement, and use some other src if lang == English or something else if lang == Russian, Or could implement this with the css file (I could do this with a div and set it's background in the CSS)? What would you recommend?
Cheers.
You could create three CSS files:
One for english buttons
One for russian buttons
One for the rest
This would basically work this way: You create your buttons with a fallback name, for example
<button id="button_ok">OK</button>
and define different background images in your english/russian CSS files:
(english.css)
#button_ok {
background-image: url(images/buttons/eng/ok.gif);
}
and (russian.css)
#button_ok {
background-image: url(images/buttons/rus/ok.gif);
}
All other elements that do not change when the language is chosen come in the third file:
p {
font-size: 1em; /* whatever*/
}
The last step is to choose at the top of every page which file you want to load:
if ($_GET['lang'] == 'eng')
$cssFile = 'english.css';
elseif ($_GET['lang'] == 'rus')
$cssFile = 'russian.css';
and include the special and the general css file in your head:
<link rel="stylesheet" type="text/css" href="general.css" />
<link rel="stylesheet" type="text/css" href="<?php echo $cssFile; ?>" />
I would recommend using CSS by setting the background and size of the button.
use < button> tag, its better because you can use css like "button{}" without having to put a class on it. Just a remind that < button> has a type like the input and it is "submit" as default if I remember correctly.
Btw, always try to depend on CSS instead of PHP, because on a next manutenance you will be glad that you did it.
or, if you going to use PHP, try using a function instead of hardcoding, even if it is just for one button, we never know if we will use it later.
hope it helped,
Joe
Related
I was wondering if there was a way using php or javascript to see if my webpage will be longer than one page when printed. I have specific elements that need to be at the bottom of the page regardless of how long the content in the middle of the page is, (max one page including footer).
Tried various css elements such as bottom.
Have you tried making a separate 'print.css' file that only alters the way a page looks when it is going to be printed? <link rel="stylesheet" type="text/css" href="print.css" media="print">. This can also be done with an #media print { } tag in your regular css file.
I'm a novice php learner, I was experimenting how to link different php files dynamically. While experimenting, I realize I can create variables in my php files and make my template files echoes out the html I need without editing my template files......
for example:
Within about-me.php page, I have included my header.php and footer.php using
<?php include ('includes/header.html'); ?>
<?php include ('includes/footer.html'); ?>
then I create a variable
$page_title = 'CompanyABC';
and echo out in the header.php
$page_title = 'South Asia Exact';
Now my question is can I do this to my inline css also?
for example, I have create a variable, that store all my inline css:
$page_inlinecss = "#SAEcontentR div#certification_certificate {
margin:0 auto 0 auto;
width:580px;
height:464px;
}\n";
then I echo out in my header.php like so:
<style type="text/css">
<?php echo $page_inlinecss; ?>
</style>
I have tried it and it works, but I want to know is it the right way to do it?
There isn't a right way to do inline CSS
Your code will work, it will produce a valid page, and it will look absolutely fine to the user. BUT you shouldn't do it that way.
So, why shouldn't you do it that way?
Maintainability is the main reason that you shouldn't handle CSS this way. It is far easier to manage a separate CSS file than to pick through PHP code looking for CSS rules to change.
It looks like the data you're storing is static, the point of a variable is to store data that can change. Things like the name of the website (Company ABC) are unlikely to change during the execution of the script, so you should include them in the static HTML template.
On top of this are issues like caching (most browsers cache .css files, saving you bandwidth) and accessibility (screen readers may not know how to deal with inline styles & js).
How should you handle dynamic styles?
One way to handle dynamic styles (that is -- styles based on information which will be different on different page loads) with a combination of PHP and CSS is to define class styles in your external document and then use PHP to apply them.
For example, put this in styles.css:
span.greentext { color: #0f0; }
And this in your PHP file:
<span class='<?php echo ($someCondition) ? "greentext" : null; ?>'>Some text</span>
Or, if you have more styles to handle:
Alternatively, you could load a specific stylesheet upon a condition:
<?php if($someCondition): ?>
<link rel="stylesheet" href="styles/conditional.css" type="text/css" media="screen">
<?php endif; ?>
Hope this helps, and please don't use inline CSS, or variables, unless necessary. You'll thank yourself for it when you have to change the site 5 months down the line.
Can you do this? Yes.
Should you do this? Ehh. (No. was a bit harsh...)
Better to store the CSS filename in a php variable, then in the header add:
<link rel="stylesheet" href="<?php echo $this_page_style_sheet; ?>" />
There is no right or wrong in this case.
You may store the CSS in a string and echo it as you see fit. Or you may even embed it in your includes/header.html file. It's up to you.
Personally, if it is a collection of CSS rules, I would keep it in its own CSS file, and just echo the filename when needed.
$css_filename = "/path/to/rules.css";
// ... etc etc
<link rel="stylesheet" href="<?php echo $css_filename; ?>">
This is a beauty and a pitfall of the way the system works. You can do that, it works and it doesn't seem to present any immediate and glaring security issues. I don't know if that was an intended use of PHP, but it works so if it fits your situation you can use it. The pitfall comes when enough of these little workarounds are used that eventually a security issue could arise somewhere, but I don't recall CSS ever being used as a vector for an attack.
You can do this to generate dynamic css
file css.php
<?php
header("Content-Type: text/css");
echo 'p {color:red}';
?>
html (not complete but it should work cross browser)
<link rel="stylesheet" href="css.php" type="text/css" />
<p>This should be red</p>
Some more strict/uptight folks might say that proper CSS doesn't need variables, yadda yadda.
Personally I think if this works, then it's a clever way to add some ease-of-use to CSS. I'm all for it.
I have a multiple pages website where I wan't to change some css stuffs.
So my index.php?p=page points to various pages but on every page I also want to adjust some css like the color of the currently active menu item(li) etc.
What is the best way to achieve this? Should i just make a php var on each page?
One way to handle this is to put a class on the BODY tag for each page, then make different subclasses for the stuff that changes. This way you don't need to feed in any variables from PHP. It's all done via CSS.
<body class="pageOne">
CSS:
.pageOne h1 {
color:#ff0000
}
.pageTwo h1 {
color:#000000
}
You should have the CSS on an external file, and link it using a <link> tag, like so:
<link rel="stylesheet" type="text/css" href="path_to_stylesheet.css">
How can I add some parameters to all urls on all pages in WordPress? I am working on a theme development and I need to show to a potential customer different variants of using it. So, I have different color schemes. I found a tutorial about how to get parameters from url and use them in my code. Now I easily use an url like http://proceed.skible.com/?color=magic_night to attach a CSS file with color scheme settings. It works fine but when I click any link on a demo page, it obviously doesn't apply my custom color scheme but applies the one that is saved in the settings. I think I can go this way - add ?color=magic_night or whatever color scheme I need to all links. Of course, I need to parse the links and add it right way, not just insert it at the end of every url. More than that, may be there are better ways for implementing the possibility for previewing misc features of the theme? I saw the way I described here: http://themes.mysitemyway.com/infocus/?themedemo=infocus&extracss=deep_blue. All links end with extracss=deep_blue or another theme I choose from the menu.
Thanks.
You should use PHP cookies to store the users colour preference between HTTP requests, but allow them to override it using the GET variables you are talking about:
# Get the value of color if specified on the URL (GET) or in a cookie
# If non of those place have the color, then color will be NULL
$color = isset($_GET['color']) ? $_GET['color'] : (
isset($_COOKIE['color']) ? $_COOKIE['color'] : NULL
);
# If we know what color we have and didn't just get it from a cookie
# then set a cookie with that color as its value
if ($color != NULL && isset(! $_GET['cookie'])) {
setcookie('color', $color);
}
Now that you have the $color value you can pick your stylesheet in whatever way you want to, for example:
<?php
if ($color != NULL) {
?> <link rel="stylesheet" href="<?php bloginfo('stylesheet_direcctory'); ?>/<?php print($color); ?>.css" type="text/css" /> <?php
}
?>
P.S. My PHP syntax is a bit rusty, but the concept should be all there
If I'm understanding you right, you want to use a different stylesheet based on what url parameters are passed? You can do that in the header file of your theme:
header.php:
//includes
<html>
...
<head>
...
<?
if($_GET['color'] == 'magic_night'){
?>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_direcctory'); ?>/magic_night.css" type="text/css" />
<?
}
else
...
?>
...rest of the page...
bloginfo('stylesheet_direcctory') should get you to your theme directory, but I would echo it first in a test file or use a better parameter to bloginfo.
I'm doing a project in codeginiter these days, i want to print just the text area when the print button is clicked? can you guys help me to achieve this?
regards.
Rangana
codeigniter is an excellent framework, but unfortunately doesn't quite apply in this case because php is a server side scripting language and printing is done clientside. For printing a given area you'll want to use some javascript, specifying the div you want to print out. I would recommend the jQuery library as it has a print plugin I've used in a few of my projects. So you would use php to define code like this
<div id="content"> ... </div>
<div id="print_button">Print</div>
<script type="text/javascript">
// javascript goes here, if you were using jQuery
// with the PrintArea pluginyou might do...
$("div#print_button").click(function(){
$("div#content").printArea([options]);
});
</script>
Which would then execute client side when the print button is pressed.
Check out jquery here http://jquery.com/
There's also the vanilla window.print() function with setting up a print stylesheet if you don't want to use jQuery.
If you want to define certain elements to be printed only you need to create a separate css stylesheet:
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
Every element which should not be printed can be hidden using display: none;. See this page for more infomation.