Simple WordPress "wp_head" Action Hook - php

having a problem which is driving me crazy, reason being that it should be a really simple fix, basically in my "footer.php" file I need some lines of CSS added to the "wp_head" hook. What I expected to work was this:
<?php function footer_widgets() { ?>
<style type="text/css">
#footer {
border-top:0 !important;
margin-top:0 !important;
padding-top:0 !important;
}
</style>
<?php } add_action('wp_head', 'footer_widgets');?>
This does nothing, the weird thing is if I change the hook from "wp_head" to "wp_footer" it outputs to that hook fine, but this needs to be in "wp_head".
If anyone has any idea how to solve this it would be much appreciated.
Cheers,
Tom.

On a normal page, your footer.php isn't included until after wp_head has already run. See that get_footer() in your template? That's when this code runs. You need to include this code in a file that is loaded earlier in the page lifecycle (e.g. functions.php).

Related

PHP and CSS font-face doesn't work

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.

Override wp-login.php styles

I have a Wordpress CMS website where most labels are needed to be white. So the theme includes the below styles per form labels.
.login label {
color: #fff;
font-size: 14px;
}
This above style is populated from within /wp-login.php file -- the style itself is located in the login.min.css (which is included directly within wp-login.php)
I need to override this ONLY for the forget password screen.
Luckily there are custom ID selectors for the two labels I need to be black in this instance. #pass1 #pass2
My problem is, I have NO ACCESS to /wp-login.php and login.min.css -- I have tried adding !important and declaring these two selectors within header.php but they were not read.
I need to somehow add; with current permission situation.
#pass1 { color: #000 !important; }
#pass2 { color: #000 !important; }
Could I use jQuery from header.php or footer.php to append the style? Would it be read?
It's not best practice to edit any wp core files, so I'd advice not to touch wp-login.php anyway, since updating WordPress can reset things.
Instead, add this to your functions.php:
// Custom login
function custom_login() {
$files = '<link rel="stylesheet" href="'.get_bloginfo('template_directory').'/css/login.css" />';
echo $files;
}
add_action('login_head', 'custom_login');
Since the login and forgot password screens are not theme dependent, your header.php file will not be read, so any styles you put in there won't affect these pages.
Add this to your template.php file
function my_login_stylesheet() {
wp_enqueue_style( 'custom-login', get_template_directory_uri() . '/style-login.css' );
}
add_action( 'login_enqueue_scripts', 'my_login_stylesheet' );
and then add your custom styles to style-login.css
login_head and login_enqueue_scripts are called one after another, so it doesn't matter which one you're using...
Using wp_enqueue_style is the best practice but it can be echo '<link rel="stylesheet" ...>'; without problem.
I'm adding a solution because this isn't the kind of code that you just drop onto your theme functions.php. We want to keep the code running even if we swap themes. So a functionality plugin comes handy:
<?php
/*
Plugin Name: Login CSS
*/
function custom_login() {
$CSS = <<<CSS
<style>
.login label {}
</style>
CSS;
echo $CSS;
}
add_action('login_head', 'custom_login');
Check the following to learn about the Heredoc sintax used to build the $CSS string: What is the advantage of using Heredoc in PHP ?

Cannot target text element in CSS

I am using a very simple free Wordpress theme that I am really happy with but I cannot figure out how to move the names of the budgies along to the right:
http://swearingbudgies.co.uk/
I have tried Firebug to find out how to do this but the only tag I can see is a: - problem is when I apply padding-left to a: it also shunts the images along. Will this require changes to the html/php as well as the CSS to fix?
Add the following class in your CSS. Next time onwards don't come up with site url. Add your problem in fiddle/codepen or something like that and post here your code. Otherwise people will give downvote and close your question including me.
a.image_link + div
{
text-align:right;
}
try
#main-content div.post div{
text-align:right;
}

if (is_archive()) not working wordpress

I know a fair bit about HTML, CSS, jQuery but I haven't dabbled with PHP yet. I was given a code to help me apply a style to the webpage, only if it was a blog page:
<?php if(is_archive()){ ?>
<style type="text/css">
.wrap {
max-width: 1200px !important;
}
</style>
<?php } ?>
This, inserted into the header file, has worked perfectly since. On my return to work after a short absence I find that this code is still in the same place it has always been but is no longer effective? As the code gives the archive pages a max-width, these now look dreadful without it because the margin: 0 auto doesn't work either.
Take a look for yourself here. I'm not sure if this code is written correctly because I recently found that hostgator's file browser editor had added code to files I'd edited when I was out of office. Any help is appreciated but please bear in mind that I know nothing about PHP, other than where to copy and paste it.
You can try replacing your normal wrap class with this:
<div class="wrap<?php echo (is_archive()) ? ' full-width' : ''; ?>">
Then you can access this via #container .wrap.full-width {width: 1200px!important;}

Wordpress <?php body_class(); ?> issue

I built my theme into WordPress and all was good, then I wanted to add woocommerce to the theme to add a shop. The woocommerce was not showing its styles. So I did some research and found the reason was my <body> tag should of been <body <?php body_class(); ?>>.
This was not in the guide I followed to convert the html.
So I added the tag in and the woocommerce styling appears fine. BUT the whole site has pushed left.
Here is the site - www.theinurse.com could anyone let me know why? I have tried a few things in css but nothing has resolved it. If i edit the following css the site moves
html, body {
height: 100%;
margin: 0pt;
}
If I edit margin it moves, but if I set margin-left: auto; margin-right:auto; etc etc it does nothing. But if I do margin-left:100px; it moves the site right 100px.
Baffling me! If I remove the body_class tag it sits perfectly. Please help me.
Can you try to replace this:
<?php body_class(); ?>
by this:
<body <?php body_class(); ?>>
?
If you have declared
add_theme_support( 'woocommerce' );
the system expect you to have the WooCommerce styles integrated in your theme stylesheet. This is why it don't call for the default stylesheet.
You forgot the re-add the body class Frame. Your CSS code uses the Frame class to center the content.
<body <?php body_class('Frame'); ?>>
The Codex entry for body_class() states there is a parameter $class.
class (string or array) (optional)
One or more classes to add to the class attribute, separated by a single space.
Use this parameter to make WordPress include the extra body classes you've added yourself.

Categories